/* =0-0 Reset */

/* =1-0 Layout (backgrounds, dimensions, positions) */

/* =2-0 Styling (text, whitespace) */
	/* =2-1 Header */
	/* =2-2 Content */
	/* =2-3 Footer */

/* =3-0 Page-Specific Styling (backgrounds, text, whitespace) */
	/* =3-1 Home */
	/* =3-2 Services */
	/* =3-3 Team */
	/* =3-4 Portfolio */
	/* =3-5 Resources */
	/* =3-6 Contact */



/* ================================================== */
/* =0-0 Reset */

/* adapted from meyerweb.com */

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, cite, code, del, dfn, em, font, img, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, input, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
/*	font-size: 100%; */
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}
body {
	background: #fff;
	color: #000;
	line-height: 1;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


/* ================================================== */
/* =1-0 Layout (backgrounds, dimensions, positions) */

/* in order of appearance */

body {
	background: #cdcdcd url(bg_body.jpg) center top no-repeat;
}
div#container {
	margin: 0 auto;
	width: 1000px;
}
div#header {
	margin: 0 auto;
	width: 900px;						/* W1: change value of W2, W3 to match */
}
div#logo {
	background: url(logo.png);
	float: left;
	height: 120px;
	position: relative;
	right: -20px;
	width: 190px;
}
div#slogan {
	float: right;
	height: 80px;
	line-height: 80px;
	width: 700px;						/* for IE7; otherwise nav stacks against this element */
}
div#nav {
	float: right;
	width: 700px;						/* for FF2; otherwise nav row appears below logo */
}
div.container-extender {
	clear: both;
}
div#shadow-top, div#shadow-middle, div#shadow-bottom {
	margin: 0 auto;
	width: 940px;
}
div#shadow-top {
	background: url(bg_shadow_top.png) center bottom no-repeat;
	height: 35px;						/* previously 20px */
}
div#shadow-middle {
	background: url(bg_shadow_middle.png) center center repeat-y;
}
div#content-container, div#content {
	margin: 0 auto;
}
div#content-container {
	background: #fff;
	width: 900px;						/* W2: content container needs to be narrower than shadow containers; */
}
div#content {							/* applying overflow creates useability issue with submenus in Opera9 */
	background: #fff;
	padding: 30px 0;						/* vertical margins creates gaps */
/*	width: 880px;	*/					/* make element narrower than parent to create buffer of whitespace */
}
div#shadow-bottom {
	background: url(bg_shadow_bottom.png) center top no-repeat;
	height: 25px;
	position: relative;
	z-index: 20;						/* shows bottom shadow */
}
div#footer {
	background: url(bg_footer.jpg) center bottom no-repeat;
	margin: 0 auto;
	height: 150px;
	position: relative;
	top: -25px;							/* prevents gap; absolute value should equal height bottom-shadow element */
	width: 900px;						/* W3: should be same as W1, W2 */
	z-index: 10;
}
div#footer ul {
	margin: 0 auto;
}

/* ================================================== */
/* =2-0 Styling (text, whitespace) */

/* sections in order of appearance, styling within sections in order by (parent) element */

body {
	font-family: "Lucida Sans Unicode", "Lucida Grande", serif;
	font-size: 62.5%;						/* makes 1em roughly equal to 10px */
}

	/* ================================================== */
	/* =2-1 Header */

div#slogan {
	color: #000;
	font-size: 2em;
	text-align: right;
}

	/* ================================================== */
	/* =2-2 Content */

div#content {
	color: #555;
	font-family: Arial, sans-serif;
	font-size: 1.2em;
	line-height: 1.8em;
	padding-left: 35px;						/* P1 */
}
html div#content p, 
html div#content ul {
	margin-bottom: 1.2em;			
	margin-right: 200px;						/* make room to right for background pics */
}
div#content dl dt, div#content h1, div#content h2 {		/* common header styling */
	font-weight: bold;
}
div#content h1 {
	font-size: 1.3em;
}
div#content dt, div#content h2 {					/* common header sizes */
	font-size: 1.2em;
}
div#content h3 {
	font-size: 1.1em;
	margin-top: 1.1em;
}
div#content a {
	color: #555;
	font-weight: bold;
}
div#content a:hover {
	color: #83aa42;
}
div#content div.twin-column {
	float: left;
	overflow: hidden;							/* for IE6 */
	width: 350px;
}
div#content div.twin-column p, 
div#content div.twin-column ul {
	margin-right: 25px;						/* removes inherited margin for showing background pics */
}
div#content div.twin-column ul li {
	margin-left: 15px;
}
div#content dl dt {
	color: #83aa42;
}
div#content h1 {
	padding: 0;
	margin-bottom: 1em;
}
div#content h1 span {
	font-size: 0.9em;
	position: relative;
	top: -2px;
}
div#content h1 span#left-pipe {
	padding-right: 10px;
}
div#content h1 span#right-pipe {
	padding-left: 10px;
	padding-right: 10px;
}
div#content h2 {
	margin: 1.4em 0 1em;
}
div#content em {
	color: #83aa42;
	font-style: normal;
	font-weight: bold;
}
div#content ul li {
	color: #83aa42;
	margin-left: 35px;						/* make same as P1 value */
	list-style: outside disc;
}
div#content ul li span {
	color: #555;
}
div#content strong {
	font-weight: bold;
}

	/* ================================================== */
	/* =2-3 Footer */

div#footer {
	font-size: 1.1em;
}
div#footer a {
	color: #000;
	padding: 5px;
}
div#footer a:hover {
	background: #83aa42;
	color: #fff;
	text-decoration: none;
}
div#footer {
	padding: 20px 0;						/* vertical margins create gaps */
}
div#footer ul li {
	display: inline;
	line-height: 2em;						/* in case list line-wraps */
	padding-right: 3px;
}

/* ================================================== */
/* =3-0 Page-Specific Styling (backgrounds, text, whitespace) */

/* in order appearance in nav menu */


	/* ================================================== */
	/* =3-1 Home */

body#home-page div#content{
	background: url(pic_home.jpg) 100% 25px no-repeat;
}
body#home-page div#content dl dt {
	font-size: 1.2em;
	margin-bottom: 0.6em;
}

	/* ================================================== */
	/* =3-2 Services */

body#serv-page div#content {
	padding-bottom: 100px;
}
body#serv-page div#content,
body#serv-work-page div#content, body#serv-mark-page div#content, body#serv-sale-page div#content {
	background: url(pic_services.jpg) 100% 25px no-repeat;
}

	/* ================================================== */
	/* =3-3 Team */

body#team-page div#content,
body#team-maur-page div#content, body#team-ther-page div#content, body#team-rob-page div#content {
	background: url(pic_team.jpg) 100% 25px no-repeat;
}
	
	/* ================================================== */
	/* =3-4 Portfolio */

body#port-page div#content {
	background: url(pic_portfolio.jpg) 100% 25px no-repeat;
}
body#port-page div#content ul li em {
	color: #555;
}

	/* ================================================== */
	/* =3-5 Resources */

body#reso-page div#content {
	background: url(pic_resources.jpg) 100% 25px no-repeat;
}
body#reso-page div#content div.twin-column h3, 
body#reso-page div#content div.twin-column p {
	margin-right: 20px;							/* removes default whitespace */
}

	/* ================================================== */
	/* =3-6 Contact */

body#cont-page div#content {
	background: url(pic_contact.jpg) 100% 25px no-repeat;
	padding-bottom: 150px;
}
body#cont-page div#content ul li {
	color: #555;
	list-style: none;
	margin-left: 0;
}