/* CSS Document */


a img{ 	border: none;}




/* Frame
--------------------------------------------- */

* { padding: 0; margin: 0; } 
html { text-align: center; }
body {
	position: relative;
	background: #000000;
	font: 10px  Georgia, "Times New Roman", Times, serif;
	line-height: 1.4em;
	color: #CCCCCC;
	text-align: center;
	margin-top: 30px;
}
#container {text-align: left; margin: 0 auto; width: 717px; padding: 30 0 0 0;}
#header {position: relative; display: inline; width: 717px; height: 269px; margin: 0px 0px 0px 0px; }
#flashmovie {float: left; display: block; width: 270px;}
#address {
	float: left;
	display: block;
	width: 270px;
	margin-left: 20px;
}







/* Navigation 
--------------------------------------------- */

#masthead {
	position: relative;
	float: left;
	padding: 0;
	display: inline;
	height: 100px;
	width: 717px;
	margin: 0px 0px 7px 0px;
	background-color: #242629;
}

	#masthead ul {display: inline; list-style: none; margin: 0; }
	#masthead li {display: inline; float: left; margin: 0 0 0 0px;}
	#masthead li a {display: inline; float: left; height: 65px;}
	#masthead li span {display: none;}

#nav01 a {background: url(images/nav/home_off.gif) top right no-repeat; width: 70px; height: 65px;}
#nav01 a:hover {background: url(images/nav/home_hover.gif) top right no-repeat;}
#nav01on {background: url(images/nav/home_on.gif) top right no-repeat; width: 70px; height: 65px;}

#nav02 a {background: url(images/nav/ourfirm_off.gif) top right no-repeat; width: 89px; height: 65px;}
#nav02 a:hover {background: url(images/nav/ourfirm_hover.gif) top right no-repeat;}
#nav02on {background: url(images/nav/ourfirm_on.gif) top right no-repeat; width: 89px; height: 65px;}

#nav03 a {background: url(images/nav/ourwork_off.gif) top right no-repeat; width: 87px; height: 65px;}
#nav03 a:hover {background: url(images/nav/ourwork_hover.gif) top right no-repeat;}
#nav03on {background: url(images/nav/ourwork_on.gif) top right no-repeat; width: 87px; height: 65px;}

#nav04 a {background: url(images/nav/contact_off.gif) top right no-repeat; width: 95px; height: 65px;}
#nav04 a:hover {background: url(images/nav/contact_hover.gif) top right no-repeat;}
#nav04on {background: url(images/nav/contact_on.gif) top right no-repeat; width: 95px; height: 65px;}

#headerNavBar {
	position: absolute;
	top: 19px;
	width: 342px;
	left: 355px;
	height: 65x;
	margin: 0px 0 0 0px;
	z-index: 0;
}

#headerLogo {
	position: absolute;
	top: 13px;
	left: 26px;
	width: 142px;
	height: 77px;
}




/* Bottom Nav
--------------------------------------------- */

a:link { text-decoration: none; color: #666666; font-size: 12px;}
a:visited { text-decoration: none; color: #666666; font-size: 12px;}
a:hover { text-decoration: none; color: #FFFFFF; font-size: 12px;}
a.email:link { text-decoration: none; color: #39F1F4; font-size: 11px;}
a.email:visited { text-decoration: none; color: ##39F1F4; font-size: 11px;}
a.email:hover { text-decoration: none; color: #FFFFFF; font-size: 11px;}
.subnavunderline {float: left; display: block; width: 100%; height: 5px; background: url(images/line.gif) center left repeat-x; margin: 10px 0 10px 1px; padding: 0 0 1px 0;}
#copyright { float: left; display: block; width: 717px; font: 90% Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #666666; text-align: center; margin: 10px 0 20px 0px;}


/* Main
--------------------------------------------- */

#mainholder {
	text-align: left;
	margin: 0px 0px 0 0px;
	background: #252b36;
	height: 455px;
	width: 717px;
	padding: 0 0 0 0;
	display: block;
	background: url(images/bg_pattern.gif) top right repeat;
}
#flash {postion: relative; display:inline; width: 338px; height: 455; float: left; background-color: #000000;}
#rightpanel {postion: relative; margin: 0px 0px 0 10px; display:inline; width: 335px; background: #ffffff; }

#introcopy {
	postion: relative;
	display: inline;
	width: 300px;
	margin: 30px 0 10px 40px;
	float: left;
}

#copy { width: 281px; height: 30px; display: inline; overflow: visible; margin: 0 0 0 60px;}


.box {float: left; display: block; width: 200px; padding: 0px 0px 0 1px; margin: 20px 0 0px 0;}
#box2 {float: left; display: block; width: 381px; padding: 0px 0px 0 1px; margin: 5px 0 0px 3px; line-height: 1.5;}
#box2 p {float: left; display: block; width: 350px; padding: 8px 0px 0 15px; margin: 8px 0 0px 15px; line-height: 1.5;}

 h1.intro { font-size: 9px; margin-top: 5px; width: 189px; margin-right: 0pt; margin-bottom: 5px; margin-left: 0px; height:25px; background-image:url(images/Circa_HeaderTemp.gif); background-repeat:no-repeat; height: 30px; text-indent:-9999px; }
 
.title {font: 0.9em Arial, Helvetica, sans-serif;  color: #45433c; letter-spacing: 0px; margin: 0;}
.sentinceIntro {font-size: 11px;}


#imageholder {postion: relative; display:inline; width: 338px; height: 455; float: left; background-color: #000000; }



#ourworkjumpnav  { position: relative; float: left; padding: 0; display: inline; height: 20px; width: 300px; margin: 0px 0px 0px 0px; }

	#ourworkjumpnav ul {display: inline; list-style: none; margin: 0; }
	#ourworkjumpnav li {display: inline; float: left; margin: 15px 0 0 0px;}
	#ourworkjumpnav li a {display: inline; float: left; height: 27px;}
	#ourworkjumpnav li span {display: none;}

#jump01 a {background: url(images/featured_jump.gif) top right no-repeat; width: 145px; height: 27px;}
#jump01 a:hover {background: url(images/featured_jump.gif) top right no-repeat;}
#jump01on {background: url(images/featured_jump.gif) top right no-repeat; width: 145px; height: 27px;}

#jump02 a {background: url(images/portfolio_jump.gif) top right no-repeat; width: 130px; height: 27px;}
#jump02 a:hover {background: url(images/portfolio_jump.gif) top right no-repeat;}
#jump02on {background: url(images/nav/portfolio_jump.gif) top right no-repeat; width: 130px; height: 27px;}






/* Our Firm ! mainholder controlled in Main !
--------------------------------------------- */

 h1.ourfirm { font-size: 9px; margin-top: 10px; width: 189px; margin-right: 0pt; margin-bottom: 5px; margin-left: 0px; height:26x; background-image:url(images/OurFirm.gif);  background-repeat:no-repeat; height: 30px; text-indent:-9999px; }
 
 
 
 
 
 /* Our Work 
--------------------------------------------- */ 
#switchnav { width: 180px; display: inline; margin: 0px 0px 5px 5px; }

#projectsectionnav {
	width: 200px;
	height: 16px;
	display: inline;
	margin: 0px 0px 0px 0px;
}

#projectsectionnav_left { width: 50px; postion: relative; display: block; float: left; margin: 0px 0px 0px 5px; }

#projectsectionnav_left span { color:#CCCCCC; font-size: 9px; margin: 0px 0px 0px 0px;}

#projectsectionnav_lefton {  float: left; width: 50px; color:#CCCCCC;  margin: 0px 0px 10px 0px;}

#projectsectionnav_right { width: 100px; postion: relative; display: block; float: left; margin: 0px 0px 0px 0px; }

#projectsectionnav_right span { color:#CCCCCC; font-size: 9px;  margin: 0px 0px 0px 0px}

#projectsectionnav ul {padding: 0; margin: 8px 0 10px 0; list-style: none; }

#projectsectionnav li {width: 180px; background-image: url(images/portnav_off.gif); background-position: top left; background-repeat: no-repeat; padding: 7px 0 8px 30px; border-bottom: 1px solid #444444;}

a.portfolio:hover {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 9px;
	color: #999;
	text-decoration: none;
	margin: 0px 0px 10px 0px;
	
}

a.portfolio:link {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 9px;
	color: #999999;
	text-decoration: none;
	margin: 0px 0px 10px 0px;
}

a.portfolio:visited {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 9px;
	color: #999;
	text-decoration: none;
	margin: 0px 0px 10px 0px;
}


#portfoliomainholder {
	text-align: left;
	margin: 0px 0px 0 0px;
	background: #252b36;
	height: 520px;
	width: 717px;
	padding: 0 0 0 0;
	display: block;
	background: url(images/bg_pattern.gif) top right repeat;
}
 
 #leftcolume { postion: relative; display:inline; width: 210px; height: 455px;  }
 
 #rightcolume {
	postion: relative;
	display: inline;
	width: 365px;
	height: 455px;
	margin: 20px 0 30px 25px;
	float: left;
}
 
  #projectNavholder {
	width: 210px;
	position: relative;
	float: left;
	display: inline;
	margin-top: 5px;
	margin-right: 30px;
	margin-bottom: 0px;
	margin-left: 40px;
	font-size: 10px;
}
 
 #projectNav {
	width: 210px;
	position: relative;
	display: inline;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	font-size: 10px;
}

	#projectNav ul {padding: 0; margin: 25px 0 10px 0; list-style: none; }

	#projectNav li {width: 180px; background-image: url(images/portnav_off.gif); background-position: top left; background-repeat: no-repeat; padding: 7px 0 8px 30px; border-bottom: 1px solid #444444;}
	
	#projectNav li.first {width: 180px; background-image: url(images/portnav_off.gif); background-position: top left; background-repeat: no-repeat; padding: 7px 0 8px 30px; border-top: 1px solid #444444;}
	
	#projectNav li.last {width: 180px; background-image: url(images/portnav_off.gif); background-position: top left; background-repeat: no-repeat; padding: 7px 0 8px 30px; border-bottom: 1px solid #444444;}

	#projectNav li#select {width: 180px; background-image: url(images/portnav_on.gif); background-position: top left; background-repeat: no-repeat; color: #FFFFFF; padding: 7px 0 8px 30px; border-top: 1px solid #444444;}
	
	#projectNav li#selectnoline {width: 180px; background-image: url(images/portnav_on.gif); background-position: top left; background-repeat: no-repeat; color: #FFFFFF; padding: 7px 0 8px 30px; }

	#projectNav li#selectunderline {width: 180px; background-image: url(images/portnav_on.gif); background-position: top left; background-repeat: no-repeat; color: #FFFFFF; padding: 7px 0 8px 30px; border-bottom: 1px solid #444444;}
	
	#projectNav a:link {color: #999999; text-decoration: none; font-size: 10px}

	#projectNav a:visited {color: #999999; text-decoration: none; font-size: 10px}

	#projectNav a:hover {color: #FFFFFF; text-decoration: none; font-size: 10px}
	


#thumbswap {
	postion: relative;
	display:inline;
	margin: 5px 0 0px 0;
	width: 210px;
	float: left;
	
}


#beforeNav {
	postion: relative;
	display:inline;
	margin: 0px 0px 0px 0px;
	width: 34px;
	float: left;
	
}


	#beforeNav a:link {color: #999999; text-decoration: none; font-size: 9px;}

	#beforetNav a:visited {color: #999999; text-decoration: none; font-size: 9px;}

	#beforetNav a:hover {color: #999999; text-decoration: none; font-size: 9px;}
	
	#beforetNav span { color:#999999; font-size: 9px; margin: 0px 0px 0px 0px;}




#afterNav {
	postion: relative;
	display:inline;
	margin: 0px 0 0px 0px;
	width: 36px;
	float: right;
	
}


	#afterNav a:link {color: #999999; text-decoration: none; font-size: 9px;}

	#aftertNav a:visited {color: #999999; text-decoration: none; font-size: 9px;}

	#aftertNav a:hover {color: #999999; text-decoration: none; font-size: 9px;}
	
	#aftertNav span { color:#999999; font-size: 9px; margin: 0px 0px 0px 0px;}


	
#thumbnails {
	postion: relative;
	display:inline;
	margin: 30px 0 0px 0;
	width: 210px;
	height: 130px;
	float: left;
	background-color: #000000;
	border: 1px solid #444444;
}


#thumbnails_featured {
	postion: relative;
	display:inline;
	margin: 170px 0 0px 0;
	width: 210px;
	height: 130px;
	float: left;
	background-color: #000000;
	border: 1px solid #444444;
}

#thumbnails_featured2 {
	postion: relative;
	margin: 170px 0 0px 0;
	width: 210px;
	height: 130px;
	float: left;
	background-color: #000000;
	border: 1px solid #444444;
}

#sec1 {
	postion: relative;
	display:block;
	margin: 0px 0 0px 0;
	width: 210px;
	height: 130px;
	z-index: 100;
}

#sec2 {
	postion: relative;
	display:block;
	margin: 0px 0 0px 0;
	width: 210px;
	height: 130px;
	background-color: #000000;
	z-index: 200;
}


#toprow { postion: relative; display:block; margin: 1px 0px 1px 0px; width: 210px;height: 62px;background-color: #000000;
}
#bottomrow {postion: relative; display:inline; margin: 1px 0px 0px 0px;  width: 210px; height: 62px; background-color: #000000; }

#thumbnailleft {postion: relative; display:inline; margin: 4px 0 0px 7px;  width: 95px; height: 57px; float: left; background-color: #000000; }
#thumbnailright {postion: relative; display:inline; margin: 4px 0 0px 7px;  width: 95px; height: 57px; float: left; background-color: #000000; }



#projectImage { postion: relative; display:inline; width: 365px; float: left; }

#project1 { postion: relative; display:inline; width: 365px; float: left; }
#project2 { postion: relative; display:none; width: 365px; float: left; }
#project3 { postion: relative; display:none; width: 365px; float: left; }
#project4 { postion: relative; display:none; width: 365px; float: left; }

#afterleft { postion: relative; display:inline; width: 65px; float: left; }

#beforeright { postion: relative; display:inline; width: 38px; float: right; }

#projectdescription { postion: relative; display:inline; width: 365px; float: left; margin: 20px 0px 0px 0px;  }

#projectdescription p { postion: relative; display:inline; width: 365px; float: left; margin: 10px 0px 0px 0px;   }

 h1.ourwork { font-size: 9px; margin-top: 6px; width: 189px; margin-right: 0pt; margin-bottom: 0px; margin-left: 0px; height:23px; background-image:url(images/OurWork.gif);  background-repeat:no-repeat; height: 25px; text-indent:-9999px; }
 
 h2.ourwork { font-size: 12px; margin-top: 0px; width: 189px; margin-right: 0pt; margin-bottom: 0px; margin-left: 0px; font-family: Georgia, "Times New Roman", Times, serif; color: #39F1F4; }
 




/* Contact Us ! mainholder controlled in Main  !
------------------------------------------------ */

 h1.contactus {
	font-size: 9px;
	margin-top: 14px;
	width: 189px;
	margin-right: 0pt;
	margin-bottom: 0px;
	margin-left: 0px;
	height:26x;
	background-image:url(images/ContactUs.gif);
	background-repeat:no-repeat;
	height: 30px;
	text-indent:-9999px;
}
 
 #contact_left {
	postion: relative;
	display:inline;
	width: 200px;
	height: 355px;
	margin: 25px 140px 0 0px;
	float: right;
}
 
 #contact_right {
	postion: relative;
	display: inline;
	width: 325px;
	margin: 20px 0 00px 80px;
	float: left;
}

 
 #contact_left span { width: 165px; margin: 130px 0 90px 0px; font-family: Georgia, "Times New Roman", Times, serif; color: #39F1F4; font-size: 12px; }
 
 #contact_left p {
	width: 210px;
	margin: 5px 0 10px 0px;
}
 
 
 
 


/* Footer
--------------------------------------------- */

.underline {float: left; display: block; width: 100%; background: url(../images/layout/underline.gif) bottom left repeat-x; margin: 0 0 18px 0; padding: 0 0 13px 0;}
#footer {width: 717px; color: #666666; position: relative; float: left; display: block; margin: 8px 0 0 0; padding: 0; text-align: center;}

a.footer:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	text-decoration: none;
}

a.footer:link {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	text-decoration: none;
}

a.footer:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	text-decoration: none;
}	

a.cira:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #999999;
	text-decoration: none;
}

a.cira:link {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #999999;
	text-decoration: none;
}

a.cira:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #999999;
	text-decoration: none;
}	


/* Jump Buttons
--------------------------------------------- */

#prompt ul {display: inline; list-style: none; margin: 0; }
#prompt li {display: inline; float: left; margin: 0 0 0 0px;}
#prompt li a {display: inline; float: left; height: 39px;}
#prompt li span {display: none;}

.learnmore {float: right; display: block; width: 118px; height: 39px; padding: 0px 0px 0 1px; margin: 0px 0 0px 0px;}


#Jumpnav01 a {background: url(images/learn_norm.jpg) top right no-repeat; width: 118px; height: 39px; margin: 20px 0 0px 270px;}
#Jumpnav01 a:hover {background: url(images/learn_over.jpg) top right no-repeat; margin: 20px 0 0px 270px;}
#Jumpnav01on {background: url(images/learn_over.jpg) top right no-repeat; width: 118px; height: 39px; margin: 20px 0 0px 270px;}


/* Contact Form
--------------------------------------------- */

strong.sent { font-size: 12px; color: #0099FF; margin-top: 10px; margin-right: 0pt; margin-bottom: 0px; margin-left: 0px; }
strong.sent2 {
	font-size: 10px;
	color: #CCCCCC;
	margin-top: 10px;
	margin-right: 0pt;
	margin-bottom: 0px;
	margin-left: 0px;
	font-weight: normal;
}

strong.header {
	font-size: 10px;
	color: #CCCCCC;
	margin-top: 10px;
	margin-right: 0pt;
	margin-bottom: 0px;
	margin-left: 0px;
	font-weight: normal;
}

 h1.contact { font-size: 9px; margin-top: 20px; margin-right: 0pt; margin-bottom: 0px; margin-left: 0px; height:35px; background-image:url(images/contact_header.gif); border-top: 0px solid #444444; border-bottom: 1px solid #444444; background-repeat:no-repeat; height: 30px; text-indent:-9999px; }

#maincontent {width: 300px; margin: 20px 0 15px 70px; padding: 0; position: relative; float: left; display: inline;}
#maincontent p {display: block; font-size: 12px; color: #FFFFFF; margin:0px 0px 14px 0px;}
#maincontent p.warning { font-size: 10px; color: #FF0000; margin-top: 0pt; margin-right: 0pt; margin-bottom: 0px; margin-left: 0pt; }
#maincontent span { font-size: 10px; color: #FF0000; margin-top: 0pt; margin-right: 0pt; margin-bottom: 0px; margin-left: 0pt; }
	
	fieldset { border:0;margin:0;padding:0; }

input.text,{ width:300px;font:12px/12px 'arial',; color:#FFFFFF; padding:3px;  background-color: ; margin:1px 0; }

textarea { width: 320px; padding: 3px; line-height: 1em; border: 1px solid #c2c1ab; margin: 0 0 12px 0; font: 1em Tahoma, Verdana, Arial, sans-serif; color: #333; }

input.submit { padding:2px 5px;font:bold 12px/12px verdana,arial,sans-serif; }
.formButton { border: 1px solid #CCFF00; background-color: #444444; width: 100px; padding: 5px 0 5px 0; font-size: 12px; color: #CCFF00;}


.addressbox {float: left; display: block; width: 200px; padding: 0px 0px 40px 20px; margin: 50px 0 0px 0;}
.addressbox p  {display: block; font-size: 12px; color: #cccccc; margin:0px 0px 4px 50px;}
.addressbox p2  {display: block; font-size: 14px; color: #cccccc; margin:0px 0px 4px 0px;}
 


/* CLEARFIX
----------------------------------------------*/
	
.clearfix:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } 
.clearfix label{ font:12px/12px 'arial',; color:#8b7e61;}
.clearfix {display: inline-block;} 
/* Hide from IE Mac \*/ 
.clearfix {display:block;} 
/* End hide from IE Mac */ 
* html .clearfix{ height: 1px; } 
	

span.error{ color:red; display:none; }
#loadBar{ display: none; color: #ffffff; padding: 0px; width: 300px; }
#emailSuccess{ display: none; color: #ff6600;  background-image: url(file:///Macintosh%20HD/Applications/MAMP/img/check.gif); background-repeat: no-repeat; background-position: 5px 50%; padding: 5px 0px 5px 0px; width: 375px; }
#contactRead{ display: none; }
