@charset "utf-8";
/* CSS Document */
/****************************************************************************************************
* Filename:Main.css
* Purpose:All the main CSS Rules required to design web pages.
****************************************************************************************************/
@import url("basic.css");	
@font-face {
    font-family: 'MyriadPro_Regular';
    src: url('fonts/MyriadPro-Regular.eot');
    src: url('fonts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/MyriadPro-Regular.otf') format('opentype'),
         url('fonts/MyriadPro-Regular.ttf') format('truetype'),
         url('fonts/MyriadPro-Regular.svg#MyriadPro_Regular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'MyriadPro_SemiboldIt';
    src: url('fonts/MyriadPro-SemiboldIt.eot');
    src: url('fonts/MyriadPro-SemiboldIt.eot?#iefix') format('embedded-opentype'),
         url('fonts/MyriadPro-SemiboldIt.otf') format('opentype'),
         url('fonts/MyriadPro-SemiboldIt.ttf') format('truetype'),
         url('fonts/MyriadPro-SemiboldIt.svg#MyriadPro_SemiboldIt') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MyriadPro_Semibold';
    src: url('fonts/MyriadPro-Semibold');
    src: url('fonts/MyriadPro-Semibold.eot?#iefix') format('embedded-opentype'),
         url('fonts/MyriadPro-Semibold.otf') format('opentype'),
         url('fonts/MyriadPro-Semibold.ttf') format('truetype'),
         url('fonts/MyriadPro-Semibold.svg#MyriadPro_Semibold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MyriadPro_Bold';
    src: url('fonts/MyriadPro-Bold.eot');
    src: url('fonts/MyriadPro-Bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/MyriadPro-Bold.otf') format('opentype'),
         url('fonts/MyriadPro-Bold.ttf') format('truetype'),
         url('fonts/MyriadPro-Bold.svg#MyriadPro_Bold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'MyriadPro_Bold';
    src: url('fonts/MyriadPro-Bold.eot');
    src: url('fonts/MyriadPro-Bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/MyriadPro-Bold.otf') format('opentype'),
         url('fonts/MyriadPro-Bold.ttf') format('truetype'),
         url('fonts/MyriadPro-Bold.svg#MyriadPro_Bold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*** BODY (GLOBAL SETTING)***/
body {font:normal 13px 'MyriadPro_Regular', Arial, Helvetica, sans-serif; background:#dcdcc2;}

/*** MAIN WRAPPERS ***/
#mainwrapper {}
.wrapper {width:960px; margin:0 auto;}
.padLf{ padding-left:20px;}
#header {background:#1c5371; height:527px;}
.navbar{background:#dcdcc2; height:105px; margin-top:62px;}
#header img{float:right; padding-top:10px; padding-bottom:10px; padding-right:5px;}
#header .LogoImg{float:left; margin-left:20px; margin-top:-20px;}
#header .header_text{font-size: 36px;	font: 'MyriadPro_Semibold';font-weight: normal; padding-top:20px; padding-bottom: 15px;color: #1c5371;}
#header .header_text1{font-size: 32px;	font: 'MyriadPro_Semibold';font-weight: normal;padding-bottom: 5px;color: #fff;}
#header .subHeaderText{font-size:34px; color:#000; font-weight:normal;}


/*** MAIN NAV ***/
ul#globalnav  {padding: 20px 10px 0 0; margin-top:-30px;}
ul#globalnav li {display:inline; float:left; margin-left:30px}
ul#globalnav li a {color:#1b1b1b; font-size:16px; font-weight:bold; display:block; float:right; padding-bottom:3px;}
ul#globalnav li a:hover,ul#globalnav li a.active {color:#203266; border-bottom:2px solid #1c5371}

ul#globalnav > li{display: inline-block; position: relative; }
ul#globalnav > li ul {display: none; z-index:5; position:absolute; width: 200px; padding-right:0px; border: 1px solid #666; border-top-color: 1px solid #666; margin-top: 25px;}
ul#globalnav > li:hover ul {display: block; background-color:#dcdcc2; }
ul#globalnav > li ul li {padding-bottom:5px;padding-top:5px; font-size:12px; height:20px; display: block} /* Vertical Menu */


/*** LISTS ***/
#header .list {padding-bottom:15px}
#header .list.normal li {width:100%} 
#header .list li {display:inline; float:left; width:550px}
#header .list li p {padding-left:35px; font-size:18px; color:#FFF; background:url(../images/Yello_Bullet.png) 8px 5px no-repeat; margin-left:5px; padding-bottom:15px; line-height:normal; font-weight:normal;}
#header .list li p a{font-size:20px; color:#FFF;}
.readBtn{background:#FFF; padding:5px; font-size:10px; font: 'MyriadPro_Semibold'; color:#000; font-weight:bold; border-radius:10px; text-decoration:none;}

.viewBtn{width:109px; height:34px; background:url(../images/ViewMoreBtn.png) 0 0 no-repeat; padding:5px; font-size:16px; color:#fff; border:none; font-weight:bold;}

#serviceList {position: absolute;width: 100%; height: 104px;z-index: 1;	left: 0px;	top: 100px;	float: left; padding-left:20px;}
#serviceListHeader {position: absolute;	width: 420px;height: 51px;z-index: 1;left: 5px;top: 40px; padding-left:20px;}
#serviceListHeader p{ font-size:28px; color:#FFF; text-align:left;}
#slider {position: absolute;width: 400px;height: 200px;	left: 570px;top: -10px;}
.bgimage{ background:url(../images/dubai_bg2.png); width:100%; height:527px; margin-left:20px;}
.aboutusbg{ background:url(../images/dubai_bg.png); width:100%; height:360px; margin-left:20px;}
.techbg{ background:url(../images/tecnicalbg.png); width:100%; height:360px; margin-left:20px;}
.kitchenbg{ background:url(../images/kitchenbg.png); width:100%; height:360px; margin-left:20px;}
.businessbg{ background:url(../images/businessbg.png); width:100%; height:360px; margin-left:20px;}
.artsbg{ background:url(../images/artbg.png); width:100%; height:360px; margin-left:20px;}

/*** CONTAINER ***/

#ContainerBg{background:url(../images/Container_BG2.png) -175px 0 repeat-y; width:100%; height:auto; padding-left:20px; padding-right:20px;}
#ContainerTop { width:100%; height:441px; }
#ContainerBox1 {position: absolute;	width: 236px; height: 441px; z-index: 1; left: 20px;	top: -40px;	color:#000;	background: url(../images/Yellow_Box_Tall.png) 0 0 repeat-x;}
#ContainerBox2 {position: absolute;	width: 236px; height: 441px; z-index: 1; left: 262px;	top: -40px;	color:#000;	background: url(../images/Yellow_Box_Tall.png) 0 0 repeat-x;}
#ContainerBox3 {position: absolute;	width: 236px; height: 441px; z-index: 1; left: 503px;	top: -40px;	color:#000;	background: url(../images/Yellow_Box_Tall.png) 0 0 repeat-x;}
#ContainerBox4 {position: absolute;	width: 236px; height: 441px; z-index: 1; left: 744px;	top: -40px;	color:#000;	background: url(../images/Yellow_Box_Tall.png) 0 0 repeat-x;}

#Icon1 {position: absolute;	width: 50px;height: 50px;z-index: 1;left: 8px;top: -4px;}
#Icon2 {position: absolute;	width: 50px;height: 50px;z-index: 1;left: 185px;top: -4px;}
#TechnicalFnt {position: absolute;width: 108px;	height: 49px;z-index: 2;left: 60px;	top: 10px;}
#TechnicalFnt h2 {font-size:22px; font-weight:bold; text-align:center;}
#cirlcleImg {position: absolute;width: 204px;height: 196px;	z-index: 1;	left: 20px;	top: 90px;}

#briefDescr {position: absolute;width: 203px;height: 67px;	z-index: 99;top: 223px;}
#briefDescr p{font-size:15px; font-weight:bold; line-height:20px; text-align:left;}
#viewMore {	position: absolute;	width: 134px;height: 50px;	z-index: 99;top: 78px;	left: 42px;}
#viewMore a .viewBtn{width:109px; height:34px; background:url(../images/ViewMoreBtn.png) 0 0 no-repeat; padding:5px; font-size:16px; color:#fff; border:none; font-weight:bold;}
#viewMore a:hover .viewBtn{width:109px; height:34px; background:url(../images/ViewMoreBtnHover.png) 0 0 no-repeat; padding:5px; font-size:16px; color:#fff; border:none; font-weight:bold;}

#leftColumn{  float:left; background:#ffaf00; width:219px; height:auto; margin-right:10px; margin-right:10px; }

#leftColumn h3{font-size:15px; color:#000; text-transform:uppercase; padding-top:20px; padding-bottom:16px; border-bottom:1px solid #000;}
#leftColumn .list{padding-bottom:15px; width:100%;}
#leftColumn .list li {display:inline; float:left; width:219px;}
#leftColumn .list li p { border-bottom:1px solid #000; font-size:14px; color:#000; font-weight:bolder;  padding-top:15px; padding-left:15px; padding-right:10px; padding-bottom:15px; line-height:normal; font-weight:normal; text-align:left; color:#000; font-weight:bold;}
#leftColumn .list li p:hover, #leftColumn .list li p.active{ border-bottom:1px solid #FFF; background:url(../images/hover_listBg.png); color:#000;}



#containernormal{  padding:20px; height:auto;}
#containernormal h1{font-size:32px; margin:50px 0px 30px 300px; }
#containernormal h2{font-size:32px; margin:20px 0px 30px 0px; }
#containernormal .Headborder{ margin-left:280px; background:url(../images/border_bottom_img.png); width:450px;}
#containernormal h3{font-size:16px; font-weight:bold; font-style:italic; padding-bottom:10px;}

#containernormal p{font-size:14px; line-height:28px;; font-weight:normal; padding-bottom:10px;}
.linedevider{width:100%; border:1px solid #ffaf00; font-weight:normal; margin-top:10px;}
#containernormal p span{font-size:17px; font-weight:bold; font-style:italic; padding:20px 0px;}
#containernormal p a{ color:#F60; font-size:14px; text-decoration:none;}
#containernormal table{width:75%; margin-left:100px;}
#containernormal table td{ vertical-align:top;}
#containernormal .list1 {padding-bottom:25px}
#containernormal .list1 li {display:inline; float:left; width:350px}
#containernormal .list1 li p {padding-left:35px; font-size:16px; color:#000; background:url(../images/BulletBlackSmall.png) 2px 6px no-repeat; margin-left:0px; padding-bottom:5px; line-height:25px;}

#containernormal .ContactForm{width:450px; min-height:450px;}
#containernormal .ContactForm .txtField{width:350px; height:30px; float:left; border:2px solid; -moz-border-radius: 9px; -webkit-border-radius: 9px; color:#A2A2A2; border-radius:9px;	behavior: url(border-radius.htc); padding:5px; margin-bottom:20px; border-color:#5C5540; font-family:'Open Sans'; font-size:20px; padding-left:4px;  background:#7C7560; }
#containernormal .ContactForm .txtField:focus{ border:2px solid #D7580E;} 
#containernormal .ContactForm .txtArea:focus{ border:2px solid #D7580E;}

#containernormal .ContactForm .txtField1{width:900px; height:120px; float:left; border:2px solid; -moz-border-radius: 9px; -webkit-border-radius: 9px; color:#A2A2A2; border-radius:9px;	behavior: url(border-radius.htc); padding:5px; margin-bottom:20px; border-color:#5C5540; font-family:'Open Sans'; font-size:20px; padding-left:4px; background:#7C7560;}
#containernormal .ContactForm .txtField1:focus{ border:2px solid #D7580E;} 
#containernormal .ContactForm .txtField1:focus{ border:2px solid #D7580E;}

#Submtbtn {background:#D8CD6D; width:365px; height:40px; display:block; margin:0 auto; font-size:16px;  color:#1E1D19; font-weight:bold; text-align:center; line-height:18px; border-radius:9px; -moz-border-radius:9px; -webkit-border-radius:9px; float:left; border:1px solid #5C5540;}
#Submtbtn:hover {background:#CFBF24}

<!--GALLERY CSS-->

ul.thumb {
	position:relative;
	float: left;
	list-style: none;
	margin: 0; padding: 10px;
	width: 180px;
}
ul.thumb li {
	margin: 0; padding: 15px;
	float: left;
	position: relative;
	width: 230px;
	height: 80px;
	margin-bottom:20px;
}
ul.thumb li img {
	width: 200px; height: 130px;
	border: 0px solid #ddd;
	padding: 5px;
	background: #B1CD49;
	position: absolute;
	left:-14px; top: -10px;
	
	
}

#main_view {
	float: left;
	padding: 9px 0;
	margin-left: -10px;
}

/* jQuery lightBox plugin - Gallery style */
	#gallery {
	
		margin-left: 20px;
		margin-top: 20px;
		width: 960px;
		min-height:2100px;
	}
	#gallery ul { list-style: none; }
	#gallery ul li { display: inline; padding:0px 0px 80px 0px}
	#gallery ul img {
		background: #fff; border: 1px solid #888888; box-shadow: 10px 10px 20px #888888; padding:2px; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; margin-bottom: 50px; overflow:hidden; width:180px; height:130px;
	}
	#gallery ul a:hover img {
		background: #fff; border: 1px solid #00b6f1; padding:2px; border-radius: 7px; -moz-border-radius: 7px; -webkit-border-radius: 7px; margin-bottom: 10px; overflow:hidden; width:180px; height:130px;
	}
	#gallery ul a:hover { color: #fff; }
	

#containerMiddle{width:100%;background:#ffaf00; height:141px; margin-top:30px;margin-bottom:30px;}
#containerMiddle .leftPart{width:450px; margin-left:50px; float:left;}
#containerMiddle .leftPart h2{float:left; margin-left:10px; font-size:24px; padding-top:10px;}
#containerMiddle .leftPart p{float:left; width:210px; height:40px; margin-left:20px; font-size:14px; padding-top:10px; line-height:24px;}
#containerMiddle .leftPart .viewBTN{float:left; margin-left:20px;padding-top:20px;}
#containerMiddle .rightPart{width:400px; margin-right:50px; float:right;}
#containerMiddle .rightPart h2{float:left; margin-left:10px; font-size:24px; padding-top:10px;}
#containerMiddle .rightPart h3{float:left; font-weight:bolder; margin-left:8px; font-size:24px; padding-top:10px;}
#containerMiddle .rightPart p{float:left; width:150px; height:40px; margin-left:20px; font-size:14px; padding-top:10px; line-height:24px;}
#containerMiddle .rightPart .viewBTN{float:left; margin-left:20px;padding-top:20px;}


#containerBottom{position:relative; width:100%; height:200px; margin-top:20px; margin-left:20px; color:#2E2E2E; font-weight:normal;}
#containerBottom .col1{width:250px; padding-right:30px;}
#containerBottom .col1 h2{font-size:18px; font-weight:bold; padding-bottom:10px; color:#000;}
#containerBottom .col1 p{width:100%; font-size:14px; line-height:24px;}
#containerBottom .col1 p .author{font-size:16px; font-weight:bold; font-style:italic; color:#000; padding-top:10px;}
#containerBottom .devider{padding-left:20px; width:3px; height:200px;}
#containerBottom .col1 p a{font-size:13px; color:#666; font-style:italic; float:right;}

#containerBottom .col2{width:250px; padding-left:30px; padding-right:30px;}
#containerBottom .col2 h2{font-size:18px; font-weight:bold; padding-bottom:10px; color:#000;}
#containerBottom .col2 .list1 {padding-bottom:15px}
#containerBottom .col2 .list1 li {display:inline; float:left; width:300px}
#containerBottom .col2 .list1 li p {padding-left:35px; font-size:16px; color:#000; background:url(../images/BulletBlack.png) 8px 4px no-repeat; margin-left:0px; padding-bottom:10px; line-height:35spx;}
#containerBottom .col2 .list1 li p:hover {background:url(../images/BulletYellow.png) 8px 4px no-repeat;}
#containerBottom .col2 .list1 li p a {font-size:16px; color:#2E2E2E;}
#containerBottom .col2 .list1 li p a:hover { color:#b87f01; text-decoration:none;}

#containerBottom .col3{width:250px; padding-left:30px; padding-right:30px;}
#containerBottom .col3 h2{font-size:18px; font-weight:bold; padding-bottom:10px; color:#000;}
#containerBottom .col3 p{width:100%; font-size:14px;}

.techiconlf{background:url(../images/Technical1.png) 0 -3px no-repeat; width:50px; height:64px; float:left;}
.techiconrf{background:url(../images/Technical2.png) 0 -3px no-repeat; width:50px; height:64px; float:right;}
.kitciconlf{background:url(../images/Catering1.png) 0 -3px no-repeat; width:50px; height:64px; float:left;}
.kitciconrf{background:url(../images/Catering2.png) 0 -3px no-repeat; width:50px; height:64px; float:right;}
.bussiconlf{background:url(../images/BuildingMaterial1.png) 0 -3px no-repeat; width:50px; height:64px; float:left;}
.bussiconrf{background:url(../images/BuildingMaterial2.png) 0 -3px no-repeat; width:50px; height:64px; float:right;}
.articonlf{background:url(../images/Art3.png) 0 -2px no-repeat; width:58px; height:64px; float:left;}
.articonrf{background:url(../images/Art2.png) 0 -3px no-repeat; width:50px; height:64px; float:right;}


/*** FOOTER ***/
#footer {background:url(../images/FooterBg.png) 0 0 repeat-y; width:100%; height:100px; padding:18px 0; font-size:13px; color:#fff; }
#footer .colleft{width:520px; padding-right:30px;}
#footer .colleft .folowus{float:left; margin-left:10px; }
#footer .colleft p{font-size:13px; padding-top:10px; color:#b3b3b3; line-height:24px;}
#footer .colleft p a{ color:#b3b3b3; font-size:13px; text-decoration:none;}
#footer .colright{width:400px; }
#footer .colright p a{font-size:13px; color:#b3b3b3;}
#footer .colright p a:hover{ text-decoration:underline;}
#footer .colright p img{float:right; padding-top:20px; padding-bottom:10px; padding-right:5px;}

