/*-------------------------------------------

           Title:  QualityXHTML
           Usage:  Global Layout
           Author:  QualityXHTML Team

---------------------------------------------*/


/*====================TOC====================

                1. Reset
                2. Containers
                3. Skip Links
                4. Branding
                5. Site Navigation
                6. Content
                7. Supp Navigation
                8. Site Info

=============================================*/



/* 1. Reset
---------------------------------------------*/
* {
	margin: 0;
	padding: 0;
	}

* html {
	border-width: 2px 0 0;
	}

body {
	line-height: 1;
	}

ol, ul {
	list-style: none;
	}

a {
	text-decoration: none;
	outline: none;
	color: #f9d7a7;
	}

a:hover {
	text-decoration: underline;
	}

img, fieldset {
	border: none;
	}

img {
	vertical-align: top;
	}

legend {
	display: none;
	}


/* 2. Containers
---------------------------------------------*/
html {
	background: #33291C url(../images/html_bg.jpg) repeat-x;
	}

body {
	position: relative;
	margin: 0 auto;
	width: 1000px;
	background: url(../images/body_bg.jpg) no-repeat 0 139px;
	font-family: Helvetica, Arial, sans-serif;
	}


/* 3. Skip Links
---------------------------------------------*/
#skip-links {
	position: absolute;
	left: -500em;
	}


/* 4. Branding
---------------------------------------------*/
#branding {
	width: 1000px;
	height: 139px;
	}

#branding h1 {
	width: 1000px;
	height: 100%;
	background: url(../images/branding_h1_bg.jpg) no-repeat top left;
	}

#branding h1 a {
	position: relative;
	top: 23px;
	left: 60px;
	display: block;
	width: 327px;
	height: 89px;
	overflow: hidden;
	text-indent: -500em;
	}

#branding p {
	position: absolute;
	left: -500em;
	}


/* 5. Site Navigation
---------------------------------------------*/
#site-nav {
	position: absolute;
	top: 55px;
	right: 55px;
	z-index: 5;
	width: 519px;
	height: 28px;
	}

#site-nav h3 {
	position: absolute;
	left: -500em;
	}

#site-nav ul li {
	float: left;
	display: inline;
	height: 100%;
	}

#site-nav ul li a {
	display: inline-block;
	font-size: 0.8em;
	cursor: pointer;
	}

html[xmlns^="HTTP"] #site-nav ul li a {   /* for Firfox 2 */
	display: block;
	}

#site-nav ul li a span {
	display: inline-block;
	margin-right: 2px;
	padding: 8px 10px 7px 12px;
	height: 100%;
	color: #E6D3B6;
	}

html[xmlns^="HTTP"] #site-nav ul li a span {
	display: block;
	}

#home         #site-nav ul #site-nav-1 a,
#why          #site-nav ul #site-nav-2 a,
#examples     #site-nav ul #site-nav-3 a,
#testimonials #site-nav ul #site-nav-4 a,
#contact      #site-nav ul #site-nav-6 a,
#blog         #site-nav ul #site-nav-7 a,
#site-nav ul li a:hover {
	background-image: url(../images/site-nav_a_bg.png) !important;
	background: url(../images/site-nav_a_bg_ie6.gif) no-repeat top right;
	text-decoration: none;
	}

#home         #site-nav ul #site-nav-1 a span,
#why          #site-nav ul #site-nav-2 a span,
#examples     #site-nav ul #site-nav-3 a span,
#testimonials #site-nav ul #site-nav-4 a span,
#contact      #site-nav ul #site-nav-6 a span,
#blog         #site-nav ul #site-nav-7 a span,
#site-nav ul li a:hover span {
	margin-right: 2px;
	background-image: url(../images/site-nav_span_bg.png) !important;
	background: url(../images/site-nav_span_bg_ie6.gif) no-repeat top left;
	color: white;
	text-decoration: none;
	}

#site-nav #site-nav-5 a {
	background: none !important;
	font-weight: bold;
	}

#site-nav #site-nav-5 a span {
	margin: 0 12px 5px 12px;
	padding: 8px 0 1px;
	border-bottom: 1px solid;
	background: none;
	color: white;
	}

#order #site-nav #site-nav-5 a span,
#site-nav #site-nav-5 a:hover span {
	border: none;
	background: none !important;
	margin-bottom: 0;
	padding-bottom: 7px;
	}


/* 6. Content
---------------------------------------------*/
#content {
	position: relative;
	z-index: 5;
	margin-left: 62px;
	width: 871px;
	}

#content .extra-1,
#content .extra-2 {
	position: absolute;
	width: 7px;
	height: 436px;
	background: no-repeat;
	}

#content .extra-1 { top: 0; left:  0;                          background-image: url(../images/leaves_top_bg.jpg); background-position: 0 0; }
#content .extra-2 { top: 0; right: 0 !important; right: -1px; background-image: url(../images/leaves_top_bg.jpg); background-position: -7px 0; }

#main {
	position: relative;
	padding-top: 47px;
	width: 857px;
	height: auto;
	overflow: hidden;
	border: 7px solid white;
	border-top: none;
	background: #2E2E2E url(../images/main_bg.jpg) no-repeat top left;
	}

#main div .extra-1,
#main div .extra-2 {
	display: none;
	}

#main #quote {
	position: absolute;
	top: 15px;
	left: 27px;
	color: white;
	font-size: 0.95em;
	}

#main #quote h4 {
	position: absolute;
	left: -500em;
	}

#main #quote blockquote,
#main #quote blockquote p {
	display: inline;
	margin-right: 1px;
	font-style: italic;
	line-height: 1.1em;
	}

#main #quote cite {
	color: #DFD0B9;
	}

#main .extra-1,
#main .extra-2 {
	display: none;
	}

#sub {
	position: relative;
	z-index: 1;
	width: 871px;
	min-height: 187px;
	background: url(../images/sub_bg.png) repeat-y;
	border-top: 7px solid #fff;
	margin-top: -7px;
	}

* html #sub {
	height: 187px;
	}

#sub div {
	position: relative;
	z-index: 5;
	float: left;
	display: inline;
	}

#sub div h4 {
	margin: 14px 0 0 17px;
	font-weight: normal;
	font-size: 1.1em;
	}

#sub #recent {
	width: 281px;
	}

#sub #recent h4 {
	position: relative;
	z-index: 5;
	}

#sub #recent img {
	position: relative;
	z-index: 5;
	margin: 14px 0 0 18px;
	border: 5px solid #AFABAA;
	}

#sub #hiring {
	padding: 0 5px 13px 0;
	width: 283px;
	}

#sub #hiring h4 {
	margin-left: 20px;
	}

#sub #hiring ol {
	margin: 16px 0 0 30px;
	font-size: 0.75em;
	list-style-type: decimal;
	}

#sub #hiring ol li {
	margin: 0 19px 13px 7px;
	color: #435640;
	line-height: 1.15em;
	list-style-position: inside;
	text-indent: -16px;
	}

#sub > /**/ #hiring ol li {
	margin: 0 0 13px 13px;
	width: 234px;
	text-indent: -22px;
	}

#sub #hiring ol li abbr {
	border: none;
	}

#sub #hiring ol li a {
	color: #435640;
	font-weight: bold;
	}

#sub #suggest {
	padding: 0 0 23px 19px;
	width: 260px;
	}

#sub #suggest h4 {
	margin-left: -1px;
	}

#sub #suggest p {
	margin: 13px 0 5px 0;
	width: 260px;
	color: #344034;
	font-size: 0.75em;
	line-height: 1.5em;
	}

#sub #suggest a {
	color: #344034;
	font-weight: bold;
	font-size: 0.75em;
	line-height: 1.5em;
	}

#sub div .extra-1,
#sub div .extra-2 {
	display: none;
	}

#sub .extra-1,
#sub .extra-2 {
	position: absolute;
	z-index: 1;
	background: no-repeat top left;
	}

#sub div.extra-1 { top: auto; bottom: 0 !important; bottom: -1px; left: 0;  width: 871px; height: 105px; background-image: url(../images/leaves_bottom_bg.png); }
#sub div.extra-2 { top: auto; left: 0;                                        width: 871px;  height: 109px;  background-image: url(../images/sub_shade_bg.png); }

#sub #recent .extra-1 {
	display: block;
	top: -110px;
	left: -53px;
	z-index: 3;
	width: 109px;
	height: 182px;
	background: url(../images/leaves_ml_bg.png) no-repeat top left;
	}

#sub:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	}


/* 7. Supplemantary Navigatioin
---------------------------------------------*/
#supp-nav {
	position: absolute;
	bottom: 146px !important;
	bottom: 145px;
	left: 128px;
	z-index: 5;
	}

#supp-nav h4 {
	position: absolute;
	left: -500em;
	}

#supp-nav ul {
	display: inline;
	cursor: default;
	}

#supp-nav ul li {
	display: inline;
	margin-right: 18px;
	}

#supp-nav ul li a {
	display: inline-block;
	border-bottom: 1px solid;
	color: #9D8A6E;
	font-size: 0.75em;
	}

#supp-nav > /**/ ul li a {
	padding-bottom: 1px;
	border-bottom: 1px solid;
	color: #9D8A6E;
	font-size: 0.75em;
	}

html[xmlns^="HTTP"] #supp-nav ul li a {
	margin-bottom: -1px;
	padding: 0;
	}

#supp-nav ul li a:hover {
	padding-bottom: 1px;
	border-bottom: none;
	color: #E6D3B6;
	text-decoration: none;
	}

html[xmlns^="HTTP"] #supp-nav ul li a:hover {
	padding-bottom: 1px;
	}


/* 8. Site Info
---------------------------------------------*/
#siteinfo {
	display: inline-block;   /* for IE6 & IE7 */
	margin-top: -255px;
	padding-top: 297px;
	width: 1000px;
	height: 133px;
	background: url(../images/siteinfo_bg.jpg) no-repeat top left;
	color: #645A4B;
	font-size: 0.75em;
	text-indent: 127px;
	}

#siteinfo {   /* for IE6 & IE7 */
	display: inline;
	margin-left: -127px;
	}

body > /**/ #siteinfo {
	position: static;
	display: block;
	margin-left: 0;
	}