@charset "utf-8";
/* CSS Document */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;

	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

a {
    color: inherit;
    text-decoration: none;
    transition: all .4s ease;
}
body {font-family:'Open Sans', sans-serif; font-size: 75%; font-weight:300; line-height:1.5em; background-color:#fff;}	

#envelop { margin: 0px ;width: 100%; overflow:auto }


/*********************** banner ******************************/


/************Main contents *************/
#header_wrap {width:100%;  position:relative; }
#header {width: 90%; margin: 0 auto; position:relative; height: 116px;/* border-bottom:#ccc 1px solid*/}
.clear {clear: both}
.logo {float: left;position: relative; margin: 2em 0 0 0}
#wrapper { width:100%; position:relative; margin: 0px auto; /* remove the hight after testing **/}

/*********** // Sub content *****************/
#content { width:95%; margin: 20px auto ; position: relative; /*border-top: solid 1px #CCC;*/ font-family:'Open Sans',Tahoma, san-serif; overflow:auto}

/********** //Menu ***************/
#menu {font-family: 'Open Sans', sans-serif;position: relative;float: left; width: 70%;  height: 96px; margin: 0px 0 0px 50px; position:relative; z-index:7}
#menu ul {font-weight:300; height:110px}
#menu ul li { float: left; list-style-type:none;display:block;  text-align:center; height:90px }
#menu ul li a { color:#000/*D32B40*/ !important; display:block; margin: 0px; padding: 60px 20px 5px 20px; text-transform:uppercase ;transition: background-color 1000ms ease; text-decoration:none}
#menu ul li a:hover  {color: #fff !important;  display:block; background-color:#F00;padding: 60px 20px 15px 20px; transition: padding 0.6s;}

#menu ul li a:active {text-decoration:none; color:#E53138}
#menu ul li .current {color: #fff !important;  display:block; background-color:#F00;padding: 60px 20px 15px 20px; transition: padding 0.6s;}

#results {;transition: display 1000ms ease;}

/*************** about us *******************/

#a_content {  width:90%; margin: 20px auto ; position: relative; /*border-top: solid 1px #CCC;*/ font-family:'Open Sans',Tahoma, san-serif;  background-color:#fff/*F1F2F2/*#F7F7F7/*#E3EBF0*/; }


.a_left {float: left; width:21%; margin: 0px 0 0 0px; background-color:#fff/*#c1c1c1*/; padding:10px 0 10px 10px; margin: 0 auto}
.a_left p {padding:10px}
.a_left h2 {font-size: 4em; text-transform:uppercase; font-weight:normal; color: #000;line-height:1em}
.a_left h3 {color:#000; font-size: 4em; border-top: 5px solid #000; font-weight:100; text-transform:uppercase; padding: 1em 10px 10px;line-height:1em}

.a_left_white { background-color:#3D577C; margin: 20px 10px 10px 0}
.a_left_white p {color:#fff}

.a_left h4{text-transform:uppercase;font-size: 24px; font-weight:normal; margin: 20px 0 10px 0; line-height:24px; color:#999}



.a_left2 {float: left; padding: 5px 10px 10px 0px; width:90%;margin: 0px 0 0 20px;background-color:#fff; width:70% }
.a_left2 h2 {font-size: 3em; text-transform:uppercase; font-weight:300; color: #000; margin:0 0 0.5em 0}

.a_row {width: 90%}




.redtext {color:#f00; font-weight:300; font-size:1.10em }
.profile {float: left; margin-right: 0px; width:45%}
.profile_left {float:left;/*border-bottom: 1px solid #999*/}

.image-wrap {
	position: relative;
	overflow: hidden;
	margin: 0  30px 25px 0;
	cursor: pointer;
	width:180px; float:left
}

.image-wrap img {
	/*width: 100%;	*/
	float:left
	
}

.img_left {float: left; margin: 0 30px 0 0}
.image-wrap  .hover-wrap {
	position: absolute;
	display: block;
	width: 180px;
	height: 100%;
	
	opacity: 0;
	filter: alpha(opacity=0);
	
	-webkit-transition: all 450ms ease-out 0s;	
	   -moz-transition: all 450ms ease-out 0s;
		 -o-transition: all 450ms ease-out 0s;
		    transition: all 450ms ease-out 0s;
		  
	-webkit-transform: rotateY(180deg) scale(0.5,0.5);
	   -moz-transform: rotateY(180deg) scale(0.5,0.5);
		-ms-transform: rotateY(180deg) scale(0.5,0.5);
		 -o-transform: rotateY(180deg) scale(0.5,0.5);
			transform: rotateY(180deg) scale(0.5,0.5);	
}

.image-wrap:hover .hover-wrap,
.image-wrap.active .hover-wrap {
	opacity: 1;
	filter: alpha(opacity=100);
	
	-webkit-transform: rotateY(0deg) scale(1,1);
	   -moz-transform: rotateY(0deg) scale(1,1);
		-ms-transform: rotateY(0deg) scale(1,1);
		 -o-transform: rotateY(0deg) scale(1,1);
		    transform: rotateY(0deg) scale(1,1);
}

.image-wrap .hover-wrap .overlay-img {
	position: absolute;
	width: 100%;
	height: 100%;
	background: #DE5E60;
	
	opacity: 0.80;
	filter: alpha(opacity=80);
}

.image-wrap .hover-wrap .overlay-text-thumb {
	position: absolute;
	width: 100%;
	height: 32px;
	top: 50%;
	margin: -16px 0 0 0;
	color: #FFFFFF;
	font-size: 20px;
	font-weight: 300;
	line-height: 32px;
	text-transform: uppercase;
	text-align: center;
	
	opacity: 1;
	filter: alpha(opacity=100);
}

.profile-name {
	margin-bottom: 15px;
	color:#666;	

	font-size: 20px;
	font-weight: normal;
	border-bottom: 1px solid #ccc;
	border-left: 3px solid #f00;
	line-height:1.19em;
	padding: 0em 0 0 0.5em 
}

.profile-name h3 {margin: 0 0 0 50px;}
.profile-description {
	margin-bottom: 1em;	
	width: 90%;
	line-height:1.5em;
	color:#666
}

.row2 {float: left; width: 40%; margin: 4em 2em 1em 0px; padding:1em; background-color: #ccc;}
.row2 h2 {color:#3D577C; font-size:1.6em;}
.row2 p span {color:#3D577C; font-size: 12px; font-weight:bold}

.row3 {float: left; width: 45%; margin: 4em 2em 1em 0px; padding:1em; border-left: 1px solid #ccc;background-color: #ccc}
.row3 h2 {color:#3D577C; font-size:1.6em;}
.row3 p span {color:#3D577C; font-size: 12px; font-weight:bold}

.social-icons {
	margin: 0;
	padding: 0;
}

.social-icons li {
	display: inline-block;
	margin-left: 15px;	
}

.social-icons li:first-child {
	margin-left: 0;
}

.social-icons li a{
	color:#39C;
	font-size: 16px;
	line-height: 1em;
	width: 16px;
	height: 16px;
	
	opacity: 0.3;
	filter: alpha(opacity=30);
	
	-webkit-transition: opacity 0.1s linear 0s;	
	   -moz-transition: opacity 0.1s linear 0s;
		 -o-transition: opacity 0.1s linear 0s;
		    transition: opacity 0.1s linear 0s;
}

.social-icons li a:hover{
	opacity: 1;
	filter: alpha(opacity=100);
	color:#00559B
}





/******* Project ************/
#p_content { width:95%; margin: 0px auto ; position: relative; /*border-top: solid 1px #CCC;*/ font-family:'Open Sans',Tahoma, san-serif; overflow:auto; background-color:/*#fff*/#2F3238/*#E3EBF0*/; height: 550px; }


/*************** filtere ********************/

#workbar {float:left; width: 300px; margin: 40px 20px 0 20px; position:fixed}
#workdetails {float:left; width: 960px; margin: 20px 20px 0 350px; overflow: hidden; }

#workbar h3 {font-size:30px; font-weight:normal;  color:#fff; margin: 0 0 20px 0}
#workbar h2 {color:#fff; font-size: 30px;line-height: 1.1em; border-top: 5px solid #fff; font-weight:100; text-transform:uppercase; padding: 40px 10px 10px;}


.float-left {float: left; position: relative; top: -10px; margin-right: 15px;}
		.float-right {float: right; position: relative; top: -10px; margin-right: 15px;}
	#container {width: 960px; margin: 0 auto; float:left }

		/* filters */
		#filter {list-style-type: none; margin: 20px 0 0; padding: 0; width: 200px}
		#filter li, #filter a {display: block; float: left; margin: 0; width: 160px;}
		#filter a { text-decoration: none; padding: 5px 10px; font-size: 1.1em; color:#fff}
		#filter a.active {background: red; color:#fff;}
		#filter a:hover {background:  color:#fff; border: dotted 1px #CCC; margin-left:10px}

		/* grid */
		#grid {float: left; position: relative; width:960px;}
		.item {width: 210px; height: 135px; background: grey; float: left; margin: 10px 10px 15px; color: #fff; font-size: 60px; text-align: center; line-height: 135px; cursor: default;}
		.residential {background:  url(../_img/profile-02.jpg) no-repeat;}
		.residential2 {background:  url(../_img/profile-03.jpg) no-repeat;;}
		.commercial1 {background:  url(../_img/profile-01.jpg) no-repeat;}
		.commercial2 {background:  url(../_img/profile-07.jpg) no-repeat;}
		.institutional1 {background:  url(../_img/profile-04.jpg) no-repeat;}
		.institutional2 {background:  url(../_img/profile-08.jpg) no-repeat;}
		.industrial1 {background:  url(../_img/profile-09.jpg) no-repeat;}
		.apartment1 {background:  url(../_img/profile-05.jpg) no-repeat;}
		.apartment2 {background:  url(../_img/profile-06.jpg) no-repeat;}
		
		/* ********** Residential *********** */
		.res-01 {background:  url(../_img/res_small-01.jpg) no-repeat;}
		.res-02 {background:  url(../_img/res_small-02.jpg) no-repeat;}
		.res-03 {background:  url(../_img/res_small-03.jpg) no-repeat;}
		.res-04 {background:  url(../_img/res_small-04.jpg) no-repeat;}
		.res-05 {background:  url(../_img/res_small-05.jpg) no-repeat;}
		.res-06 {background:  url(../_img/res_small-06.jpg) no-repeat;}
		.res-07 {background:  url(../_img/res_small-07.jpg) no-repeat;}
		.res-08 {background:  url(../_img/res_small-08.jpg) no-repeat;}
		.res-09 {background:  url(../_img/res_small-09.jpg) no-repeat;}
		.res-10 {background:  url(../_img/res_small-10.jpg) no-repeat;}
		.res-11 {background:  url(../_img/res_small-11.jpg) no-repeat;}
		.res-12 {background:  url(../_img/res_small-12.jpg) no-repeat;}
		.res-13 {background:  url(../_img/res_small-13.jpg) no-repeat;}
		.res-14 {background:  url(../_img/res_small-14.jpg) no-repeat;}
		.res-15 {background:  url(../_img/res_small-15.jpg) no-repeat;}
		.res-16 {background:  url(../_img/res_small-16.jpg) no-repeat;}
		.res-17 {background:  url(../_img/res_small-17.jpg) no-repeat;}
		.res-18 {background:  url(../_img/res_small-18.jpg) no-repeat;}
		.res-19 {background:  url(../_img/res_small-19.jpg) no-repeat;}
		.res-20 {background:  url(../_img/res_small-20.jpg) no-repeat;}
		.res-21 {background:  url(../_img/res_small-21.jpg) no-repeat;}
		.res-22 {background:  url(../_img/res_small-22.jpg) no-repeat;}
		.res-23 {background:  url(../_img/res_small-23.jpg) no-repeat;}
		.res-24 {background:  url(../_img/res_small-24.jpg) no-repeat;}
		.res-25 {background:  url(../_img/res_small-25.jpg) no-repeat;}
		.res-26 {background:  url(../_img/res_small-26.jpg) no-repeat;}
		.res-27 {background:  url(../_img/res_small-27.jpg) no-repeat;}
		.res-28 {background:  url(../_img/res_small-28.jpg) no-repeat;}
		.res-29 {background:  url(../_img/res_small-29.jpg) no-repeat;}
		.res-30 {background:  url(../_img/res_small-30.jpg) no-repeat;}
		.res-31 {background:  url(../_img/res_small-31.jpg) no-repeat;}
	
		
		/* ********** Apartment *********** */
		.apt-01 {background:  url(../_img/apt_small-01.jpg) no-repeat;}
		.apt-02 {background:  url(../_img/apt_small-02.jpg) no-repeat;}
		.apt-03 {background:  url(../_img/apt_small-03.jpg) no-repeat;}
		.apt-04 {background:  url(../_img/apt_small-04.jpg) no-repeat;}
		.apt-05 {background:  url(../_img/apt_small-05.jpg) no-repeat;}
		.apt-06 {background:  url(../_img/apt_small-06.jpg) no-repeat;}
		.apt-07 {background:  url(../_img/apt_small-07.jpg) no-repeat;}
		.apt-08 {background:  url(../_img/apt_small-08.jpg) no-repeat;}
		.apt-09 {background:  url(../_img/apt_small-09.jpg) no-repeat;}
		.apt-10 {background:  url(../_img/apt_small-10.jpg) no-repeat;}
		.apt-11 {background:  url(../_img/apt_small-11.jpg) no-repeat;}
		.apt-12 {background:  url(../_img/apt_small-12.jpg) no-repeat;}
		
		
		
		/* ********** Institutional *********** */
		.ins-01 {background:  url(../_img/ins_small-01.jpg) no-repeat;}
		.ins-02 {background:  url(../_img/ins_small-02.jpg) no-repeat;}
		.ins-03 {background:  url(../_img/ins_small-03.jpg) no-repeat;}
		
		
		/* ********** Industrial *********** */
		.ind-01 {background:  url(../_img/ind_small-01.jpg) no-repeat;}
		.ind-02 {background:  url(../_img/ind_small-02.jpg) no-repeat;}
		.ind-03 {background:  url(../_img/ind_small-03.jpg) no-repeat;}
		.ind-04 {background:  url(../_img/ind_small-04.jpg) no-repeat;}
		
		/* ********** commercial *********** */
		.com-01 {background:  url(../_img/com_small-01.jpg) no-repeat;}
		.com-02 {background:  url(../_img/com_small-02.jpg) no-repeat;}
		.com-03 {background:  url(../_img/com_small-03.jpg) no-repeat;}
		.com-04 {background:  url(../_img/com_small-04.jpg) no-repeat;}
		.com-05 {background:  url(../_img/com_small-05.jpg) no-repeat;}
		.com-06 {background:  url(../_img/com_small-06.jpg) no-repeat;}
		.com-07 {background:  url(../_img/com_small-07.jpg) no-repeat;}
		.com-08 {background:  url(../_img/com_small-08.jpg) no-repeat;}
		.com-09 {background:  url(../_img/com_small-09.jpg) no-repeat;}
		.com-10 {background:  url(../_img/com_small-10.jpg) no-repeat;}
		.com-11 {background:  url(../_img/com_small-11.jpg) no-repeat;}
		.com-12 {background:  url(../_img/com_small-12.jpg) no-repeat;}
		.com-13 {background:  url(../_img/com_small-13.jpg) no-repeat;}
		.com-14 {background:  url(../_img/com_small-14.jpg) no-repeat;}
		.com-15 {background:  url(../_img/com_small-15.jpg) no-repeat;}
		.com-16 {background:  url(../_img/com_small-16.jpg) no-repeat;}
		.com-17 {background:  url(../_img/com_small-17.jpg) no-repeat;}
		.com-18 {background:  url(../_img/com_small-18.jpg) no-repeat;}
		
		/* ********** religious *********** */
		.rel-01 {background:  url(../_img/rel_small-01.jpg) no-repeat;}
		.rel-02 {background:  url(../_img/rel_small-02.jpg) no-repeat;}
		
		.item-thumbs {
	position: relative;
	overflow: hidden;
	margin-bottom: 10px;
	cursor: pointer;
}

.item-thumbs a + img {
	width: 100%;	
}

.item-thumbs .hover-wrap {
	position: absolute;
	display: block;
	width: 100%;
	height: 135px;
	background: #DE5E60;
	opacity: 0;
	filter: alpha(opacity=0);
	-webkit-transition: all 450ms ease-out 0s;
	-moz-transition: all 450ms ease-out 0s;
	-o-transition: all 450ms ease-out 0s;
	transition: all 450ms ease-out 0s;
	-webkit-transform: rotateY(180deg) scale(0.5,0.5);
	-moz-transform: rotateY(180deg) scale(0.5,0.5);
	-ms-transform: rotateY(180deg) scale(0.5,0.5);
	-o-transform: rotateY(180deg) scale(0.5,0.5);
	transform: rotateY(180deg) scale(0.5,0.5);
	left: 0px;
}

.item-thumbs:hover .hover-wrap,
.item-thumbs.active .hover-wrap {
	opacity: 0.80;
	filter: alpha(opacity=80);

	
	-webkit-transform: rotateY(0deg) scale(1,1);
	   -moz-transform: rotateY(0deg) scale(1,1);
		-ms-transform: rotateY(0deg) scale(1,1);
		 -o-transform: rotateY(0deg) scale(1,1);
		    transform: rotateY(0deg) scale(1,1);
}

.item-thumbs .hover-wrap .overlay-img {
	position: absolute;
	width: 100%;
	height: 100%;
	background: #DE5E60;
	
	opacity: 0.80;
	filter: alpha(opacity=80);
}

.item-thumbs .hover-wrap .overlay-img-thumb {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -16px 0 0 -16px;
	color: #FFFFFF;
	font-size: 32px;
	line-height: 1em;
	
	opacity: 1;
	filter: alpha(opacity=100);
}



/*********** // Sub content *****************/
#footer { width:95%; margin: 0px auto 20px; position:static; bottom: 0px;  /*border-top: solid 1px #CCC;*/ font-family:'Open Sans',Tahoma, san-serif; background-color:#000;  height:30px; opacity: 0.6; overflow: hidden}

#footer .left {float:left; width: 50%}

#footer p {color: #fff; padding: 5px 5px 5px 30px; font-size: 87%; font-weight:300}
#footer .left p  {color:#fff; font-weight:bold}

/************* // contacts *******************/
#c_content { width:95%; margin: 0px auto ; position: relative; /*border-top: solid 1px #CCC;*/ font-family:'Open Sans',Tahoma, san-serif; background-color:#F7F7F7/*#E3EBF0*/;}

#cbar {float:left; width:auto; height:250px; margin:80px 0 20px 10%;}

#cleft {float:left; width: 30%; height:250px; margin:80px 0 0em 1em; background-color:#000; color:#fff}
#cleft h3 {color:#fff; font-size: 24px; font-weight:100; text-transform:uppercase; padding: 0px 10px 10px}
#cleft h4 {color:#CCC; font-size: 18px; font-weight:100; text-transform:uppercase; padding:0px 0 5px 10px; }
#cleft h5 {color:#fff; font-size: 16px; font-weight:100; text-transform:uppercase; padding:0px 0 5px 10px; margin-top:20px}
#cleft p {color:#aeaeae; padding:0px 0 0px 10px; }
#cleft hr {height:1px; color:#333}
#cright {float:left; width: 30%; margin:80px 0; background-color:#;}

/************** forms *******************/


/* form 2 */

	#form2{
		margin:0px auto;
		color:#000;
		width:95%; /* customize width, this form have fluid layout */
		}
	#form2 h3{
		margin:0;
		background:#DE5E60/*57a700 url(../images/form2/form_heading.gif) repeat-x*/;		
		color:#fff;
		font-size:20px;
		border:1px solid #f00;
		border-bottom:none;
		}		
	#form2 h3 span{
		display:block;
		padding:10px 20px;
		background:url(../images/form2/form_ico.gif) no-repeat 93% 50%;			
		}				
	#form2 fieldset{
		margin:0;
		padding:0;
		border:none;	
		border-top:3px solid #000;
		background:#fff url(../images/form2/form_top.gif) repeat-x;		
		padding-bottom:1em;

		}		
	#form2 legend{display:none;}	
	#form2 p{margin:.5em 20px;}	
	#form2 label{display:block;}	
	#form2 input, #form2 textarea{		
		width:385px;
		border:1px solid #111;
		background:#eaeaea url(../images/form2/form_input.gif) repeat-x;
		padding:5px 3px;
		color:#000;
		}		
	#form2 textarea{
		height:125px;
		overflow:auto;
		}					
	#form2 p.submit{
		text-align:right; text-transform:uppercase
		}	
	#form2 button{
		padding:0 20px;
		height:32px;
		line-height:32px;		
		border:1px solid #fff;
		background:#DE5E60 url(../images/form2/form_button.gif) repeat-x;
		color:#fff;
		cursor:pointer;		
		text-align:center;		
		}				

/* // form 2 */

/******************************************/
/*********Services ******************/
#s_content { width:90%; margin: 0px auto ; position: relative; /*border-top: solid 1px #CCC;*/ font-family:'Open Sans',Tahoma, san-serif;  background-color:#fff/*#E3EBF0*/;}

#sbox1 {float:left; width: 20%; margin:2em 1em; background-color:#fff; color:#EAEAEA}
#sbox1 h2 {color:#000; font-size: 3em; border-top: 5px solid #000; font-weight:300; text-transform:uppercase; padding: 2em 1em;line-height:1em}

.sbox2 {float:left; width:30%;  margin:2em 3em 5em 0px;  color:#333}
.sbox2 img {text-align:left;padding:10px 0; margin:0 }
.sbox2 h3 {color:#000; font-size: 1.8em; font-weight:100;  padding: 10px 0px ;color:#000; text-align:left}