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,dd,dl,dt,li,ol,ul,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;font-weight:normal;font-style:normal;text-align:left}table{border-collapse:collapse;border-spacing:0;}ol,ul{list-style:none;}q:before,q:after,blockquote:before,blockquote:after{content:"";}

.clear{
	clear:both;
	height:1px;
	margin-bottom:-1px;
}

body{
	background: #586273 url(../images/bg-planks.jpg) no-repeat;
	font-family: Helvetica, "Helvetica Neue", Arial,  sans-serif;
	background-color:#070d0b;
	font-size:62.5%;
	margin: 0px;
	text-align:center;
	background-position: center top;
}

p {
	color: #203f35;
}

* {
	outline:0;
	outline-style:none;
	-moz-outline:0;
}

a{
	color:#1a1f27;
	font-weight: bold;
	text-decoration: underline;
}

a:visited{
	color:#1a1f27;
	text-decoration: underline;
}

.column{
	width:800px;
	margin:0 auto;
}

.headertext{
	display:block;
	background-repeat:no-repeat;
	background-position: top left;
	text-indent: -99999em;
}


/***************************************************************************
***************************** SITEWIDE STYLES ******************************
***************************************************************************/

/* header */



#main{
	
	width:900px;
	margin:0 auto;
	/*background: url(../images/glow-top.png) no-repeat center top;*/
	position:relative;
	overflow:hidden;
}

#main #gloss-overlay{
	position:absolute;
	top:0;
	left:50%;
	margin-left:-400px;
	background:url(../images/gloss-overlay.png) no-repeat center top;
	width:800px;
	height:128px;
	
}

#bottom-bar{
	width:804px;
	height:82px;
	margin:0 auto;
	margin-top:32px;
	background: url(../images/bg-bottom-bar.png) no-repeat top right;
	padding-left:1px;
}

#bottom-bar #left{
	float:left;
}

#bottom-bar #left h4{
	float:left;
	margin-left:20px;
	text-indent:-9999em;
	background:url(../images/text-interested-in-working-with-us.png) no-repeat top left;	
	width:257px;
	height:18px;
	display:block;
	margin-top:33px;
}

#bottom-bar #left a.button-get-in-touch{
	background:url(../images/button-get-in-touch.png) no-repeat top;
	text-indent:-99999em;
	width:141px;
	height:46px;
	display:block;
	float:left;
	margin-top:17px;
	margin-left:14px;
}

#bottom-bar #left a.button-get-in-touch:active{
	background-position: left bottom;
}


#bottom-bar #right{
	float:right;
	width:270px;
	margin-right:10px;
	height:72px;
	margin-top:3px;
	background: url(../images/image-stamp.png) no-repeat 16px 14px;
	padding-left:70px;
}

#bottom-bar #right form{
	margin-top:12px;
	color:#1e2633;
	font-size:11px;
	width:240px;
}

#bottom-bar #right form p{
	display:block;
	color:#1e2633;
	font-size:11px;
	text-shadow: 0px 1px 0px #abbace;
	margin-bottom:4px;
	margin-left: 8px;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
}

#bottom-bar #right form input#email-address{
	border:0;
	padding:0;
	margin:0;
	background:url(../images/text-input-newsletter.png);
	width:136px;
	height:24px;
	padding-top:5px;
	color:#2d2e30;
	font-size:14px;
	padding-left:15px;
	padding-right:10px;
	float:left;
	outline:0;
}

#bottom-bar #right form input#submit{
	border:0px;
	padding:0px;
	margin:0px;
	width:54px;
	height:29px;
	background:url(../images/button-newsletter-go.png) no-repeat top left;
	float:left;
	text-indent:-99999em;
	cursor:pointer;
}

#bottom-bar #right form input#submit:active{
	background:url(../images/button-newsletter-go.png) no-repeat bottom left;
}

#footer{
	overflow:visible;
	background:url(../images/glow-bottom.png) no-repeat center 40px;
	padding-bottom:70px;
}


/***************************************************************************
*****************************HOME/PROJECT PAGE******************************
***************************************************************************/

h1#header {
	-moz-background-clip:border;
	-moz-background-inline-policy:continuous;
	-moz-background-origin:padding;
	background:transparent url(../images/bg-header.jpg) repeat scroll 0 0;
	height:121px;
	margin:0 auto;
	position:relative;
	width:880px;
	z-index:10;
}

#projects{
	width:880px;
	height:563px;
	display:block;
	background:url(../images/bg-main.jpg) no-repeat top left;
	margin: 0 auto;
	position:relative;
	color:#1a1f27;
	left: 0px;
}

#projects-bottom{
	height:48px;
	background:url(../images/bg-main.jpg) no-repeat bottom left;	
	width:799px;
	position:absolute;
	left:0;
	bottom:0;
}
#project-type-nav{
	width:160px;
	margin-top:73px;
	float:left;
	font-size:14px;
	font-weight:bold;
	color:#dce7fa;
	margin-left:47px;
	border-bottom:;
	border-top:;
	position:relative;
	height: 300px;
}

#project-type-nav li{
	width:160px;
	height:37px;
	background:url(../images/project-nav-bg.png) no-repeat top left;
}
#project-type-nav li.navspacer{
	width: 160px;
	height: 25px;
	background: none;
	

}
#project-type-nav li a{
	width:161px;
	height:37px;
	display:block;
	overflow:hidden;
	cursor:pointer;
}

#project-type-nav li a span{
	width:100px;
	height:21px;
	display:block;
	text-indent:-99999em;
	margin-left:20px;
	margin-top:10px;
		
	position:relative;
	z-index:21;
	
}

#project-type-nav li.about a span{background:url(../images/text-about.png);}	
	
#project-type-nav li.print a span{	background:url(../images/text-print.png);}
	
#project-type-nav li.branding a span{	background:url(../images/text-branding.png);}	

#project-type-nav li.web a span{	background:url(../images/text-web.png);}	


#project-type-nav li.current{
	position:absolute;
	width:	185px;
	height:	43px;
	display:block;
	background:url(../images/project-nav-current-bg.png) no-repeat top left;
	top:-1px;
	left:-6px;
	z-index: 20;
} 



#email{
	position: absolute;
	bottom: 20px;
	left: 5px;
	
}

#emailicon {
	width: 40px;
	height: 26px;
	display: block;
	background: url(../images/button_email.png) no-repeat bottom left;
	text-indent:-99999em;
}

#emailicon:hover{
	background: url(../images/button_email.png) no-repeat top left;

}
#phone{
	position: absolute;
	bottom: 19px;
	left: 45px;
	
	
}


#phoneicon {
	width: 45px;
	height: 29px;
	display: block;
	background: url(../images/button_phone.png) no-repeat bottom left;
	text-indent:-99999em;
}

#phoneicon:hover{
	background: url(../images/button_phone.png) no-repeat top left;

}
#questions{
	position: absolute;
	bottom: 18px;
	left: 90px;
	
	
}


.questionsicon {
	width: 25px;
	height: 29px;
	display: block;
	background: url(../images/button_questions.png) no-repeat bottom left;
	text-indent:-99999em;
}

.questionsicon:hover{
	background: url(../images/button_questions.png) no-repeat top left;

}

.project-dots {
	bottom:15px;
	left:302px;
	position:absolute;
}

.project-dots a{
	width:25px;
	height:31px;
	display:block;
	background:url(../images/icon-dot.png) no-repeat top left;
	text-indent:-99999em;
	margin-right:0px;
	float:left;
}

.project-dots a.active{
	background:url(../images/icon-dot.png) no-repeat bottom left;
}


.project-dots a.active:hover{
	opacity:1;
}

.button-next-project{
	position:absolute;
	left:231px;
	bottom:6px;
	width:62px;
	height:51px;
	background: url(../images/button-next-client.png) no-repeat top right;
	text-indent:-99999em;
	cursor: pointer;
}

.button-prev-project{
	position:absolute;
	right:48px;
	bottom:6px;
	width:78px;
	height:51px;
	background: url(../images/button-prev-client.png) no-repeat top right;
	text-indent:-99999em;
	cursor: pointer;
}

.button-next-project:active{
	background: url(../images/button-next-client.png) no-repeat bottom right;	
}	

.button-prev-project:active{
	background: url(../images/button-prev-client.png) no-repeat bottom right;	
}	


/***************************************************************************
**************************** PROJECT LISTING *******************************
***************************************************************************/

.project {
	width:600px;
	height:495px;
	position:relative;
	margin-right:20px;
	
	
	}
#projecthome {
	width:595px;
	height:495px;
	position:relative;
	margin-right:20px;
	
	
	}

.project-image-wrap{
	padding:10px;
	padding-top:9px;
	padding-bottom:9px;
	position:relative;
	margin-bottom:15px;
	
}

.project-image-wrap img{
	width:570px;	
	height:288px;
	display:block;
}

.project-image-wrap a{
	display:block
}

.project-image-wrap .overlay{
	position:absolute;
	top:0;
	left:0;
	width:590px;
	height:308px;
	background: url(../images/overlay-image.png) no-repeat top left;
}

.project h3.project-title{
	font-size:25px;
	font-weight:bold;
	left:32px;
	bottom:18px;
	color:#13231e;
	text-shadow: 0px 1px 0px #c6d5cb;
	padding-left:3px;
}

.project-image-wrap a{
	position:absolute;
	left:0px;
	bottom:0px;
	width:596px;	
	height:300px;
	background: url(../images/button-zoom.png) no-repeat bottom right;
	text-indent:-9999em;
	opacity:0;
	border:0;
}

.project-text{
	color:#1a1f27;
	font-size:12px;
	text-shadow: 0 1px 0 #c6d5cb;
	line-height:19px;
	margin-top:5px;
	margin-left:3px;
	padding-right:12px;
	z-index: 50;

}
.project-text-left{
	width: 350px;
	color:#1a1f27;
	font-size:12px;
	text-shadow: 0 1px 0 #c6d5cb;
	line-height:19px;
	margin-top:5px;
	margin-left:3px;
	padding-right:12px;
	z-index: 50;
	float: left;
	border-right: 1px solid black;

}
.project-text-right{
	width: 200px;
	color:#1a1f27;
	font-size:12px;
	text-shadow: 0 1px 0 #c6d5cb;
	line-height:19px;
	margin-top:5px;
	margin-left:18px;
	padding-right:12px;
	z-index: 50;
	float: left;
	text-align: center;
}
.project-text-right h1{
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 5px;
	line-height: 12px;


}

#home-text{
	color:#203F35;
	font-size:13px;
	line-height:19px;
	margin-left:65px;
	padding-right:20px;
	padding-top:330px;
	text-shadow:0 1px 0 #C6D5CB;
	z-index:20;
}
#home-text p {
	border-left: thin solid #7e5c28;
	padding-left: 7px;
	
	}
	
#home-text a {
	display: inline;
	color:#203F35;
	font-size:13px;
	line-height:19px;
	padding: 0;
	margin: 0;
	position: relative
	text-shadow:0 1px 0 #C6D5CB;
	z-index:20;
	width: auto;
	height: auto;
	text-indent: 0;
	opacity: 100;
	left: auto;
	bottom: auto;
	
	
	}

.project-text p{
	margin-bottom:0.5em;
}

.view-the-site-link {
	text-indent:-99999em;
	display:block;
	height:25px;
	width:105px;
	background:url(../images/button-view-the-site.png) no-repeat top left;
	margin-top:10px
	

}
.view-the-site-link:active{
	background-position: bottom left;
}

/***************************************************************************
**************************** SCROLLER STUFF ********************************
***************************************************************************/

#scroller-window,
#scroller-about-window,
#scroller-print-window,
#scroller-branding-window,
#scroller-web-window{
	height:495px;
}

#scroller-window {
   position:relative; 
   overflow:hidden;          
   width: 610px;     
   float:right;
   margin-top:5px;
   margin-right:54px;	
   margin-bottom:9px;
   
}

#scroller-fade-left,
#scroller-fade-right{
	position:absolute;
	width:10px;
	height:90%;
	top:0px;	
}

#scroller-fade-left{
	left:0px;
	background: url(../images/scroller-fade.png) repeat-y top right;
}


#scroller-fade-right{
	right:0px;
	background: url(../images/scroller-fade.png) repeat-y top left;
}

#scroller-about-window{ 
overflow:hidden;          
   width: 600px;     
}

#scroller-about-wrap{
	width:10000em;
	position:absolute;
	background: url(../images/homeimage2.jpg) no-repeat top left;
}


#scroller-print-window{
   overflow:hidden;          
   width: 600px;     
 
}

#scroller-print-wrap{
	width:10000em;
	position:absolute;
}

#scroller-branding-window{
   overflow:hidden;          
   width: 600px;     
 
}

#scroller-branding-wrap{
	width:10000em;
	position:absolute;
}
#scroller-web-window{
   overflow:hidden;          
   width: 600px;     
 
}
#scroller-web-wrap{
	width:10000em;
	position:absolute;
}

#scroller-window .project{
	float:left;
}


#scroller-vertical{
	position:absolute;
	top:0;
	left:10px;
	height: 2500px;
	width:600px;
}

.vtip {
	font-weight:800;
	cursor: pointer;


}
p#vtip { display: none; 
	position: absolute; 
	color: white;	
	padding: 10px; 
	left: 5px; 
	font-size: 12px;
	font-weight: 600;
	max-width: 100px; 
	background-color: #aa8638; 
	border: 1px solid #a6c9e2; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	z-index: 9999 }

p#vtip #vtipArrow { position: absolute; 
	top: -10px; 
	left: 5px }
		

/***************************************************************************
**************************** CONTACT FORM ********************************
***************************************************************************/
/* Overlay */
#contact-overlay {background-color:#000; cursor:wait;}

/* Container */
#contact-container {width:450px;height: 35px; font-family:Helvetica, Verdana, Arial; font-size:16px; text-align:left;}
#contact-container .contact-content {background-color:white; color:#ddd; height:40px;}
#contact-container h1 {color:#b28f40; margin:0; padding:8px 0 6px 12px; font-size:22px; text-align:center;}
#contact-container .contact-loading {position:absolute; background:url(../images/contact/loading.gif) no-repeat; z-index:8000; height:55px; width:54px; margin:-14px 0 0 170px; padding:0;}
#contact-container .contact-message {text-align:center;}
#contact-container .contact-error {width:92%; font-size:.8em; background:#000; border:2px solid #ccc; font-size:0.8em; font-weight:bold; margin:0 auto; padding:2px;}
#contact-container br {clear:both;}
#contact-container form {padding:0; margin:0;}
#contact-container label {clear:left; display:block; width:100px; float:left; text-align:right;padding-top: 8px;color: #203f35; padding-right:4px; font-weight:bold;}
#contact-container .contact-input {font-family:Helvetica, Verdana, Arial;font-size: 22px; float:left; padding:5px; margin:2px; background:#eee; border:1px solid #fff; width:300px;}
#contact-container textarea {height:114px; font-size:.9em;}
#contact-container .contact-cc {font-size:.9em; cursor:default; color:#B28F40; }
#contact-container .contact-top {height:19px; background:url(../images/contact/form_top.png) no-repeat; padding:0; margin:0;}
#contact-container .contact-bottom {height:26px; background:url(../images/contact/form_bottom.png) no-repeat; font-size:.7em; text-align:center;}
#contact-container .contact-bottom a,
#contact-container .contact-bottom a:link,
#contact-container .contact-bottom a:active,
#contact-container .contact-bottom a:visited {position:relative; text-indent:-9999em;top:-4px; text-decoration:none; color:#666;}
#contact-container .contact-bottom a:hover {color:#888;}
#contact-container .contact-button {margin:4px 0 0 4px; cursor:pointer; height:24px; border:0; font-size:1em; font-weight:; color:#fff; text-align:center; vertical-align:middle;}
#contact-container .contact-send {width:68px;height: 26px; background:url(../images/contact/send.png) no-repeat;}
#contact-container .contact-cancel {width:68px;height: 26px; background:url(../images/contact/cancel.png) no-repeat;}
#contact-container a.modal-close,
#contact-container a.modal-close:link,
#contact-container a.modal-close:active,
#contact-container a.modal-close:visited {width: 30px; height: 30px;position:absolute; top:-9px; right:-11px; color:#B28F40;}
#contact-container a.modal-close:hover {color:white;}


/***************************************************************************
**************************** POPUP STUFF ********************************
***************************************************************************/

#faqs{background:url(../images/faqheader.png)no-repeat top;padding: 40px 25px 0px 25px;width: 700px;height: 700px;z-index: 2000;}
#faqs h1{font-size:20px;
	font-weight:bold;
	color:#14251f;
	padding: 26px 20px 0px 0px;}

#faqs p {color:#14251f;
	font-size:12px;
	text-shadow: 0 1px 0 #c6cbd5;
	line-height:19px;
	margin-top:5px;
	margin-left:3px;
	padding-right:12px;
	}



.pics { height: 581px; width: 700px; padding:0; margin:0; overflow: hidden }
.pics img { height: 581px; width: 700px; padding: 0px; border: 0px solid #ccc; background-color: #eee; text-align: center; }
.pics img {
	-moz-border-radius: 10px; -webkit-border-radius: 10px;
}