/* COLORS:
gray light:	E6E3E0
gray dark:	837667
orange:		FC8744
dark gray (text highlight):	413B33

*/

/* RESET */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

body { line-height: 1; background: #FFF; margin:0; }

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

hr { display: none;}

a img { border: none; }

body{
	background: #E6E3E0;
	color: #837667;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 75%;
	text-align: center;
	margin: 0 auto;
}

a{
	color: #837667;
	text-decoration: none;
}
a:hover{
	color: #837667;
	text-decoration: underline;
}

#wrapper{
	width: 750px;
	margin: 0 auto;
/*	position: relative;*/
}

#wide-wrapper{
	width: 960px;
	margin: 0 auto;
}

/* HEADER */

#header h1 a{
	display: block;
	height: 80px;
	background: url(../images/common/mainHdr.jpg) 50% 0 no-repeat;
	outline: none;
}
#header h1 a span,
#header h2{
	display: none;
}

/* WIDE HEADER */

#wide-header h1 a{
	display: block;
	height: 80px;
	background: url(../images/common/mainHdrWide.jpg) 50% 0 no-repeat;
	outline: none;
}
#wide-header h1 a span,
#wide-header h2{
	display: none;
}

/* NAV */

ul#nav{
	height: 33px;
	width: 750px;
	border-top: 1px solid #BEB7AF;
	border-left: 1px solid #BEB7AF;
	border-right: 1px solid #BEB7AF;
}

ul#nav li{
	display: block;
	float: left;
	list-style-type: none;
	font-size: 2px;
	color: #E6E3E0;
}
ul#nav li a{
	display: block;
	height: 33px;
	color: #E6E3E0;
	background: url(../images/common/nav.gif) 0 0 no-repeat;
	outline: none;
}

ul#nav li#nav-residential a{
	width: 176px;
}
ul#nav li#nav-current a{
	width: 178px;
	background-position: -176px 0;
}
ul#nav li#nav-editorial a{
	width: 114px;
	background-position: -354px 0;
}
ul#nav li#nav-biography a{
	width: 121px;
	background-position: -468px 0;
}
ul#nav li#nav-approach a{
	width: 159px;
	background-position: -589px 0;
}

#body-residential ul#nav li#nav-residential a,
ul#nav li#nav-residential a:hover{
	background-position: 0 -50px;
}
#body-current ul#nav li#nav-current a,
ul#nav li#nav-current a:hover{
	background-position: -176px -50px;
}
#body-editorial ul#nav li#nav-editorial a,
ul#nav li#nav-editorial a:hover{
	background-position: -354px -50px;;
}
#body-biography ul#nav li#nav-biography a,
ul#nav li#nav-biography a:hover{
	background-position: -468px -50px;
}
#body-approach ul#nav li#nav-approach a,
ul#nav li#nav-approach a:hover{
	background-position: -589px -50px;
}

/* RESIDENTIAL NAV */

ul#residential-nav{
	height: 33px;
	width: 960px;
	border-top: 1px solid #BEB7AF;
	border-left: 1px solid #BEB7AF;
	border-right: 1px solid #BEB7AF;
}

ul#residential-nav li{
	display: block;
	float: left;
	list-style-type: none;
	font-size: 2px;
	color: #E6E3E0;
}
ul#residential-nav li a{
	display: block;
	height: 33px;
	color: #E6E3E0;
	background: url(../images/common/navWide.gif) 0 0 no-repeat;
	outline: none;
}

ul#residential-nav li#nav-residential a{
	width: 281px;
}
ul#residential-nav li#nav-current a{
	width: 178px;
	background-position: -281px 0;
}
ul#residential-nav li#nav-editorial a{
	width: 114px;
	background-position: -459px 0;
}
ul#residential-nav li#nav-biography a{
	width: 121px;
	background-position: -573px 0;
}
ul#residential-nav li#nav-approach a{
	width: 264px;
	background-position: -694px 0;
}

#body-residential ul#residential-nav li#nav-residential a,
ul#residential-nav li#nav-residential a:hover{
	background-position: 0 -50px;
}
#body-current ul#residential-nav li#nav-current a,
ul#residential-nav li#nav-current a:hover{
	background-position: -281px -50px;
}
#body-editorial ul#residential-nav li#nav-editorial a,
ul#residential-nav li#nav-editorial a:hover{
	background-position: -459px -50px;;
}
#body-biography ul#residential-nav li#nav-biography a,
ul#residential-nav li#nav-biography a:hover{
	background-position: -573px -50px;
}
#body-approach ul#residential-nav li#nav-approach a,
ul#residential-nav li#nav-approach a:hover{
	background-position: -694px -50px;
}

/* CONTENT */

#content{
	text-align: left;
	width: 750px;
	height: 400px;
	border: 1px solid #BEB7AF;
}

#wide-content{
	text-align: left;
	width: 960px;
	height: 560px;
	border: 1px solid #BEB7AF;
}

#residential-content{
	text-align: left;
	width: 960px;
	height: 610px;
	border: 1px solid #BEB7AF;
}

/* RESIDENTIAL */

#body-residential h2{
	margin: 66px 0 0 16px;
	background: url(../images/residential/hdrResidential.gif) -2px 0 no-repeat;
	font-size: 2px;
	color: #E6E3E0;
	width: 232px;
	height: 28px;
	float: left;
}

/* COMMERCIAL */

#body-commercial h2{
	margin: 66px 0 0 16px;
	background: url(../images/commercial/hdrCommercial.gif) -1px 1px no-repeat;
	font-size: 2px;
	color: #E6E3E0;
	width: 232px;
	height: 28px;
	float: left;
}

/* GALLERY */

#subNav{
	margin: 0 0 0 16px;
	list-style-type: none;
	width: 232px;
	float: left;
	clear: left;
}
#subNav li{
	margin: 0 0 8px 0;
}

#subNav li a:hover{
	text-decoration: none;
	color: #413B33;
}
#subNav li a.thisProject{
	font-style: italic;
	text-decoration: none;
	color: #413B33;
}

#galleryImages{
	position: relative;
	height: 578px;
	width: 566px;
	float: left;
	margin: -90px 0 0 4px;
	overflow: hidden;
}

#galleryImages img{
	display: none;
	position: absolute;
}
#galleryImages img.horizontal{
	margin-top: 60px;
}

#galleryThumbs{
	margin: 4px 0 0 834px;
	font-size: 0;
}
#galleryThumbs img{
	margin: 0 4px 4px 0;
	cursor: pointer;
}

/* APPROACH */

#body-approach h2{
	margin: 66px 0 0 16px;
	background: url(../images/approach/hdrApproach.gif) -2px 0 no-repeat;
	font-size: 2px;
	color: #E6E3E0;
	width: 472px;
	height: 28px;
	float: left;
}
#body-approach #content img{
	float: right;
	margin: 4px 4px 0 0;
}

#body-approach #content #scrollHolder{
	float: left;
}

#body-approach #content #scrollContent{
	width: 484px;
	margin: 0 0 0 16px;
	height: 270px;
	overflow-y: scroll;
}

#body-approach #content p{
	padding: 0 24px 0 0;
	margin: 0 0 12px 0;
	line-height: 1.4em;
}

/* CURRENT PROJECTS */

#body-current h2{
	margin: 66px 0 0 16px;
	background: url(../images/current/hdrCurrent.gif) -2px 1px no-repeat;
	font-size: 2px;
	color: #E6E3E0;
	width: 472px;
	height: 28px;
	float: left;
}
#body-current #content img{
	float: right;
	margin: 4px 4px 0 0;
}
#body-current #content p{
	width: 464px;
	margin: 0 0 12px 16px;
	line-height: 1.4em;
}
#body-current ul#projectList li{
	margin: 0 0 12px 0;
	padding: 0 0 0 16px;
	line-height: 1.4em;
	font-style: italic;
	list-style-type: none;
	background: url(../images/common/listBullet.gif) 7px 7px no-repeat;
}

/* BIOGRAPHY */

#body-biography h2{
	margin: 66px 0 0 16px;
	background: url(../images/biography/hdrBiography.gif) -2px 1px no-repeat;
	font-size: 2px;
	color: #E6E3E0;
	width: 136px;
	height: 28px;
	float: left;
}

#body-biography ul#designerList{
	float: left;
	clear: left;
	width: 136px;
	margin: -6px 0 12px 16px;
	line-height: 1.4em;
	list-style-type: none;
}

#body-biography ul#designerList li {
	cursor: pointer;
	line-height: 2.4em;
	letter-spacing: 1px;
}
#body-biography ul#designerList li.on{
	color: #413B33;
}
#body-biography ul#designerList li.thisDesigner{
	font-style: italic;
	color: #413B33;
}

#body-biography #content img {
	float: right;
	margin: 4px 4px 0 0;
	cursor: pointer;
}

#body-biography #content p {
	display: none;
	padding: 0 24px 0 0;
	margin: 0 0 12px 0;
	line-height: 1.4em;
}

#body-biography #content #scrollHolder {
	margin: 66px 0 0 0;
}

#body-biography #content #scrollContent {
	width: 290px;
	margin: 0 0 0 0px;
	height: 270px;
	overflow-y: scroll;
}

#bioImages {
	position: relative;
	height: 368px;
	width: 306px;
	float: right;
	overflow: hidden;
}

#bioImages img {
	display: none;
	position: absolute;
}

/* EDITORIAL */

#body-editorial h2 {
	margin: 66px 0 0 16px;
	background: url(../images/editorial/hdrEditorial.gif) -2px 1px no-repeat;
	font-size: 2px;
	color: #E6E3E0;
	width: 340px;
	height: 28px;
	float: left;
}
#body-editorial #content p {
	width: 300px;
	margin: 0 0 12px 16px;
	line-height: 1.4em;
}
#body-editorial #content img {
	margin: 0px 4px 4px 0;
}

#body-editorial ul#linkList{
	margin: 0 0 12px 0;
}

#body-editorial ul#linkList li {
	padding: 0 0 0 16px;
	line-height: 1.4em;
	list-style-type: none;
	background: url(../images/common/listBullet.gif) 7px 7px no-repeat;
}

#body-editorial #content #scrollHolder {
	float: right;
	margin: 4px 8px 10px 0;
}

#body-editorial #content #scrollContent {
	width: 350px;
	height: 380px;
	overflow-y: scroll;
}

#body-editorial #content #scrollHolder2 {
	float: left;
	margin: 4px 8px 10px 0;
}

#body-editorial #content #scrollContent2 {
	width: 375px;
	height: 270px;
	margin: 0;
	padding: 0;
	overflow-y: scroll;
	overflow: hidden;
}

/* MAGAZINE */

#body-magazine h2 {
	margin: 66px 0 0 16px;
	font-size: 2px;
	color: #E6E3E0;
	width: 340px;
	height: 28px;
	float: left;
}
#body-magazine #wide-content p {
	width: 300px;
	margin: 0 0 12px 16px;
	line-height: 1.4em;
}
#body-magazine #wide-content img {
	clear: all;
  display: block;
	margin: 4px auto 0 auto; 
}

#body-magazine #wide-content #backText {
	margin: 10px auto 0 auto;
	font-style: italic;
	text-align: center;
}

#body-magazine #navLinks {
	width: 700px;
	text-align: left;
	margin: 10px auto;
	padding: 0px;
}
#body-magazine #navLinks #prev {
	float: left;
	width: 150px;
}
#body-magazine #navLinks #next {
	float: right;
	width: 150px;
	text-align: right;
}
#body-magazine #navLinks #back { 
	float: left;
	width: 390px;
	margin: 0 auto;
	text-align: center;
	font-style: italic;
}


/* FOOTER */

#footer{
	background: url(../images/common/logo.jpg) 50% 44px no-repeat;
	padding: 16px 0 88px 0;
	letter-spacing: 1px;
}

/* jScrollPane STYLES */

.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: url(../images/common/scrollTrack.gif) 0 0 repeat-y;
}
.jScrollPaneDrag {
	position: absolute;
	background: url(../images/common/scrollDrag.gif) 4px 0 repeat-y;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background: url(../images/common/scrollArrowUp.gif) 0 0 no-repeat;
	height: 9px;
}
a.jScrollArrowUp:hover {
/*	background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background: url(../images/common/scrollArrowDown.gif) 0 -2px no-repeat;
	height: 9px;
}
a.jScrollArrowDown:hover {
/*	background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
/*	background-color: #f00;*/
}