

/* Global Styles */

body {
	margin: 0 auto;
	padding: 14px 0 0 0;
	background: #484848;
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	color: #666;
	line-height: 20px;
	text-align: center;
}

#container {
	position: relative;
	margin: 0 auto;
	background: url('../images/bg.jpg') repeat-y 0 0;
	text-align: left;
	width: 980px;
	display: block;
}

#main {
	position: relative;
	margin: 0 auto;
	background: #fff;
	text-align: left;
	width: 876px;
	overflow: auto;
	display: block;
	padding: 20px 20px 20px 0;
}

#content {
	float: right;
	text-align: left;
	width: 705px;
	min-height: 535px;
	height:auto !important;
	height: 535px;
	margin: 0;
	overflow: hidden;
}

#contentNews {
	float: right;
	text-align: left;
	width: 705px;
	margin: 0;
	padding: 0;
}

#logo {
	float: left;
	position: relative;
	left: 31px;
	margin: 107px 0 0 0;
}

#footer {
	clear: both;
	float: right;
	padding: 6px 33px 0 33px;
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold;
	letter-spacing: .1em;
	background: #989898;
	color: #fff;
	text-align: left;
	width: 639px;
	height: 19px;
}

#copyright {
	position: relative;
	top: -10px;
	font: 11px Arial, Verdana, Helvetica, sans-serif;
	color: #cdcdcd; 
}

h1 {
	font: 22px Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #2892af;
	margin: 20px 0px 0 0px;
	text-align: left;
	letter-spacing: .08em;
}

h1 a {
	font: 22px Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #2892af;
	margin: 20px 0px 0 0px;
	text-align: left;
	letter-spacing: .08em;
	text-decoration: none;
}

h1 a:hover {
	text-decoration: none;
}

h1 span {
	color: #c6232c;
}

h2 {
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #2892af;
	margin: 8px 0 0 0;
}

h2 a {
	font: 13px Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #2892af;
	margin: 8px 0 0 0;
	letter-spacing: .08em;
}

h2 span {
	color: #2892af;
}

h3 {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	font-weight: normal;
	color: #666;
	margin: 8px 0 8px 0;
}

h3 a {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	font-weight: normal;
	color: #2892af;
	margin: 0 0 0 0;
}

h4 {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	font-weight: normal;
	color: #c6232c;
	margin: 8px 0 0 0;
}

a {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	color: #2892af;
	line-height: 20px;
	text-decoration: underline;
	font-weight:normal;
}
a:hover {
	color: #c6232c;
	text-decoration: underline;
}

a.pdf {
	padding: 0 20px 0 0;
	margin: 0px 0px 10px 0px;
	background: url('../images/icon_pdf.gif') no-repeat right 0;
	display: block;
}

a.firm {
	text-decoration: none;
	color: #63bcd5;
	line-height: 25px;
	display: block;
}
a.firm:hover {
	color: #c6232c;
}

p {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	color: #666;
	line-height: 20px;
}

p span {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	color: #c6232c;
	line-height: 20px;
}

p.list {
	line-height: 16px;
	margin: 10px 0 10px 0;
}

p.first {
	margin-top: 2px;
}

p.small {
	font-size: 12px;
	line-height: 18px;
}

ul {
	list-style-type: square;
	margin-left: 12px;
	padding-left: 4px;
}

ol {
	margin-left: 20px;
	padding-left: 4px;
}

ul li, ol li {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	color: #c6232c;
	line-height: 20px;
	margin-bottom: 2px;
}

ul li span, ol li span {
	font: 13px Arial, Verdana, Helvetica, sans-serif;
	color: #666;
	line-height: 20px;
}

.rollover {
	color: #63bcd5}

.rollout {
	color: #666}

sup, sub { 
	vertical-align: 0;
	position: relative;
}

sup {
	bottom: 1ex;
}

sub {
	top: 0.8ex;
}

/* Secondary Styles */

.introOuter {
	clear: both;
	display: table; 
	#position: relative;
	overflow: hidden;
	font: 17px Arial;
	color: #a3a2a2;
	line-height: 26px;
	background: #fff;
	margin: 0 20px 0 32px;
	width: 651px;
	height:144px;
}
.introMiddle {
	#position: absolute;
	#top: 50%;
	display: table-cell;
	vertical-align: middle;
}

.introInner {
	#position: relative; 
	#top: -50%;
}

#tagline {
	font: 12px Arial;
	color: #fff;
	height: 21px;
	background: #989898;
	padding: 7px 20px 0 32px;
}

#taglineTypewriter {
	position: absolute;
	width: 653px;
	height: 30px;
	font: 12px Arial;
	color: #fff;
	display: block;
	overflow: hidden;
	z-index: 2;
}

#typewriter {
	position: absolute;
	font: 12px Arial;
	color: #fff;
	height: 21px;
	background: #989898;
	width: 653px;
	padding: 7px 20px 0 32px;
	display: block;
	overflow: hidden;
	z-index: 1;
}

#contentSec {
	float: left;
	width: 704px;
	font: 12px Arial;
	color: #666;
	line-height: 16px;
	background: #fff;
	padding: 0 0 0 0;
}

#portfolioThumbs img {
	float: left;
	margin-right: .95em;
}

#secContent {
	float: left;
	position: relative;
	left: 91px;
	font:13px Arial, Verdana, Helvetica, sans-serif;
	font-weight: normal;
	line-height: 20px;
	width: 350px;
	min-height:300px;
	height:auto !important;
	height:300px;
	padding: 0 30px 16px 0;
	text-align: left;
	display: block;
}

.portfolio {
	float: left;
	font-size: 11px;
	line-height: 14px;
	width: 162px;
	margin-right: 18px; 
	display: block;
	overflow: visible;
}

.portfolio ul {
	list-style-type: square;
	margin: 0 0 0 12px;
	padding-left: 4px;
}

.portfolio ul li {
	color: #c6232c;
	margin-bottom: 5px;
	line-height: 13px;
}

.portfolio ul li span {
	font: 11px Arial, Verdana, Helvetica, sans-serif;
	color: #666;
}

ul.description li span {
	color: #666;
}

ul.descriptionOn li span {
	color: #63bcd5;
}

.portfolioCompany {
	font: 11px Verdana;
	font-weight: bold;
	text-transform: uppercase;
	padding: 14px 0 0 0;
	height: 40px;
}

.architect {
	margin: 15px 0 0 0;
	border-top: 1px solid #ccc; 
	padding: 5px 0 0 0;
}

.quote {
	font-size: 15px;
	font-style: italic;
	line-height: 28px;
	margin-top: 30px;
	color: #63bcd5;
}

.quoteLong {
	font-size: 15px;
	font-style: italic;
	line-height: 24px;
	margin-top: 30px;
	color: #63bcd5;
}

#eg1, #eg2, #eg3, #eg4 {
	display: none;
}

.servicesPic {
	float: left;
	width: 321px;
	margin-right: 41px;
}

#servicesDescription1, #servicesDescription2, #servicesDescription3, #servicesDescription4 {
	margin-top: 9px;
}

.servicesNav {
	width: 321px;
	margin-top: 10px;
	overflow: hidden;
}

.servicesNav img {
	margin-right: 11px;
}

.serviceClosed {
	float: left;
	width: 280px;
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold;
	color: #fff;
	padding: 6px 10px 5px 25px;
	margin-bottom: 10px;
	background: url('../images/arrow_closed.gif') no-repeat 10px 6px;
	background-color: #989898;
	display: block;
}

.serviceOpen {
	float: left;
	width: 280px;
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold;
	color: #fff;
	padding: 6px 10px 5px 25px;
	margin-bottom: 10px;
	background: url('../images/arrow_open.gif') no-repeat 6px 9px;
	background-color: #63bcd5;
	display: block;
}

#service1 {
	clear: both;
	display: block;
}

#service2, #service3, #service4 {
	clear: both;
	display: none;
}

.serviceClosed a, .serviceOpen a {
	font-weight: bold;
	line-height: 16px;
	margin: 0px;
	padding: 0px;
	text-decoration: none;
}

#culture1 a, #culture2 a, #culture3 a, #culture4 a {
	height: 162px;
	width: 162px;
	margin-bottom: 15px;
	display: block;
	overflow: hidden;
	text-decoration: none;
}

.quoteCulture {
	font-size: 15px;
	font-style: italic;
	line-height: 23px;
	margin-top: 10px;
	color: #63bcd5;
}

.quoteCulturePerson {
	font-size: 15px;
	line-height: 20px;
	color: #666;
	font-style: normal;
}

/* Navigation Styles */

/* Main Nav */

#nav {
	float: right;
	width: 705px;
	height: 35px;
	background: #989898;
	display: block;
	border-bottom: 1px solid #fff;
	overflow: hidden;
}

#nav1, #nav2, #nav3, #nav4, #nav4a, #nav5, #nav6 {
	float: left;
	height: 35px;
	display: block;
	text-decoration: none;
	text-transform: uppercase;
}

#nav1 a, #nav2 a, #nav3 a, #nav4 a, #nav4a a, #nav5 a, #nav6 a {
	font: 11px Arial Black, Arial;
	font-weight: normal;
	color: #fff;
	height: 47px;
	padding: 10px 0 0 0;
	margin: 0 0 0 0;
	text-decoration: none;
	text-align: left;
	letter-spacing: .05em;
	display: block;
}

#nav1 a {
	width: 78px;
	padding-left: 0px;
	text-align: center;
}

#nav1 a:hover, #nav1 span a {
	background: #2892af;
}

#nav2 a {
	width: 105px;
	padding-left: 0px;
	text-align: center;
}

#nav2 a:hover, #nav2 span a {
	background:#2892af;
}

#nav3 a {
	width: 116px;
	padding-left: 0px;
	text-align: center;
}

#nav3 a:hover, #nav3 span a {
	background: #2892af;
}

#nav4 a {
	width: 78px;
	padding-left: 0px;
	text-align: center;
}

#nav4 a:hover, #nav4 span a {
	background: #2892af;
}

#nav4a a {
	width: 78px;
	padding-left: 0px;
	text-align: center;
}

#nav4a a:hover, #nav4a span a {
	background: #2892af;
}

#nav5 a {
	width: 95px;
	padding-left: 0px;
	text-align: center;
}

#nav5 a:hover, #nav5 span a {
	background: #2892af;
}

#nav6 a {
	width: 85px;
	padding-left: 0px;
	text-align: center;
}

#nav6 a:hover, #nav6 span a {
	background: #2892af;
}

/* Secondary Nav */

#secNav {
	float: left;
	width: 705px;
	height: 28px;
	background: #989898;
	padding-right: 12px;
	display: block;
	overflow: hidden;
}

#secNav1_1, #secNav1_2, #secNav1_3, #secNav1_4, #secNav2_1, #secNav2_2, #secNav2_3, #secNav3_1, #secNav3_2, #secNav3_3, #secNav3_4, #secNav3_5, #secNav3_6  {
	float: left;
	height: 25px;
	display: block;
	text-decoration: none;
}

#secNav1_1 a, #secNav1_2 a, #secNav1_3 a, #secNav1_4 a, #secNav2_1 a, #secNav2_2 a, #secNav2_3 a, #secNav3_1 a, #secNav3_2 a, #secNav3_3 a, #secNav3_4 a, #secNav3_5 a, #secNav3_6 a {
	font: 10px Arial;
	font-weight: normal;
	text-transform: uppercase;
	color: #fff;
	height: 25px;
	padding: 8px 0px 0 0;
	margin: 0 0 0 0;
	text-decoration: none;
	text-align: center;
	letter-spacing: .05em;
	display: block;
}

#secNav1_1 a, #secNav1_2 a, #secNav1_3 a, #secNav1_4 a {
	width: 176px;
}

#secNav2_1 a, #secNav2_2 a, #secNav2_3 a {
	width: 235px;
}
	
#secNav3_1 a {
	padding-left: 30px;
	text-align: left;
	width: 100px;
}

#secNav3_2 a {
	width: 114px;
}

#secNav3_3 a {
	width: 114px;
}

#secNav3_4 a {
	width: 118px;
}

#secNav3_5 a {
	width: 114px;
}

#secNav3_6 a {
	width: 114px;
}

#secNav1_1 a:hover, #secNav1_1 span a, #secNav1_2 a:hover, #secNav1_2 span a, #secNav1_3 a:hover, #secNav1_3 span a, #secNav1_4 a:hover, #secNav1_4 span a, #secNav2_1 span a, #secNav2_1 a:hover, #secNav2_2 span a, #secNav2_2 a:hover, #secNav2_3 span a, #secNav2_3 a:hover, #secNav3_1 a:hover, #secNav3_1 span a, #secNav3_2 a:hover, #secNav3_2 span a, #secNav3_3 a:hover, #secNav3_3 span a, #secNav3_4 a:hover, #secNav3_4 span a, #secNav3_5 a:hover, #secNav3_5 span a, #secNav3_6 a:hover, #secNav3_6 span a {
	color: #fff;
	background: #63bcd5;
}

/* Scrolling Content Styles */


#projectsPix {
	float: right;
	width: 497px;
	height: 401px;
	height: "405px";
	text-align:left;
}

#projectsPixMain {
	float: right;
	width: 371px;
	height: 429px;
	height: "433px";
	text-align:left;
}


/* Scrolling Divs */

div#wn { 
	position:relative; 
	width: 290px;
	height:370px;
	overflow:hidden;	
}

#lyr1 div {
	margin: 20px 35px 10px 20px;
}

div#scrollLinks { 
	float: right;
	margin-top: 15px;
	width:25px; 
 	height:80px;
}
  
 
div#scrollLinks.left { 
	float: left;
	margin-top: 35px;
	width:25px; 
 	height:80px;
}

.clientBox {
	float: left;
	width: 217px;
	border: 1px solid #989898;
	display: block;
	margin-right: 23px;
}

.clientBox p {
	  padding: 10px;
}

.clientBox a {
	 display: block;
	 text-decoration: none;
	 color: #fff;
}
  
.clientHeader {
	font: 15px Arial Black, Arial;
	font-weight: normal;
	color: #fff;
	text-align: left;
	background: #989898;
	height: 34px;
	padding: 12px 0 0 20px;
}

.clientButton {
	background: #989898;
	color: #fff;
	font: 12px Arial Black, Arial;
	width: 70px;
	padding: 5px;
	margin-left: 20px;
}

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/slideshow/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/slideshow/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #2892af; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:5px 10px; color: #fff; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
