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

/* BEGIN RESET STYLESHEET */
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;*/ }
/* remember to define focus styles! */
a:focus, :focus { outline: 0; }
body { line-height: 1; color: #444; 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: "" ""; }
/* END RESET STYLESHEET */

/* html, body { height: 100%; } */

body {
	font-size: 11px;
	font-family: Verdana, "Lucida Sans Unicode", "Lucida Sans", "Lucida Grande", Arial;
	color: #444;
	line-height: 15px;
	margin: 0;
	background: url(../images/page-bg.jpg) top center no-repeat;
}

a:link, a:visited {  }
a:hover {  }



h1 { font-weight: normal; font-size: 24px; margin: 0px; padding: 6px 0 10px 0; width: 100%; color: #8b3b00; }
h2, h2 a:link, h2 a:visited { font-size: 100%; font-weight: bold; color: #951609; margin: 4px 0px 0px 0px; padding: 4px 0px 2px 0px;  }
h3 { font-family: georgia; font-size: 130%; color: #444; font-weight: bold; margin: 0px 0px 2px 0px; padding: 4px 0px 0px 0px; }
h4 { color: #444; font-size: 110%; font-weight: bold; }
	h4.title { color: #fff; font-size: 110%; font-weight: bold; border-bottom: 1px solid white; }
h5 { color: #444; font-size: 100%; font-weight: bold; margin-bottom: 0px; }

img, a:link img, a:visited img { border: 0px !important; }

p { margin: 5px 0 16px 0; line-height: 160%; }

dl { margin: 5px 0 0 0; }
dl dt { font-weight: bold; font-size: 100%; }
	dl dt dd { font-size: 100%; margin: 0px 0 6px 0; line-height: 12px; }

ul { margin: 0px 0px 10px 0px; padding: 0px; }
ul li { list-style-type: disc; margin: 2px 0px 3px 30px; padding: 0px; }

ol { margin: 0px 0px 10px 0px; padding: 0px; }
ol li { list-style-type: decimal; margin: 2px 0px 3px 30px; padding: 0px; }

strong { font-weight: bold; }

em { font-style: italic; }

code { font-family: courier; font-size: 90%; display: block; background: #eee; padding: 10px; margin: 20px auto; border: 1px solid #ddd; }

hr { margin: 10px 0 14px 0; padding: 0; border: 1px solid #444; }

table td { vertical-align: top; padding: 4px 4px 4px 0; }



/*LAYOUT ================= */
#canvas { width:  840px; height: 100%; margin:  0 auto; margin-bottom: 60px; position: relative; clear: both; }
#header { width: 840px; height: 160px; position: relative; }
	#logo { width:  200px; height: 100px; background: url(../images/logo.jpg) no-repeat; position: absolute; top: 6px; left: 0; text-indent: -9999px; }
	#slogan { width: 200px; height: 30px; background: url(../images/slogan.jpg) no-repeat; position: absolute; left: 0; top: 110px; text-indent: -9999px; }
#content-container { width: 100%; height: 100%; margin: 0 auto; }
#footer { width:  840px; height: 40px; margin: 20px auto; text-align: center; font-size: 85%; clear: both; overflow: hidden; }
/*END LAYOUT ================= */


div#navigation { width: 410px; text-align: right; clear: both; overflow: hidden; position: absolute; top: 6px; right: 0px; }
	div#navigation ul { margin: 0; padding: 0; font-size: 110%; }
		div#navigation ul li { list-style-type: none; float: left; margin: 0; padding: 0; }
			div#navigation ul li a:link, div#navigation ul li a:visited { display: block; color: #444; margin: 0 0 0 20px; padding: 0 8px 2px 8px; line-height: 24px; text-decoration: none; }
			div#navigation ul li a:hover { color: white; background: #007bbd; }


div#intro-text { width: 53%; float: left; }
	div#contact-info { width: 352px; height: 169px; margin: 30px 0 0 -27px; padding: 8px 10px 0 20px; background: url(../images/contact-info-bg.png) no-repeat; }
		div#contact-info table { width: 280px; }
			div#contact-info table td { vertical-align: top; padding: 0; }
		div#contact-info span { display:  inline-block; text-indent: 10px; float: right; }

div#water-facts { width: 44%; height: auto; float: right; margin-top: -80px; }
	div#water-lady { width: 343px; height: 228px; margin: 0; background: url(../images/water-lady.jpg) no-repeat; }
	div#water-text { background: #d9d4be; padding: 8px; margin: 0; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
		div#water-text h2 { padding: 0 0 0 28px; background: transparent url(../images/tubes.png) 0 3px no-repeat; }
		div#water-text table { width: 100%; color: #951609; margin: 10px auto; }
			div#water-text table td { width: 50%; padding: 4px 0 6px 10px; }
			div#water-text table tr.even { background: #e3dfd0; border-top: 1px solid #ccc8ba; border-right: 1px solid #ece9df; border-bottom: 1px solid #ece9df; border-left: 1px solid #ccc8ba; }