/* RESET  ============*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; 	border: 0; 	outline: 0; font-weight: inherit; font-style: inherit; font-family: inherit; vertical-align: baseline;}
html {font-size:100.01%;}
/* remember to define focus styles! */
:focus {outline: 0;}
body {line-height: 1em; color: black; background: white;}
ol, ul {list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
:link img {border: 0px none;}
img, a img {padding:0; margin:0; border:none; display:block;}
strong {font-weight:bold;}
em {font-style:italic;}

/* MAIN TYPOGRAPHY  ============*/

p, h1, h2, h3, ul li {font-family:Arial, Helvetica, sans-serif;}

p {
	font-size:12px;
	line-height:1.4em;
	margin:0 0 1.2em 0;
}

h1 {
	font-size:1.5em;
	line-height:1.5em;
	font-weight:normal;
	margin-top:0;
}


h2 {
	color:#5d4832;
	font-size:1.05em;
	line-height:1.05em;
	font-weight:bold;
	margin:0.8em 0;
}

/*h2 a, h2 a:visited {color:#5d4832;}*/

h2 a, h2 a:visited {color:#5d4832;}



h3 {
	font-size:0.8em;
	line-height:1.4em;
	font-weight:normal;
	color:#8b5c29;
}

h4 {
	font-size:0.8em;
	line-height:1.4em;
	font-weight:bold;
	color:#5d4832;
}

.content ul {
	font-size:12px;
	line-height:1.4em;
	margin:-0.6em 0 1.2em 0;
	padding-left:0.6em;
	list-style:square;
}

.content ul li {margin:0 0 0 0.6em;}

/*p a, p a:visited {color:#8b5c29;}*/

p a, p a:visited {color:#7f2527;}



/* MAIN TAGS AND ID'S  ============*/

body {
	/*background-color:#bcd5eb;*/ 
	background-color:#c5c3a8;
	font-family:Arial, Helvetica, sans-serif;
	margin:0;
	min-height:1200px;
	position:relative;
}

.page { /* this is the standard with area that defines the logical page. wrapped by above divs */
	background-color:white;
	width:750px; height:auto;
	margin:0 auto;
	position:relative;
}

.content {margin:0;padding:0; overflow:hidden;} /* div for the actual textual content. Overridden with specifics for each area of the page */

#top {background-color:#c5c3a8; height:230px;} /* full width wrapper for logo and nav */
h1#logo {
	position:absolute; top:0; left:0;
	width:750px; height:230px;
	background-image:url(includes/logo.jpg);
	text-indent:-9000px
}

#tease {xbackground-color:#b4aea8; position:relative;} /*full width wrapper for tease area*/
#tease .page {background:#5d4832 url(includes/teasegrad.jpg) bottom left repeat-x;}
#tease .content { width:90%; padding:12px 30px 20px;}
h2.hometease {
	height:0px; width:460px;
	background:#5d4832 url(includes/sprite.gif) no-repeat -15px -140px;		
	text-indent:-9000px;
	margin:6px 0 0 0;
}
#tease .content p {font-size:16px; color:white; margin:2px 0; padding:0 }


#main { /*full width wrapper for main content area */
	/*background-color:#bcd5eb;*/ 
	background-color:#c5c3a8;
	position:relative;
}
#main .page {
	border:0px solid #3b2F23;
	border-top-width:1px;		
}
#main .content {
	width:400px; 
	padding:0px 0px 20px 30px;
}

#sidebar {
	position:absolute; top:15px; right:25px;
	width: 250px;
	text-align:left;
}

#sidebar h3 {
	border: #b4aea8 1px solid;
	border-left-width:0px;
	border-right-width:0px;
	padding:5px 5px 5px 10px;
	margin:0px 0px 10px 0px;
	font-size:16px;
	font-weight:bold;
	color:#5d4832;
}

#sidebar p {margin:10px; font-size:10px; color:#666;}

#sidebar ul li {font-size:12px; color:#666;}

#footer .page {border:none;}
#footer .content {	
	width:400px; 
	padding:0px 0px 20px 30px;
}
#footer .content h4 {
	border:#b4aea8 1px solid; 
	border-width:1px 0 0 0; 
	padding-top:18px;
}

/* image classes  ============*/

img.bio {
	float:left;
	clear:left;
	padding:4px 8px 0 0;}

img.centered {
	margin:0 auto;
	display:block;
	clear:both;
}

img.inline {
	display:inline;
	margin-bottom:-3px;
}

img.heading {margin:20px auto 5px auto;}

img, img a {
	border:none;
	display:block;
}


/* the nav  ============*/

#nav {
	position:absolute;
	left:25px;
	top:200px;
	height:30px; width:390px;
	background:url(includes/sprite.gif) 0 -4px;
}

#nav li {margin:0; padding:0; position:absolute; top:0;}

#nav li, #nav a {height:30px; display:block; text-indent:-9000px;}

#navhome {width:64px; left:0}
#navtechniques {width:100px; left:64px}
#navservices {width:84px; left:166px;}
#navabout {width:64px; left: 250px;}
#navcontact {width:78px; left:314px;}

#navhome a:hover {background:transparent url(includes/sprite.gif) 0 -48px no-repeat;}
#navtechniques a:hover  {background:transparent url(includes/sprite.gif) -64px -48px no-repeat;}
#navservices a:hover  {background:transparent url(includes/sprite.gif) -166px -48px no-repeat;}
#navabout a:hover  {background:transparent url(includes/sprite.gif) -250px -48px no-repeat;}
#navcontact a:hover  {background:transparent url(includes/sprite.gif) -314px -48px no-repeat;}

#navhome.selected, #navhome.selected a:hover {background:transparent url(includes/sprite.gif) 0 -92px no-repeat;}
#navtechniques.selected, #navtechniques.selected a:hover {background:transparent url(includes/sprite.gif) -64px -92px no-repeat;}
#navservices.selected, #navservices.selected a:hover {background:transparent url(includes/sprite.gif) -166px -92px no-repeat;}
#navabout.selected, #navabout.selected a:hover {background:transparent url(includes/sprite.gif) -250px -92px no-repeat;}
#navcontact.selected, #navcontact.selected a:hover {background:transparent url(includes/sprite.gif) -314px -92px no-repeat;}