/* colors 
orange: B83F00
gray: 939598
gray2: CACBCC
black: 000000

note: HOVER - means that that style controls a menu hover. Different stlyes are used between the sections
note: ACTIVE - means that that style controls a selected menu item.
*/
html,body{
margin: 0;
padding:0;
font-family:Arial, Helvetica, sans-serif;
height:100%;
overflow:hidden;
}
#pageWrapper{
margin: 0;
padding:0;
height:100%;
overflow-y:auto;
overflow-x:hidden;
}

#content{
height:100%;
}

#contentLeft{
	position:absolute;
	top:0px;
	left:0px;
	xfloat:left;
	width:260px;
	height:100%;
	xborder:1px solid red;
	margin-bottom:auto;
}
#contentMain
{
	xborder:1px solid red;
}	
#navWrapper{
	width:216px;
	padding-left:0px;
	margin-left:24px;
	border-left:1px solid #939598;
	background-image:url(images/shadow.png);
	background-position:right top;
	background-repeat:repeat-y;
	height:100%;
	xborder:1px solid green;
}
#nav{
	width:200px;
	padding-left:0px;
	margin-left:0px;
	height:100%;
	background-color:#FFFFFF;
}
/* this controls the logo area when you're not in the work section. to remain orange as a design choice. */
#navLogoArea{
	width:200px;
	height:100px;
	background-color:#d03500;
	position:relative;
	top:0px;
	left:0px;
}
/* HOVER - */
#navLogoArea:hover{
	width:200px;
	height:100px;
	background-color:#939598;
	position:relative;
	top:0px;
	left:0px;
}
/* ACTIVE - */
#navLogoAreaWork{
	width:200px;
	height:100px;
	background-color:#CACBCC;
	position:relative;
	top:0px;
	left:0px;
}
/* HOVER - */
#navLogoAreaWork:hover{
	width:200px;
	height:100px;
	background-color:#939598;
	position:relative;
	top:0px;
	left:0px;
}
#navLogo{
	position:absolute;
	left:0px;
}	

#sectMain{font-weight:bold;}
#sectAbout1, #sectContact1, #sectWork1, #sectPerspectives1, {font-size:12px; display:block;}

#sectCopy{ 
	font-size:10px;
	margin-top:13px;
	padding-left:20px;
	margin-right:16px;
	padding-bottom:16px;}
	
.navSection{
	margin-top:16px;
	padding-left:20px;
	padding-right:16px;
	padding-bottom:16px;
	background-color:#ffffff;
	border-bottom:1px solid #939598;
}
.subnavSection{
	margin:0px 0px 18px 0px;
	padding0px;
	background-color:#ffffff;
}
#sectContactText{padding-top:0px;color:#939598; font-size:10px;}


#sectContactText a.otherLink:link, #sectContactText a.otherLink:visited{
	color:#d03500;
	text-decoration:none;
	font-size:10px;
	text-transform:none;
	display:inline;
}	
#sectContactText a.otherLink:hover, #sectContactText a.otherLink:active{
	color:#939598;
	text-decoration:none;
	font-size:10px;
	text-transform:none;
	display:inline;
}	

/* subnav on home active color - what you see before you've clicked or visited*/
.navSection a:link, .navSection a:visited{
	font-size: 14px;
	color:#8E9294;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
}	
/* HOVER - subnav on home hover color ALL nav hover color*/
.navSection a:hover, .navSection a:active{
	font-size: 14px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
}	

/* ACTIVE - nav on WORK selected color  only for the first navigation item */
.navSection a.navTopOn:link, .navSection a.navTopOn:visited{
	font-size: 14px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
	font-weight:bold;
}
/* HOVER - only for the first navigation item */	
.navSection a.navTopOn:hover, .navSection a.navTopOn:active{
	font-size: 14px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
	font-weight:bold;
}


/* ACTIVE - nav on WORK selected color*/
.navSection a.navOn:link, .navSection a.navOn:visited{
	font-size: 14px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:19px;
	margin-bottom:0px;
	font-weight:bold;
}
/* HOVER - */	
.navSection a.navOn:hover, .navSection a.navOn:active{
	font-size: 14px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:19px;
	margin-bottom:0px;
	font-weight:bold;
}	

/* ACTIVE - nav on subnav WORK selected color */
.subnavSection a.subNav:link, .subnavSection a.subNav:visited{
	font-size: 10px;
	color:#8E9194;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
	font-weight:normal;
	text-indent: 8px;
}	
/* HOVER - nav on subnav WORK selected color when you're in a section and you hover*/
.subnavSection a.subNav:hover, .subnavSection a.subNav:active{
	font-size: 10px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
	font-weight:normal;
	text-indent: 8px;
}

/* ACTIVE - nav on subnav WORK selected color */
.navSection a.subNavOn:link, .navSection a.subNavOn:visited{
	font-size: 10px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
	font-weight:normal;
	text-indent: 8px;
}	
/* HOVER - nav on subnav WORK selected color when you're in a section and you hover*/
.navSection a.subNavOn:hover, .navSection a.subNavOn:active{
	font-size: 10px;
	color:#B83F00;
	display:block;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
	font-weight:normal;
}	




#sectCopy a:link, #sectCopy a:visited{
	text-transform:uppercase;
	color:#B83F00;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
}	
#sectCopy a:hover, #sectCopy a:active{
	text-transform:uppercase;
	color:#8E9294;
	text-decoration:none;
	margin-top:9px;
	margin-bottom:0px;
}	

.navText{padding-right:5px;}

.mapBubble{ font-size:10px;}

.copyOrange{ color:#d03500;}
.copyGrey{ color:#939598;}

#copyright{display:none;xvisibility:hidden; color:#939598;}
#clearOne{
	clear:both;
}
/* contact page map */
#mapWrapper{position: relative; top:0px; left:0px; width:990px; height:475px; margin-left:240px;z-index:2;}

#googleMap{position:absolute;top:0px;left:0px;width:990px; height:475px; display:block;visibility:visible;}
#googleMapSV{position:absolute;top:0px;left:0px;width:990px; height:475px; display:none;visibility:hidden;}

#googleMapLink{text-align:left; width:965px; height:20px;display:block;padding-left:25px; margin-bottom:5px;}
#googleMapSVLink{text-align:left; width:965px; height:20px;display:block;padding-left:25px; margin-bottom:5px;}