

/* Layout Stylesheet */ 
body{
 margin: 0;
 padding:0; 
 color: #333333;
 border-right: black 1px solid;
 }	 

/* Hides from IE-mac \*/
* html .floatholder {height: 1%;}
/* End hide from IE-mac */


	 
#lh-col{
 position:absolute;
 top:128px;
 left:0;
 width:138px;
 z-index:3;
 background:#E8FFE8;
 color: #333333;}

 #lh-colend{
width: 130px;
height: 150px;
font-family: Arial,'sans serif';
FONT-SIZE: 7PT;
text-align: center;
FONT-WEIGHT: normal;
color: #666666;
padding: 0;
margin: 0;
line-height: 8pt;
background: #E8FFE8
 }

#rh-col{
 position:absolute;
 top:128px;
 right:6px;
 width:130px;
 z-index:2;
 background:#E8FFE8;
 color: #333333;
 }

#c-block {
 width:100%;
 z-index:1;
 background:#E8FFE8;
 color: #333333;
 height:80%;
 margin: 0px;
 }

#c-col{
 margin:0 140px 0 138px;
 background:#ffffff;
 color: #333333;
 z-index:2;
 border: solid black;
 border-width:0px;
 height: 1%;
 }

#hdr{
PADDING-RIGHT: 0px;
	PADDING-LEFT: 75px;
	PADDING-BOTTOM: 15px;
	PADDING-TOP: 23px;
	MARGIN: 0px;
	BORDER-BOTTOM: black 1px solid;
	POSITION: static;
	background-image: url('images/water6b.jpg');
	background-repeat: no-repeat;
	background-position: left;
	font: 12pt Lucida, Helvetica, 'sans serif';
	text-shadow: bold;
	text-align: left;
	font-weight: bold;
	color:#003300;
  }

#hdr1 {
	position: absolute;
	top: 1px;
	right: 1px;
	height: 75px;
	width: 150px;
	background-image: url('images/logo2.jpg');
	background-repeat: no-repeat;
}
#hdrbtn {
	position: absolute;
	top: 1px;
	right: 155px;
	height: 75px;
	width: 150px;
	background-repeat: no-repeat;
}
#hdr2a{
 height:20px; 
 border-bottom:1px solid #000000; 
 width:100%; 
 background:#eeeeee;
 color: #666666; 
 margin:0;
  }

#hdr2 {
	PADDING-TOP: 0px;
	PADDING-RIGHT: 0px;
	PADDING-LEFT: 0px;
	PADDING-BOTTOM: 0px;
	BACKGROUND: #eee;
	MARGIN-right: 0px;
	background-image: url('images/topbar2.gif');
	font: 8pt Lucida, Helvetica, 'sans serif';
	font-weight: normal;
	text-align: right;
	height: 11pt;
}
a:hover {color: #336633; text-decoration: none;}
a:active {color: #666666; text-decoration: none;}
a:link {color: #336633; text-decoration: none;}
a:visited {color: #336633; text-decoration: none;}

#hdr2L{
float: left;
padding-left: 20px;
}

#hdr2R{
padding-right: 20px;
}

#hdr3a{
 height:40px; 
 border-bottom:1px solid #000000; 
 width:100%; 
 background:#eeeeee;
 color: #666666; 
 margin:0;
  }

#hdr3 {
	position: relative;
	top: 95px;
	PADDING-RIGHT: 0px;
	PADDING-LEFT: 0px;
	BACKGROUND: #eee;
	PADDING-BOTTOM: 0px;
	MARGIN-RIGHT: 0px;
	PADDING-TOP: 0px;
	BORDER-BOTTOM: black 1px solid;
	background-image: url('images/topbgleft.png');
	font: 10pt Arial, Helvetica, 'sans serif';
	width: 138px;
	height: 12pt
}


#hdr4 {
	PADDING-RIGHT: 0px;
	PADDING-LEFT: 0px;
	BACKGROUND: #eee;
	PADDING-BOTTOM: 0px;
	MARGIN-LEFT: 0px;
	PADDING-TOP: 0px;
	BORDER-BOTTOM: black 1px solid;
	POSITION: static;
	height: 12pt;
	background-image: url('images/topbg3.jpg');
	BORDER-RIGHT: BLACK 1PX SOLID;
	font: 10pt Arial, Helvetica, 'sans serif';
	color: white;
	font-weight: normal;
}





#ftr {
 width:100%;
 border: solid #000000; 
 border-width:1px 0;
 background:#eeeeee;
 margin:0;
font-family: Arial,Helvetica,sans-serif;
 font-size: 8pt;
 font-weight: normal;
 text-align: center;
 color: #003300;
 padding-left: 0px;
 }

#navbartop{background: #ADFFC1;
width: 134px; 
margin-left: 0px;
margin-top:45px;
margin-right: 0px;
Padding-Top: 3px;
padding-bottom: 3px;
PADDING-LEFT: 0px;
padding-right: 3pt;
font-family: arial;
font-size: 11px;
font-weight: bold;
text-align: right;
color: #666666;
border-top: black 1px solid;
}


div#adbar{float: left; width: 130px; margin-left: 0px; margin-right: 0px;
border: black 1px solid;

 }

#adbarhead{width: 130px;
margin-left: 0px;
margin-right: 0px;
padding-top: 3px;
padding-bottom: 3px;
border-bottom: black 1px solid;
background: green; background-image: url('images/topbar.gif');
font-family: arial; font-size: 11px; color: #006633; font-weight: bold; text-align: center;
}
#adbartext{width: 120px;
margin-left: 0px;
margin-right: 0px;
padding-top: 5px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 5px;
font-family: arial;
font-size: 9px;
background: #F0F0F0;
  }
  .adbartext{width: 120px;
margin-left: 0px;
margin-right: 0px;
padding-top: 5px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 5px;
font-family: arial;
font-size: 11px;
background: #F0F0F0;
  }
b{font-weight: bold; color: #006633; font-size: 8pt}

 #adbarimage1{width: 130px; height: 170px; margin-left: 0px; margin-right: 0px;
border-top: black 1px solid;
background-image: url('images/municipal2.jpg');
  }

 #adbarimage2{width: 130px; height: 170px; margin-left: 0px; margin-right: 0px;
border-top: black 1px solid;
background-image: url('images/slant1.jpg');
  }


#adbarbreak{
width: 130px;
margin-left: 0px;
margin-right: 0px;
border-top: black 1px solid;
background: #F0F0F0;
border-bottom: black 1px solid;
}

hr{
border: none;
background-color: #ADD8E6;
color: #ADD8E6;
height: 1px;
width: 80%;
}

#adbarfooter{
color: #666666 !important;
width: 130px;
height: 150px;
font-family: Arial, Helvetica, 'sans serif';
FONT-SIZE: 7PT;
text-align: center;
FONT-WEIGHT: normal;
color: #666666;
padding: 0;
margin: 0;
line-height: 8pt;
background: #F0F0F0;
}
#adbarfooter A:hover {color: #666666; text-decoration: none}
#adbarfooter A:active {color: #666666; text-decoration: none}
#adbarfooter A:link {color: #336633; text-decoration: none}
#adbarfooter A:visited {color: 336633;}

#adbartext A:link {color: #006600; text-decoration: none; font-weight: normal}
#adbartext A:hover {color: #006633; text-decoration: none; font-weight: bold}
#adbartext A:visited {color: #006633; text-decoration: none; font-weight: normal}
#adbarfooter.f {font-weight: bold}

#picbar {
float: left;
width: 140px;
padding:0px;
margin-left: 10px;
margin-right: 10px;
}

#pic1 {
width: 70px;
height: 100px;
border: black 1px solid;
padding-top:0px;
margin-left: 20px;
margin-top: 15px;
background-image: url('images/porouspaving.gif');
}

#pic2 {
width: 70px;
height: 100px;
border: black 1px solid;
padding-top:0px;
margin-left: 20px;
margin-top: 55px;
background-image: url('images/stormwater.gif');
}

#pic3 {
width: 70px;
height: 100px;
border: black 1px solid;
padding-top:0px;
margin-left: 20px;
margin-top: 25px;
background-image: url('images/RWHarvesting.jpg');
}

#pic4 {
width: 70px;
height: 100px;
border: black 1px solid;
padding-top:0px;
margin-left: 20px;
margin-top: 25px;
margin-bottom: 25px;
background-image: url('images/Smartsponge.gif');
}

.clearer{
clear: both;
}

.FloatRight { float: right;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 10px;
border: 1px solid #000;
padding: 0px;
clear: right;
}

.FloatLeft { float: left;
margin-top: 0;
margin-right: 10px;
margin-bottom: 15px;
margin-left: 0;
border: 1px solid #000;
padding: 0px;
clear: both
}
 .Clearboth{
 clear: both;
 }

 #m {
height: 1%;
padding-top:0px;
margin-left: 0px;
margin-top: 0px;
margin-bottom: 0px;
clear: left;
}

 #n{
height: 1%;
padding-top:0px;
margin-left: 83px;
margin-top: 0px;
margin-bottom: 0px;
}

#design{
margin-left: 3px;
font-family: Arial, Helvetica, 'sans serif';
font-size: 8pt;
padding-right: 5px;
}

.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px #006633;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #E8FFE8;
padding: 5px;
left: -1000px;
border: 1px solid #006633;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: 230px; /*position where enlarged image should offset horizontally */
top: -150px;
z-index: 50;
}

#visit_shop {
	float:left;
	margin-left:4px;
	margin-top:1px;
	height:50px;
}
#contact {
	float:left;
	margin-left:1px;
	margin-top:1px;
}
.input_contact {
	color: #003300;
    font-family: arial;
    font-size: 12px;
    font-weight: normal;
	
}

