/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300);

.content{margin:40px; width:100%; padding:20px; overflow:auto; background:#fff;}

.content p{font-size: 13px;}

		/*.content p:nth-child(even){color:#999; font-size:17px; }

		.content p:nth-child(3n+0){color:#c96;}*/


body
{
	margin:0;
	padding:0;
	
	font-family: 'Open Sans', sans-serif;
	font-size:13px;
	color:#797979;

	width:100%;
	height:100%;
	min-width:1024px;
}
.mainmenu li .about_tabs
{
	text-align:left;
	margin-left:20px;
	display:block;
	margin-top:5px;
}
.subtab_clicked{text-decoration:underline;}
a
{
	text-decoration:none;
	color:#b3b3b3;
}

ul
{
	list-style:none;
	margin:0px;
	padding:0px;
}

.clear
{
	clear:both;
}

.slider-wrapper { 
	width:600px;
	
}

img
{
	border:none;
}


/*----------------------------------------------------------Main page styles-------------------------------------------------*/

#slideshow 
{
	position:absolute;
	left:220px;
	z-index: 1000;
}

.maincontainer, .maincontainer_content
{
	position:relative;
	min-width:1100px;
	z-index:0;
}

.left_section_back
{
	position:absolute;
	left:0px;
	right:0px;
	width:230px;
	background:#f4f4f4;
	/*color: rgba(0, 0, 0, 0.5);*/
	z-index:1;
}

.wrapper
{
	
}

.vertical_border
{
	border-left:1px solid #e6e6e8;
	position:absolute;
	left:230px;
	
}

.slide
{
	/*border-left:#e6e7e8 1px solid;*/
}

.project_thumb
{
	
	/*cursor:pointer;*/
}

.connector
{
	float:left;
	margin-top:45px;
	margin-left:-1px;
}

.thumbs
{
	float:left;
	border:2px solid #e6e7e8;
	margin-left:5px;
	cursor:pointer;

}

.project_thumb .thumbs img
{
	width: 140px;
}


.project_cat
{
	margin-left:20px;
	margin-bottom:20px;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size:24px;
}

.thumb_details
{
	clear: both;
	font-size:13px;
	padding-left:18px;
	margin-top:15px;
}

.thumb_details strong
{
	text-transform: uppercase;
}

.wrapper_inner
{
	position:absolute;
	top:40px;
	left:0px;
	width:100%;
}


.left_section
{
	position:fixed;
	left:0px;
	top: 35%;
	z-index:2;	
}

.logo_menu_section
{
	width:142px;
	padding-left:35px;
	padding-right:35px;
}

.logo
{
}

.mainmenu
{
	width:142px;
	margin-left: 16px;
	margin-top:20px;
	font-size:13px;
}

.mainmenu li
{
	margin-bottom:5px;
}


.mainmenu li ul
{
	text-align:left;
	margin-left:20px;
	display:none;
	margin-top:5px;
}

.mainmenu li ul li a
{
	color:#999;
}
.mainmenu li ul li a:hover, .mainmenu li ul li a.clicked
{
	color:#999;
	text-decoration:underline;
}


.mainmenu ul li a:hover
{
	color:#CCC;
}

.mainmenu ul li a.clicked
{
	color:#333;
}

.right_section
{
	position:absolute;
	right: 0;
}


ul li:hover ul 
{
	display:block;
}

/*----------------index styles---------------*/

.home_bg
{
	/*background:url(../images/index_bg.jpg) no-repeat center center;*/
	min-height:100%;
	min-width:100%;
	height:100%;
	width:100%;
	overflow:hidden;
	background-size:cover;
	z-index:-1;
	position:absolute;
	top:0px;
	left:0px;
	
}

.home_bg img
{
	position:absolute;
	top:0px;
	left:0px;
	min-height:100%;
	min-width:100%;
}

.white_stripes
{
	z-index:2;
	position:absolute;
	top:0px;
	left:0px;
	overflow:hidden;
}

.white_stripes ul li
{
	background:#000;
	background-color: rgba(0, 0, 0, 0.8);
	/*color: rgba(0, 0, 0, 0.5);*/

}


.project_title
{
	margin-top:10px;
	float:right;
	text-align:right;
	padding-bottom:10px;
	display: none;
}

.project_slideshow
{
	position:relative;
	clear:both;
	width: 100%;

}

.bxslider_project{
	
	height: 500px;
	overflow: hidden;

}

.bxslider_project li img{

	width: 100%;

}

.slide_divider_1
{
	position:absolute;
	left:200px;
}

.slide_divider_2
{
	position:absolute;
	left:400px;
}

.project_content
{
	clear:both;
	padding:50px;
	width:600px;
	padding-bottom:20px;
	
}


.project_content_left
{
	float:left;
	width:280px;
	font-size:13px;
	margin-right:20px;
}


.projectthumb1, .projectthumb2
{
	display:none;
}




/*----------------------------------------------------other page styles------------------------------------------*/

.right_content
{
	position:absolute;
	left:230px;
	width:600px;
	padding-left:30px;
	border-left:1px solid #e6e7e8;
	z-index:0;
	
}

.about_header
{
	font-size:36px;
	width:600px;
	text-align:justify;
	padding-bottom: 40px;
}

.about_img
{
	margin-top:20px;
	
}


.about_content
{
	clear:both;
	margin-top:20px;
	width:100%;
	padding-bottom:20px;
	
}


.about_content_left
{
	float:left;
	width:300px;
	font-size:12px;
	margin-right:20px;
}

.about_team
{
	margin-top:30px;
}

#map_canvas
{
	width:100%;	
	height:100%;
	position:absolute;
	left:0;
	top:0;

	background: url('../images/contact.jpg') center no-repeat;
	background-size: cover;
}

#contact_detail
{
	position:absolute;
	z-index:1000;
	top: 35%;
	left: calc(50% - 115px);
	transform: translateX(-50%);
	/*box-shadow:0px 0px 20px 1px #D8D8D8;*/
	background:#FFF;
	/*background:rgba(255,255,255,0.93);*/

	padding:20px;

	width: 50%;
	max-width: 600px;
}


.cd-left{
	float: left;
	box-sizing: border-box;
	padding: 20px;
}


#project_thumb_slider{
	width: 200px;
	height: 100%;
	float: left;


	position: absolute;
	z-index: 1000;
	left: 220px;
	top: 0;
	padding-left: 0px;
	border-left: 1px solid #CCC;
	

}


/* projects_slider */

#projects_slider {

	max-width: 200px;
	height: 100%;

	margin-top: 30px;
	overflow: hidden;
	padding: 0;
	
}



#t_slider_next, #t_slider_prev{
	position: absolute;
	z-index: 1001;
	top: 40px;
	right: 5px;
	cursor: pointer;
}

#t_slider_next{
	position: absolute;
	
	right: -20px;
	cursor: pointer;
}

#projects_slider ul li {


	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis;

	height: 130px;
	padding: 10px 16px 10px 0px;

	list-style: none;
	
	text-align: left;
}

#bg_slideshow{
	position: absolute;
	z-index: 1000;
	top: 0;
	left: 230px;
	width: 100%;
	height: 100%;
}

.map-link{
	color: #797979;
	text-decoration: none;
	padding-left: 20px;
	position: absolute;
	right: -27px;
	top: -1px;

}

.map-link:before{
	content: "";
	display: inline-block;
	position: absolute;
	top: 1px;
	left: 0;
	width: 16px;
	height: 16px;
	background:  url('../images/marker.png') no-repeat;
	opacity: 0.5;
}

.map-link:hover:before{
	opacity: 0.8;
}