
/* Styles common to all pages ------------------------------------*/
* {
	margin: 0;
	padding: 0;
	}
body {
	background : #CCC;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 70%;
	}
a {
	text-decoration: none;
	
	}
a img {
	border:none;
	}
a:visited {
	color: #8b9074;
	}
#wrapper {
	width: 900px;
	background : white;
	background-image : url(images/img_paper.png);
	background-repeat:repeat;
	margin: 25px auto 25px;
	}
#logo {
	float : left;
	background-image : url(images/img_jdeGuzman.png);
	background-repeat:no-repeat;
	margin-left : 20px;
	margin-top : 20px;
	width: 250px;
	height: 46px;

	}
	
/* MAIN NAVIGATION ------------------------------------*/
#nav {
	position : relative;
	top : 10px;
	left : 70px;
	padding : .3em;
	}
#nav ul {
	list-style : none;
	width : auto;
	}
#nav li {
	float : left;
	width : 9em;
	margin-left:.5em;
	}
#nav a {
	color : #8b9074;
	display : block;
	width : 100px;
	text-decoration: none;
	font-weight : bold;
	font-size: 1.1em;
	margin-right: .7em;
	}
#nav ul a:hover {
	color : #CC6633;
	}
#nav li:hover ul {
	left: auto;
	}
#nav li:hover ul, #nav li.sfhover ul {
	left: auto;
	}
#nav ul li ul {
	display : none;
	}
#nav ul li ul li {
	background : none;
	width : 10em;
	margin-left:0;
	}
#nav ul li ul li a {
	color: #999;
	font-weight: 100;
	font-size: 1em;
	line-height: 1.3em;
	text-transform: none;

	}
#nav ul li ul li a:hover{
	color: #CC6633;
	background-color:transparent;
	}


/* SECONDARY NAV ------------------------------------*/
.subnav {
	list-style-type : none;
	min-height : 250px;
	width: 340px;
	margin : 20px 0 0 20px;
	float : left;
	clear : both;
	font-size : 120%;
	}
.subnav ul {
	list-style-type:none;
	}
.subnav li {
	color : #666;
	}
.subnav a:hover {
	color: #61813a;
	}
.underline {
	font-weight:bold;
	}

.inset , .rental a {
	margin-left : 7px;
	}
.designTeam {
	list-style:none;
	margin-top: -80px;
	margin-left : 50%;
	height : 275px;
	width: 340px;
	float : left;
	list-style : none;
	clear : both;
	font-size : 1.1em;
	}
	
.designTeam strong {
	color : #999933;
	}
	
.subnav1 {
	margin-left: 5px;
	}
	
	
.designTeam li {
	padding-bottom : 4px;
	}
#active {
	color: #666;
	font-size : 1.1em;
	font-weight : 900;
	position : relative;
	padding-bottom : 5px;
	
	}

#nav li:hover ul {
	left: auto;
	}
	
.subnav3 {
	font-size : 1.1em;
	line-height : 1.2em;
	list-style : none;
	text-transform:none;
	margin: 1em 0px 0px 50%;
	}
	
.subnav3 li {
	padding: .5em 1em 0 0;
	}
.underline2 {
	font-weight:bold;
	color:#666;
	}
.subnav4 {
	font-size : 1.2em;
	line-height : 1.2em;
	list-style : none;
	text-transform:none;
	margin: 1em 0px 0px 50%;
	}
.subnav4 li {
	color: black;
}
.subnav4 a:hover {
	color: #999933;
	}


/* QUOTE BOXES w/IMAGES ------------------------------------*/

ul.largeQuoteBox {
	background:white;
	background-image:url(images/img_index_big.jpg);
	background-repeat:no-repeat;
	list-style : none;
	height : 800px;
	width: 857px;
	margin-left: 20px;
	margin-top: 145px;
	border: solid #CC6633 1px;
	}
#largeQuoteImage {
	height: 250px;
	width: 360px;
	float:right;
	clear:both;
	margin-top:-200px;
	}
		
/*.largeQuoteBox h1 {
	color : grey;
	font-weight: 100;
	font-size: 2em;
	line-height:1.5em;
	display:block;
	width:300px;
	float:left;
	clear:right;
	padding: 15px 0 0 15px;
	}*/
	
.quoteLink {
	color : #999933;
	width: 300px;
	font-size: 110%;
	font-weight:bold;
	float:left;
	clear:right;
	position: relative;
	top:190px;
	left:-340px;
	
	}
	
#largePullQuoteImage {
	height: 200px;
	width: 357px;
	float:left;
	}
	
	
ul.smallQuoteBox {
	background: white;
	list-style : none;
	height : 700px;
	width: 837px;
	margin-left: 20px;
	margin-top: 145px;
	padding-right:20px;
	border: solid #CC6633 1px;
	}
	
.smallQuoteBox  a{
	color: #CC6633;
	}


	
ul.smallQuoteBox2 {
	background :#e8ecd0;
	list-style : none;
	height : 200px;
	width : 717px;
	border: solid #999933 1px;
	margin-left:18.5px;
	}
.smallQuoteBox2 h1 {
	color : #8b9074;
	font-weight: 100;
	font-size: 2em;
	line-height:1.3em;
	display:block;
	width:300px;
	float:left;
	clear:right;
	padding: 15px 30px 0 15px;
	}
	
.smallQuoteBox p {
	color : #8b9074;
	font-size: 108%;
	}
	
.smallQuoteBox li {
	height:auto;
	width:810px;
	margin-left: 20px;
	margin-right: 20px;
	float:left;
	}
	
#smallPullQuoteImage {
	height: 200px;
	width: 357px;
	float:left;
	}
#smallQuoteImage {
	position: relative;
	height: 200px;
	width: 360px;
	float:right;
	}
/* address to left of cafe etc.

.address {
	font-size : 1.2em;
	padding : 15px 0 0 15px;
	float : left;
	clear : right;
	width : 315px;
	}*/

/* CONTENT WRAPPERS ---------------------------------------*/

.content {
	min-height:600px;
	width : auto;
	position : relative;
	}
	
.content_headline {
	color : #8b9074;
	font-size: 1.5em;
	font-weight: bold;
	line-height:2em;
	margin: .7em 0px -.7em 50%;
	}

	
.content_subhead {
	color : #999933;
	font-size: 130%;
	font-weight: bold;
	line-height:2em;
	margin: .1em 0px -.7em 50%;
	}
.content_series_subhead {
	color : #999933;
	font-weight : 900;
	font-size : 1.1em;
	padding-top : .3em;
	}
.content_series_subhead2 {
	color : #999933;
	font-weight : 900;
	font-size : 1.1em;
	margin-top: .5em;
	margin-left: 50%;
	margin-bottom: -.5em;
	}
.content_series_subhead3 {
	color : #999933;
	font-weight : 900;
	font-size : 1.2em;
	margin-top: .7em;
	margin-left: 50%;
	margin-bottom: -.7em;
	}
#content_wrapper h2 {
	font-size: 1.37em;
	margin: 1.3em 0em 0em 0em;
	}
	
.content_body_copy {
	color : #333300;
	font-size: 120%;
	margin: .7em 20px 0px 50%;
	}
.content_series_copy {
	color : #333300;
	list-style : none;
	font-size: 1em;
	margin: 0px 0px 0px 50%;
	}
	
#numbers {
	float:right;
	clear:right;
	color : #8b9074;
	font-size: 90%;
	font-weight:900;
	top:20px;
	left:px;
	padding-right:40px;
	list-style:none;
	}

#numbers p {
	float:left;
	list-style:none;
	margin-top:15px;
	margin-right: 10px;
	}


.resume a {
	color : #8b9074;
	padding-right:8px;
	padding-left:8px;
	padding-top:5px;
	padding-bottom:5px;

	
	}
p.resume a:hover{
	color: #CC6633;
	padding-right:10px;
	padding-left:10px;
	padding-top:5px;
	padding-bottom:5px;
	margin-left:-3px;
	margin-right: -3px;
border: solid #CC6633 1px;

	}
	
p.resume{
	color:#8b9074;
	padding-top:6px;
	margin-left:-1px;
		
	}
p.active {
	color:#CC6633;
	padding-right:10px;
	padding-left:10px;
	padding-top:5px;
	padding-bottom:5px;
	border: solid #CC6633 1px;
	}
	
	p.active2 {

	color:#CC6633;
	padding-right:10px;
	padding-left:10px;
	padding-top:5px;
	padding-bottom:5px;
	border: solid #CC6633 1px;
	}
	
#sections {
	width:500px;
	float:right;
	clear:right;
	color : #8b9074;
	font-size: 90%;
	font-weight:900;
	position:relative;
	top:0px;
	left:0px;
	padding-right:0px;
	list-style:none;
	
	}
	
	#sections p {
	float:left;
	list-style:none;
	margin-top:15px;
	margin-right: 10px;
	padding-bottom:6px;
	padding-right:6px;
	}

	
/* RESUME ------------------------------------*/
	
.line {
border-top: solid #8b9074 1px;
	height:15px;
	float:left;
	}
.resume_address {
	margin: 20px 0 15px 20px;
	}
	
.resume_address1 {
	margin: -15px 0 15px 20px;
	}
.date {
	margin: 10px 0 0 0px;
	text-align: right;
	list-style:none;
	
	float: left;
	}
	
p.date_invisible {
	color:white;
	margin: 10px 0 0 0px;
	text-align: right;
	list-style:none;
	float: left;
	}
.company {
	text-align:right;
	position: relative;
	left: 8px;
	margin: 10px 0 0 0;
	width: 150px;
	float:left;
	clear:right;
	}
p.company_invisible {
	color:white;
	text-align:right;
	position: relative;
	left: 8px;
	margin: 10px 0 0 0;
	width: 150px;
	float:left;
	clear:right;
	}	
	
.company2 {
	text-align:right;
	position: relative;
	left: 90px;
	margin: 10px 0 0 0;
	width: 150px;
	float:left;
	clear:right;
	}
.duties {
	position: relative;
	left: 275px;
	margin-top: -15px;
	margin-right: 270px;
	float: left;
	padding-bottom: 15px;
	}
.duties_interbrand {
	position: relative;
	left:275px;
	margin-top: -30px;
	margin-right: 270px;
	float: left;
	padding-bottom: 15px;
	}
.duties2 {
	position: relative;
	left: 275px;
	margin-top: -30px;
	margin-right: 270px;
	float: left;
	padding-bottom: 15px;
	}
.duties3 {
	position: relative;
	left: 275px;
	margin-top: -45px;
	margin-right: 270px;
	float: left;
	padding-bottom: 15px;
	}
.duties4 {
	position: relative;
	left: 275px;
	margin-top: 0px;
	margin-right: 270px;
	float: left;
	padding-bottom: 15px;
	}
	



/*---------------------------------------GALLERY*/

ul.gallery {
	width: 850px;
	float:left;
	padding-top: 40px;
}

ul.gallery2 {
	width: 850px;
	float:left;
	padding-top: 80px;
}

.gallery li {
	list-style:none;
	width: 190px;
	margin-right: 5px;
	margin-left: 0px;
	padding-bottom: 5px;
	float:left;
	clear:right;
}
	
.gallery2 li {
	list-style:none;
	width: 190px;
	margin-right: 5px;
	margin-left: 0px;
	padding-bottom: 5px;
	float:left;
	clear:right;

	}
	

	
.gallery_images1 li {
	list-style:none;
	width: 190px;
	height: 130px;
	margin-right: 5px;
	margin-left: 0px;
	padding-bottom: 15px;
	float:left;
	clear:right;
	}
	
.gallery_images2 li {
	list-style:none;
	width: 190px;
	height: 130px;
	margin-right: 5px;
	margin-left: 0px;
	padding-bottom: 5px;
	float:left;
	clear:right;
	}
	
.gallery_images3 li {
	list-style:none;
	width: 190px;
	height: 130px;
	margin-right: 5px;
	margin-left: 0px;
	padding-top:15px;
	padding-bottom: 5px;
	float:left;
	clear:right;
	}
	
.line_side {
	border-right: solid #8b9074 1px;
	}
	

	
p.gallery_copy {
	font-size: 100%;
	}

/*--------------------------------COPYRIGHT*/

#copyright {
	font-size : .7em;
height : 1.5em;
	width : 870px;
	border-left: solid white 10px;
	border-right:solid white 10px;
	border-top:solid white 90px;
	border-bottom:solid white 8px;
	padding-top: 3px;
	padding-left: 10px;
	float: left;
	}
	
#copyright2 {
	font-size : .7em;
	background-image:url(images/img_paper2.png);
	height : 1.3em;
	width : 890px;
	
	padding-top: 3px;
	padding-left: 10px;
	float: left;
	}

/* SIDEBAR ---------------------------------------*/
.sidebar {
	list-style:none;
	padding-top : 8px;
	margin-left : 20px;
	height : 275px;
	width : 340px;
	float:left;
	clear : left;
	}
	
.sidebar li{
	float:left;
	padding-right: 10px;
	}
	
.empty_sidebar {
	list-style:none;
	padding-top : 8px;
	margin-left : 20px;
	min-height : 200px;
	width : 340px;
	float:left;
	clear : left;
	}
	
.rental {
	list-style:none;
	padding-top : .7em;
	min-height : 100px;
	width : 340px;
	float:left;
	clear : left;
	}

.caption {
	width : 150px;
	padding-top:3px;
	}
.caption2 {
	width : 150px;
	padding-left: 10px;
	padding-top:3px;
	}
.active {
	color : rgb(53,79,132);
	}
	
form {
	color : grey;
	font-size: 1.1em;
	margin: .7em 0px 0px 50%;
}

/* LIGHTBOXX-----------------------------------------------------------*/
#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#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: transparent url(img_lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(img_lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(img_lightbox/nextlabel.gif) right 15% no-repeat; }


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

#imageData{	padding:0 10px; color: #666; }
#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;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}
