@charset "utf-8";
/* CSS Document */

* {margin: 0; padding: 0; font-family:  tahoma, arial, helvetica, sans-serif;}
img, a img {border: 0; }
body {background: #cacaca url(images/page_bg.png) repeat-x; }
* html body {text-align: center; }

#header {width: 800px; height: 245px; background: url(images/header.png) center 30px no-repeat; position: relative;}
#container {width: 800px; margin: 0 auto; text-align: left; }

#serving, #contact {height: 600px; }

#main { padding-top: 20px; position: relative;}

/**********
Navigation
**********/

	#nav {position: absolute; bottom: 2px; left: 30px; }
	#nav li {display: block; float: left; margin: 0 -2px;}
	#nav li a {
		display: block; 
		float: left; 
		width: 125px;
		height: 37px;
		line-height: 37px;
		text-align: center;
		font-style: italic;	
		color: #000;		
		font-size: 14px;
		font-weight: bold;
		text-decoration: none; 	   
		background: url(images/btn_bg.png) -1px 0;
		font-family: "lucida sans unicode", "lucida grande", arial; 
		text-indent: -4px;}
		
	#nav li a:hover {background-position: -1px -37px; color: #000;}
	
	/****** Header ******/
	#logo {text-indent: -700em; overflow: hidden; display: block;}
	.hidden {display: block; text-indent: -700em; overflow: hidden; }

	#subnav {position: absolute; top: 25px; left: 130px; font-size: 18px; word-spacing: 6px; color: #004b98; }
	#subnav a {text-decoration: none; color: #004b98; }
	#subnav a:hover {color: #F00; }
	
	
/******
BOXES
******/

	.topic_box { background: url(images/box_bg.png); width: 338px; padding: 20px; height: 172px; color: #414141; float: left; margin: 0 0 20px 0;}
	.topic_box strong {}
	.topic_box p {display: inline; margin: 0 !important;}
	.topic_box p.featured {font-size: 14px; text-align: justify; width: 338px; margin: 0px !important;}
	.topic_box p.single_spaced {line-height: 18px; }
	
	.paragraph_box {width: 340px; margin-bottom: 20px; float: left; padding: 0 10px 0 20px; }
	.paragraph_box p.featured {font-size: 14px; text-align: justify; margin: 0px !important;}

	.pipes {background: url(images/pipes_btm.png) 0 100% no-repeat; padding-bottom: 40px; width: 352px; float: left; margin: 0 10px 20px 16px;}
	.pipes .inner {background: url(images/pipes_top.png) no-repeat; padding: 30px 20px 0 20px;}
	.pipes .inner p {margin: 0 10px !important; padding-bottom: 12px; }
	.pipes blockquote {margin: 0 20px; padding-bottom: 12px; font-size: 13px; font-style: italic; }
	.pipes p.testimonial_name {padding-bottom: 0px; }
	.pipes p.testimonial_name span {display: block; }
	
	#notepad {font-family: "Comic Sans MS", Script; font-size: 20px; background: url(images/notepad.png) 0 100% no-repeat; height: 132px; width: 260px; padding: 20px 20px 0px 20px;}
	#notepad u {font-family: "Comic Sans MS", Script; }

/************ 
Content Defs 
************/

	p, h1, h2, h3, h4, h5, h6 {margin-bottom: 12px;}
	
	#main p {margin-left: 20px; margin-right: 20px; }
	p.featured {font-size: 15px; line-height: 24px; text-align: justify; }
	p.sub_featured {font-size: 13px; line-height: 20px; text-align: justify;  }
	
	#contact h6 {margin-bottom: 6px; font-size: 13px;}
	
	h1 {color: #F00; font-size: 24px; margin-bottom: 8px; margin-left: 20px;}
	
	h4 {font-size: 14px; color: #ca0000; font-style: italic; }
	h5 {font-size: 13px; color: #ca0000; }
	
	ul {margin-left: 10px; }	
	#serving ul {list-style-type: none; font-size: 11px; }
	#serving ul li {margin-bottom: 0px; line-height: 13px;}
	
	p {font-size: 13px; }
	#main, #footer, #serving_foot {margin: 0 20px; }
	#main ol, #main ul {font-size: 13px; margin-left: 50px; margin-right: 50px; margin-bottom: 18px; }
	#main li {margin-bottom: 4px; }	
	#main .spread, #main .double_spread, #main .quadruple_spread { margin-bottom: 36px; }
	#main .spread li {margin-bottom: 8px; line-height: 15px; font-size: 13px;}
	#main .double_spread li {margin-bottom: 16px; }
	#main .triple_spread li {margin-bottom: 24px; }
	#main .quadruple_spread li {margin-bottom: 40px; }
	
	div#pics {width: 264px; float: right; margin-left: 10px; }
	div.pic {width: 120px; background: white; margin: 0 10px 10px 0px; border: 1px solid #ddd; float: left; }
	#pics img {width: 120px; }
	
	img.left {margin: 0 12px 12px 10px; }
	* html img.left {margin: 0px }

	.image { margin-bottom: 12px; }
	.column {margin-top: 10px; }
	.column img {display: block; width: 300px; margin-bottom: 4px;}
	.image span {font-size: 12px; display: block; text-align: center; }

	.warning {margin-top: 10px; }

	a { color: #004b98 }

/************
Contact Form
************/

	#contact_form {margin-left: 20px; }
	#contact_form div {display: block; clear: both; margin-bottom: 10px; height: 24px;}
	label {display: block; font-size: 13px; font-weight: bold; color: #646464;  float: left; width: 80px; margin-right: 20px; text-align: right;}
	input.text, textarea {display: block; width: 220px; height: 20px; border: 2px solid #cbcbcb; background: #f0f0f0; font-size: 13px;  float: left; line-height: 20px;}
	#contact_form div.textarea {height: auto; }
	#contact_form div.clear {height: 0px; margin: 0px;}
	
	textarea {height: 120px; }
	a#send_btn {display: block; background: url(images/send_btn.png); height: 24px; width: 87px; color: #fff; border: 0; line-height: 24px; font-size: 16px; font-weight: bold; text-align: center; cursor: pointer; clear: both; margin-left: 236px; margin-bottom: 12px;}
	
	
	#contact_form_div {width: 400px; float: left;}
	#contact_info {width: 340px; float: left; margin-left: 20px;  padding-top: 40px; }
	#contact_info h2 { font-size: 15px; text-align: center; text-decoration: underline; }
	#contact_info div {margin-bottom: 30px; width: 250px; }
	#contact_info a {display: block; font-size: 14px; margin: 0 0 4px 0px; }
	#contact_info address {font-style: normal; font-size: 14px; }

/******
Footer
******/

	#serving_foot, #contact_foot, #footer {text-align: center; clear: both;}
	#serving_foot p.list {font-size: 11px; }
	#serving_foot p {font-size: 14px; }
	#serving_foot h3 {font-size: 20px; color: #004b98; font-style: italic; margin-bottom: 2px; font-weight: normal;}
	
	#contact_foot p#numbers {font-weight: bold; color: #F00; font-size: 16px; font-weight: bold; margin-bottom: 2px;}
	#email_link {font-weight: bold; color: #F00; font-size: 12px; font-weight: bold; text-decoration: underline; }
	#contact_foot p {margin-bottom: 16px; }
	
	#logos {margin-bottom: 20px; }
	#logos img {margin: 0 16px; }
	
	#footer {clear: both; padding-bottom: 10px;}
	#footer p {font-size: 10px; margin-bottom: 0px;}
	#footer p img {vertical-align: -2px; margin-right: -2px; }
	* html #footer p img {margin-right: 0px; }
	#footer a {text-decoration: none; }
	#footer p.links { margin-bottom: 0px; line-height: 14px; font-size: 10px; word-spacing: 6px; color: #004b98;}
	#footer p.links a {font-size: 14px; font-weight: bold; word-spacing: normal; color: #004b98;}
	#footer p.links a:hover {text-decoration: underline; }
	
	#sftag {padding-top: 2px;font-size: 10px;}
	#sftag a {text-decoration: none; color: #900;}
	#sftag a:hover {text-decoration: underline; }

/****************
Universal Classes
****************/

	.subheading {font-weight: bold; font-size: 13px; }
	.nomar {margin-bottom: 0px !important}
	.small {font-size: 0.8em !important; }
	.center {text-align: center !important; }
	.clear {clear: both !important; }
	.block {display: block; }
	.left {float: left; }
	
	
	.blue {color: #004b98 !important; }
	.green {color: green; }
	
	.right {float: right; }
	img.right {margin: 0 10px 10px 10px; border: 1px solid #fff;}
	div.right {width: 160px;}
	div.right img {display: block; margin: 0 10px 10px 10px;  border: 1px solid #fff;}
	.window img.right { }
	
	.highlight {border: 1px solid #fff; margin: 18px 10px; padding-top: 10px; background-color: #666}
	
	.hidewindows .window {display: none; }
	.drains #drains {display: block; }
	.water #water {display: block; }
	.gas #gas {display: block; }
	.other #other {display: block; }
	
	.water .water, .drains .drains, .gas .gas, .other .other {background: #fff; color: #900 !important; }
	
	a img {border: 0; }
	.underline {text-decoration: underline;}
	.important {font-size: 110%; }
	
