/* CSS Document */
body,h1,h2,h3,p,td,quote,small,form,input,ul,li,ol,label{
	margin:0px;
	padding:0px;
	
}

body {color: #999;
	font-family:Helvetica,sans-serif;
	font-size:11px; 
	text-align:left; 
	background-color:#FFF;
}

#container {
width: 1024px;
min-height:768px;
height:768px;
	display:block;
	overflow:hidden;
	margin: 20px auto 0;
	position:relative;
}


a#details{font:700 13px 'Istok Web', sans-serif;}
.quote{font:400 13px 'Istok Web', sans-serif;}

#content {
	display:block;
}

/* Used through pages */

a:link,a:visited { color:#999;text-decoration:none;outline:none; }
a:hover { color:#666;text-decoration: none; }

.clear{clear:both;}
.hide{display:none!important;}

h3{color:red;font-size:18px;}

h1 { font-size:1.8em; line-height:120%; margin:.3em 0 .6em 0; color:#CCCCCC; }


#text p { line-height:160%; margin:0 0 .5em 0; }


/*Nav */

#popmenu{
	width:170px;
	height:28px;
	position:absolute;
	bottom:126px;
	right:62px;		
	z-index:500;
	background:url(images/porjecttxtbg.png) top right no-repeat;
	text-align:center;
	overflow:hidden;
	padding-top:20px;

}
#popmenu ul{
	list-style:none;

}
#popmenu a{
	color:#666;
	font-size:15px;
	font-weight:bold;
	text-transform:uppercase;
	font-family: 'Istok Web', sans-serif;

}
#popmenu a:hover{
	color:#333;

}

/*intro page*/



#intro {
	width:1024px;
	height:768px;
	overflow:hidden;
	position:relative;
	margin:0;
	padding:0;
	visibility:hidden;
	
}	

#intro div {
	position:absolute;
	
}


#intro div img {
	border:none;	
}

.intro-text {
	width:510px;
	position:absolute;
	height:170px;
	top:80px;
	left:390px;	
	z-index:500;
	background:url(images/sidetexter.png) top right no-repeat;
	padding:20px;
	padding-bottom:10px;
	line-height:180%;
	font-size:18px;
	color:#666;
		font-family: 'Istok Web', sans-serif;
	text-align:right;
}
.intro-text .bottom {
	width:510px;
	height:1px;
	position:relative;
	display:block;
	z-index:510;
	padding-top:10px;
	background: url(images/sidetexterlower.png) right bottom no-repeat;
	padding-right:20px;
}
#intro .logo{
	width:300px;
	height:88px;
	position:absolute;
	top:630px;
	left:710px;	
	z-index:510;
	text-align:center;
}
#intro #tagline{
	width:300px;
	padding-top:5px;
font-size:12px;
	font-family: 'Istok Web', sans-serif;
text-align:center;
color:#666;
}
#intro #tagline .taglinelight{
color:#999;
}



/*Projects*/
#projectbox {
	width:1024px;
	height:768px;
	overflow:hidden;
	position:relative;
	margin:0;
	padding:0;
	visibility: hidden;
}	



#projectbox div img {
	border:none;
		
}

.project-text {
	width:150px;
	height:140px;
	position:absolute;
	top:62px;
	right:62px;	
	z-index:500;
	background:url(images/porjecttxtbg.png) top right no-repeat;
	text-align:right;
	padding-right:20px;
	padding-top:30px;

}
.project-text .title{
	text-transform:uppercase;
	color:#333;
font:700 13px 'Istok Web', sans-serif;
	margin-bottom:20px;
}
.project-text a{
	color:#999;
	font-size:12px;

}
.project-text a:hover { color:#666; }
.project-text .controls{
	display:block;
	
		position: absolute;
	bottom:32px;
	right:15px;

}
#projectbox .logo{
	width:170px;
	height:48px;
	position:absolute;
	bottom:126px;
	right:62px;	
	z-index:500;
}

/*Project Details*/
#projectdetails {
	width:1024px;
	height:768px;
	overflow:hidden;
	position:relative;
	margin:0;
	padding:0;
	display:none;
}	

#projectdetails div img {
	border:none;
		
}


.project-description {
	width:250px;
	height:440px;
	position:absolute;
	top:62px;
	right:62px;	
	z-index:500;
	text-align:right;
	padding-right:20px;
	padding-top:30px;

}
#projectdetails #images {
	width:588px;
	height:588px;
	position:absolute;
	top:89px;
	left:89px;	
	z-index:500;
}
#projectdetails #images div{
	float:left;
	margin-right:12px;
	margin-bottom:12px;
	position:relative;
	width:184px;
	height:184px;
	
}
#projectdetails #images .growwidth,#projectdetails #images .growheight{
		position:absolute;
		overflow:hidden;
		z-index:600;
		top:0;
		left:0;
		cursor:pointer;
}



.project-description .title{
	text-transform:uppercase;
	color:#333;
	font-size:12px;
	margin-bottom:20px;
	white-space:nowrap;
		

}
.project-description{
	color:#666;
	font-size:12px;
		

}
.project-description a{
	color:#999;
	font-size:12px;
	font-weight:bold;

}
.project-description a:hover { color:#666; }
.project-description .controls{
	width:30px;
	display:block;
	color:#333;
	position:absolute;
		z-index:600;
		top:24px;
		left:250px;


}
/*Project Overview*/
#projectoverview {
	width:1024px;
	height:768px;
	overflow:hidden;
	position:relative;
	margin:0;
	padding:0;
	

}	
#projectoverview #popmenu{
background-color: #999;
}
#projectoverview div img {
	border:none;
		
}


#projectoverview #drawings div  {
	border:1px solid #999;
		
}
#projectoverview #drawings div div {
	border:none;
		
}
#projectoverview #images,#projectoverview #drawings {
	width:700px;
width:700px;
	position:absolute;
	z-index:500;
	margin-top:40px;
	margin-left:40px;
	
}
#projectoverview #images div,#projectoverview #drawings div{
	float:left;
	margin-right:20px;
	margin-bottom:20px;
	position:relative;
	width:120px;
	height:120px;
	overflow: hidden;

	
}
#projectoverview #drawings div{
	margin-right:18px;
	margin-bottom:18px;


	
}
#projectoverview #images div .info,
#projectoverview #drawings div .info{
text-transform: uppercase;
text-align: center;
color: #333;
font-size: 12px;
font-weight: bold;
font-family: 'Istok Web', sans-serif;
position:absolute;
top:0;
left:0;
height:120px;
display:none;
cursor: pointer;
background:url(images/porjecttxtbg.png) top right no-repeat;
}
#projectoverview #images div .info span,
#projectoverview #drawings div .info span{
position:relative;top:40%;margin-top:-60px;
}


#projectoverview-side{
	width:300px;
	height:728px;
	position:absolute;
	top:40px;
	right:0;	
	z-index:500;
	text-align:center;
	
	
}

#quote-box{
padding-top:20px;

}
.close{
width: 30px;
height: 25px;
padding: 5px;
padding-bottom: 10px;
text-align: center;
position: absolute;
top: 600px;
left: 130px;
z-index: 1001;
background-color: #999;
display: block;

}
.close a{

font-size:26px;
font-weight: bold;

color:#FFF;


}


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

#catmenu ul li{
	padding-bottom:8px;

}



#catmenu a:link,#catmenu a:visited,#catmenu a:active {
	color:#999;
	font-size:13px;
	font-weight:bold;
	font-family: 'Istok Web', sans-serif;
	text-transform:uppercase;
	
}
#catmenu a:hover,#catmenu a.active:link{
	color:#333;

}


#projectoverview-info{
width:250px;
line-height: 16px;
display:block;
	
	text-align:right;
}

#projectoverview .logo{
		width:170px;
	height:48px;
	position:absolute;
	bottom:126px;
	right:62px;	
	z-index:500;
}
#projectoverview #tagline{
	width:300px;
	padding-top:40px;
font-size:12px;
text-align:center;
color:#666;
}
#projectoverview #tagline .taglinelight{
color:#999;
}
/*contacts*/
#contactbox {
	width:1024px;
	height:768px;
	display:block;
	overflow:hidden;
	position:relative;
	margin:0;
	padding:0;
	visibility: hidden;
}	



#contactbox div img {
	border:none;
		
}

.contact-text {
	width:150px;
	height:140px;
	position:absolute;
	top:62px;
	right:62px;	
	z-index:500;
	background:url(images/porjecttxtbg.png) top right no-repeat;
	text-align:right;
	padding-right:20px;
	padding-top:30px;

}
.contact-text .title{
	text-transform:uppercase;
	color:#333;
	font-size:12px;
	margin-bottom:20px;
}
.contact-text a{
	color:#999;
	font-size:12px;

}
.contact-text a:hover { color:#666; }
.contact-text .controls{
	display:block;
	margin-top:35px;
	margin-left:115px;
width:40px;

}
#contactbox .logo{
	width:170px;
	height:48px;
	position:absolute;
	bottom:126px;
	right:62px;	
	z-index:500;
}




#quotebox{
	height:80px;
	width:150px;
position:absolute;
	top:320px;
	left:20px;	
	background:url(images/sidetexter.png) top right no-repeat;
	padding:20px;
	padding-bottom:10px;
	padding-left:0;
	line-height:180%;
	font-size:14px;
	color:#FFF;
	text-align:right;

	
	
}
#quotebox .hisname{
	color:#333;
text-transform:uppercase;
font-size:10px;
font-weight: bold;
	font-family: 'Istok Web', sans-serif;
	
}
#quotebox .bottom {
	width:150px;
	height:4px;
	display:block;
	margin-top:10px;
	background:url(images/sidetexterlower.png) top right no-repeat;
	padding-right:20px;
}



/*contact Details*/
#contactdetails {
	width:1024px;
	height:768px;
	overflow:hidden;
	position:relative;
	margin:0;
	padding:0;
	display:none;
}	

#contactdetails div img {
	border:none;
		
}


.contact-description {
	width:245px;
	height:440px;
	position:absolute;
	top:62px;
	right:62px;	
	z-index:500;
	text-align:right;
	padding-right:20px;
	padding-top:30px;

}



#contactdetails #slideshow {
	width:576px;
	height:576px;
	position:absolute;
	top:89px;
	left:89px;	
	z-index:500;
}
#contactdetails #slideshow {
	width:576px;
	height:576px;
	position:absolute;
	top:89px;
	left:89px;	
	z-index:500;
}
#contactdetails #slideshow img {
	display:none;
}



.contact-description .title{
	text-transform:uppercase;
	color:#999;
	font-size:12px;
	margin-bottom:20px;
		

}
.contact-description{
	color:#666;
	font-size:12px;
		

}
.contact-description a{
	color:#999;
	font-size:12px;
	font-weight:bold;

}
.contact-description a:hover { color:#666; }
.contact-description .controls{
	width:30px;
	display:block;
	color:#333;
	position:absolute;
		z-index:600;
		top:24px;
		left:245px;

}



#contactform {
	width:245px;
	height:440px;
	position:absolute;
	top:62px;
	right:62px;	
	z-index:500;
	text-align:right;
	padding-right:20px;
	padding-top:30px;
	display:none;

}
#contactform .title{
	text-transform:uppercase;
	color:#999;
	font-size:12px;

}
#contactform{
	color:#666;
	font-size:12px;
		

}

#contactform .controls{
	width:30px;
	display:block;
	color:#333;
	position:absolute;
		z-index:600;
		top:24px;
		left:245px;

}

/*controls*/
 a.left	{
	 height:25px;width:20px;
	 display:block;
	 float:left;
   background:  url(images/leftclick.png) top center no-repeat;
   }
 a.right	{
	 height:25px;width:20px;
	 display:block;
	 float:right;
   background:  url(images/rightclick.png) top center no-repeat;
   }
   
a.right:hover,a.left:hover{

   background-position: 0 -24px; 
   }



p { line-height:160%; margin:0 0 .5em 0; }

/* FOOTER */

.clear {
	clear: both;
	float: none;
	height: 0px;
	font-size: 0px;
	line-height: 0px;
}







/*Contact Styles*/
 a.button{	font-size: 1em;padding:5px;width:100px;border:1px solid #999;color:#666;text-align:center;}
 a.button:hver{color:#666;}
 
#contact_form input[type=text],#contactform #message{ font-size:12px;width:230px;padding:5px; border:1px solid #999; background-color:none;color: #666;font-size:1em;font-family:Helvetica,sans-serif;}
#contact_form #message{height:160px;
font-family:Helvetica,sans-serif; font-size:1em;}
#contact_form textarea {   overflow: auto;}
#contact_form div{height:40px;}

#contact_form div.message{height:190px;}
.error { display: none; color:red; font-size:1em;}
.success { display: none; padding:2px; color: #044406; font-size:1em;}