/*	Utah Water Systems
	Jan. 09  
	Jon Cazier
	jon at 3nhanced dot com                              																							 
-----------------------------------------------------------------------------------------------*/

/* TABLE OF CONTENTS

	1.0 Reset Reloaded
	2.0	General Styles
	3.0	General Layout
		3.1 #wrapper
		3.2	#logo
		3.3 #main-nav 
		3.4 #featured-content
		3.5 #main-content
		3.6 #lists
		3.7 #suggested
		3.8 #footer
	4.0	Blog Specific
                                  																							 
-----------------------------------------------------------------------------------------------*/
/*	1.0 RESET RELOADED http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded                                																							 
-----------------------------------------------------------------------------------------------*/

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-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
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: "" "";
}
/*	2.0 GENERAL STYLES                                																							 

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



body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 1.7em;
	color: #666
}
.hidden {
	display: none;
}
a.btn {
	display: block;
	width: 100px;
	height: 27px;
	text-align: center;
	line-height: 27px;
	font-weight: bold;
	color: #FFF;
	text-decoration: none;
	background: transparent url(images/button.png) no-repeat top;
}
a.btn:hover {
	background-position: bottom;
	color: #FFF;
}
h2 {
	color: #277aa3;
	font-size: 2.3em;
	line-height: 1em;
}
h3 {
	color: #e28431;
	font-size: 1.6em;
	line-height: 1em;
}
p {
	margin-bottom: 20px;
}

a {color: #389FC0;}
a:hover {color: #E28431;}

#main-content ul, #main-content ol {margin: 15px 10px;}
#main-content ul h3, #main-content ol h3, #main-content ul h3 a, #main-content ol h3 a {color: #E28431;}

.clear {clear: both; height: 0px; font-size: 0px; line-height: 0px;}

/*	3.0 GENERAL LAYOUT                                																							 
-----------------------------------------------------------------------------------------------*/



/*	3.1 Wrapper  ----------------*/



.home #wrapper {
	background: #FFF url(images/bg-home.gif) repeat-x top;
}
.secondary #wrapper {
	background: #FFF url(images/bg-secondary.gif) repeat-x top;
}
/*	3.2 Logo  ----------------*/

#header {height: 110px;}

	#header, #main-nav, #featured-content, #main-content {
		width: 960px;
		margin: auto;}
		
	#logo {
		height: 110px;
		width: 342px;
		margin: auto;
		float: left;}
		
	#sub-nav {height: 35px; padding-top: 75px; width: 600px; float: right;}
	
		#sub-nav a {text-decoration: none; color: #2B6A9B; font-weight: bold; margin: 0 10px; line-height: 26px;}
			#sub-nav a {line-height: 26px; padding: 6px 0 6px 0;} 
			#sub-nav a span {line-height: 26px; padding: 6px 10px;}
			#sub-nav a:hover, #sub-nav a.active {background: transparent url(images/btnBg-right.png) no-repeat right;}
			#sub-nav a:hover span, #sub-nav a.active span {background: transparent url(images/btnBg-left.png) no-repeat left;}

/*	3.3 Main-nav  ----------------*/

	

#main-nav {
	height: 60px;
	margin: auto;
	padding-bottom: 10px;
}
.home #main-nav {
	background: transparent url(images/featured-main-top.png) no-repeat bottom right;
}
#main-nav ul li, #main-nav ul li a {
	float: left;
	color: #FFF;
	line-height: 60px;
}
#main-nav ul li a {
	font-size: 1.6em;
	text-decoration: none;
	padding: 0 25px;
	background: transparent url(images/nav-divider.gif) no-repeat right;
}
#main-nav ul li a:hover, #main-nav ul li a.active {
	color: #2B6A9B;
}
#main-nav ul li a.last {
	background-image: none;
}
/*	3.4 Featured-content  ----------------*/

	

#featured-content {
	height: 230px;
	background: transparent url(images/featured-main-mid.png) no-repeat right;
}

#featured-list {
	height: 218px;
	padding-top: 12px;
	border-right: solid 1px #afe6f7;
	width: 260px;
	float: left;
}
#featured-list a {
	color: #FFF;
	text-decoration: none;
	font-size: 1em;
	font-weight: bold;
	display: block;
	padding-left: 25px;
	width: 261px;
	height: 41px;
	line-height: 41px;
}
#featured-list a:hover, #featured-list a.active {
	color: #18759a;
	background: transparent url(images/featured-bg.png) no-repeat;
}
.featured-main {
	height: 200px;
	width: 580px;
	padding: 20px 50px 10px 0;
}
.featured-main h2 {
	margin-bottom: 17px;
	color: #666;
}
.featured-main img {
	float: right;
	margin: 0 0 20px 20px;
}
.featured-main a.btn {
	margin-top: 20px;
}
/*	3.5 Main-content  ----------------*/

	

	#main-content {
}
#main-content-inner {
	padding: 40px 0;
	min-height: 300px;
	height: auto !important;
	height: 300px;
}
.home #main-content-inner {
	background: transparent url(images/featured-main-btm.png) no-repeat top right;
}
#home-content {
	overflow: hidden;
	background: transparent url(images/home-content-bg.gif) repeat-y center
}
#main-content h2, #main-content h3 {
	margin-bottom: 20px;
}
#home-about {
	width: 450px;
	float: left;
	padding-right: 20px;
}
#home-why {
	width: 200px;
	float: left;
	padding: 0 20px;
}
#home-why ul li {
	padding-left: 20px;
	background: transparent url(images/droplet.gif) no-repeat left;
	line-height: 40px;
	border-bottom: solid 1px #dfe1e1;
}
#home-why ul li.last {
	border: none;
}
#home-testimonial {
	width: 210px;
	float: left;
	padding: 0 20px;
}
#home-testimonial blockquote {
	width: 159px;
	height: 132px;
	padding: 20px 25px;
	font-style: italic;
	background: transparent url(images/quote.gif) no-repeat;
}
#home-testimonial cite {
	float: right;
}
#footer {
	height: 160px;
	background: transparent url(images/footer.gif) repeat-x top;
	line-height: 3em;
}
#footer-inner {
	width: 960px;
	margin: auto;
	padding: 25px 0;
	color: #FFF;
	text-transform: uppercase;
	font-size: .8em;
}
#footer-inner a {
	color: #FFF;
	text-decoration: none;
	margin: 0 5px;
}
#footer-inner a:hover {
	text-decoration: underline;
}
#copyright {
	margin-right: 60px;
}
#footer-inner .footer-icon {
	padding-left: 20px;
	margin-right: 30px;
	margin-left: 0px;
}
#footer-inner .phone {
	background: transparent url(images/phone.gif) no-repeat left;
}
#footer-inner .fax {
	background: transparent url(images/fax.gif) no-repeat left;
}
/*	3.5 Secondary-content  ----------------*/

	

.secondary-pic, #testimonial-player {
	float: right;
	border: solid 10px #FFF;
	margin: 0 0 20px 20px;}
	
	#testimonial-player {margin-left: 40px;}

	.productPic {width: 125px; float: left; margin: 15px; text-align: center;}
	.productPic img {display: block;}
	
	.testimonial {margin-bottom: 30px;}
		.testimonialName {margin-left: 20px;}
		
.mainForm {width: 500px; background: #fafafa; border: solid 1px #EFEFEF; padding: 15px;}

	.mainForm label.formFieldQuestion {display: block; margin: 5px 0 0 0;}
	.mainForm input.inputClass, .selectClass, .mainFormError {margin: 0 0 5px 0; width: 250px; color: #666; border: solid 1px #999;}
	.mainFormError {border-color: #c40000}
	.mainForm .textareaClass {margin: 5px 0; width: 250px; padding: 5px; color: #666;}
	.mainForm input.inputBtn {margin: 5px 0 0 0;}
	.checkboxWrapper {display: block; padding-left: 10px;}