/* CSS schema for Hydro-dynamix
   by Tom Lwis (tom@webstarsltd.com) 
   @2006.08.21 */


/* Suggested order:
 * display
 * list-style
 * position
 * float
 * clear
 * width
 * height
 * margin
 * padding
 * border
 * background
 * color
 * font
 * text-decoration
 * text-align
 * vertical-align
 * white-space
 * other text
 * content
 *
 */

body {
 background-color: White;
 color: Black;
 font: .7em/1.5em Verdana, Arial, Helvetica, sans-serif;
 text-align: center;
}
.clearfix:after {
 content: ".";
 display: block;
 height: 0;
 clear: both;
 visibility: hidden;
}
.clearfix { display: inline-block; }
/* hide from ie/mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* end hide */
a,:link,:visited {  }
a:hover { text-decoration: underline; }
#container {
 width: 47em;
 margin: 1em auto;
 text-align: left !important;
 border: solid 1px #d0d0d0;
 background: url("images/water.jpg") top right no-repeat;
}

h2, h3, #nav ul li a, ul#whatweclean li {
 font-family: Arial, Verdana, Helvetica, sans-serif;
}

/* Headings */

h1 { padding: 0; }
h1 img {border:0 }
h2 {
 padding: .5em 0;
 color: #3a7196;
 font-size: 180%;
 line-height: 1.2em;
}
h3 {
 padding: 1em 0;
 color: #c81414;
 font-size: 120%;
}


.wrapper { padding: 1em; }
#content {
 width: 46em;
 background: #83c7d0 url("images/bg-left.jpg") top left no-repeat;
}


#nav {display:none;
 width: 16em;
 padding: 2em 0;
 float: left;
}
#nav ul {
 padding: 0;
 margin: 0;
}
#nav ul li {
 float: left;
 width: 16em;
 padding: 0;
 margin: 0;
}
#nav ul li a {
 overflow: hidden;
 display: block;
 margin: 0;
 padding: .3em 0 .3em 1.5em;
 color: White;
 font-size: 120%;
 font-weight: bold;
}
#nav ul li a:hover,
#nav ul li a:focus,
#nav ul li a.selected,
#nav ul li a.on {
 background: url("images/arrow.gif") center left no-repeat;
 text-decoration: none;
}

/* Sublinks */

.sub {
 padding: .2em 0 .4em !important;
 background-color: #79aac7 !important;
}
.sub li {
 padding: 0 !important;
 margin: 0 !important;
 width: 16em !important; 
 padding-left: 1.5em !important;
 voice-family:"\"}\"";
 voice-family:inherit;
 width: 14.5em !important;
}
html>body .sub li{ width:14.5em !important; }
.sub li a, .sub li a:hover {
 padding: 0 !important; 
 font-weight: normal !important;
 background: url("images/arrow-small.gif") center left no-repeat !important;
 padding: .1em  0 .1em .5em !important;
}
.sub li a:hover,
.sub li a.on {
 text-decoration: underline !important;
}


#non-menu {
 float: left;
 width: 48.8em;
 border-top: solid 1px #bfe2f9;
 border-bottom: solid 1px #bfe2f9;
 background: White url("images/dot.gif") top right repeat-y;
}
#article {
 width: 34em;
 float: left;
 margin-right: 1em;
 background-color: #bfe2f9;
}
#article p {
 padding: 1em 0;
 color: #3a7196;
}
#more {
 width: 13em;
 float: left;
}


#footer {display:none;
 clear: both;
 margin: 1em 0 0;
 padding: 0 1em 1em;
 border-top: solid 1px #7188c8;
 background: url("images/water.jpg") top left no-repeat;
}
#footer a { color: Black; }
#footer p { padding-top: 3em; }
#pics { padding-top: 1em; }
#pics li { float: right; }
#pics a  {
 padding: 0 1em;
 display: block;
}
#tld {
 clear: both;
 padding-top: 0px;
 color: #5391A8;width:50em;
 text-align: right; margin: auto 0;
}

#tld a { font: normal normal 11px verdana, sans-serif; color: #5391A8;text-decoration:underline; width: 47em;}
#tld a:hover { color:#000;}



ul#whatweclean li {
 padding: .2em 0;
 font-size: 110%;
 font-weight: bold;
}
ul#whatweclean li a {
 color: #255f87;
}

ul#whatweclean li a.on {
text-decoration:underline;
}



p.quote, cite { color: #3c7397; }
cite {
 margin-top: 1em;
 display: block;
}
img.floating {
 float: left;
 margin: 0 1em 1em 0;
}