html, body{
	margin:0px;
	padding:0px;
}

body{
	background:#96b5be url("images/main_bg.jpg") repeat-y;
	background-position:center;
	font-family: Verdana, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 87.5%;
	color: #000000;
	text-align: center;
}

.container{
	position:relative;
	width:45em;
	left:-4.15em;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	font-size:1em;

}

/* Top section of all pages with header and menubar */	
.top{
	position:absolute;
	margin:0px;
	width:760px;
	height:260px;
}
	
.header{
	position:absolute;
	background: url("images/ecoheader2.jpg") no-repeat;
	float:left;
	width:760px;
	height:200px;
	z-index:1;
		
}
	
.menubar{
	position:absolute;
	background: url("images/menu_bar2.jpg") no-repeat;
	float:left;
	left:7px;
	width:745px;
	height:50px;
	top:160px;
	z-index:2;
}
/* End of top section */

	
.middle, .footer{
	position:absolute;
	float:left;
	width:760px;
	height:420px;
	display:inline;
}

/* The footer on all pages */	
.footer{
	clear:both;
	top:55em;
	color:black;
	height:50px;
	width:760px;
		
}

/* Middle section for main page */	
.l_mid_top{
	position:absolute;
	background: url("images/BearGetsADrink_small.jpg") no-repeat;
	float:left;
	width:280px;
	height:200px;
	left:37px;
	top:220px;
}

.l_mid_bottom{
	position:absolute;
	float:left;
	width:285px;
	height:100px;
	left:40px;
	top:436px;
}

.mid_right{
	position:absolute;
	float:left;
	width: 350px;
	height:315px;
	top:205px;
	left:370px;
	text-align:left;
}
/* End of middle section on main page */

/* Bottom section on Main page with pictures*/
.mid_bottom{
	position:absolute;
	float:left;
	width:740px;
	height:171px;
	top:540px;
	left:20px;
}

.mid_bottom_l{
	position:absolute;
	float:left;
	width:94px;
	height:140px;
	top: 15px;
	left:45px;
}

.mid_bottom a img, .middle a img{
	border:none;
}


.mid_bottom p{
	position:absolute;
	width:100px;
	height:140px;
	top:0px;
	left:105px;
	font-size:10pt;
	text-align:left;
}

.mid_bottom_c{
	position:absolute;
	width:94px;
	height:140px;
	top:15px;
	left:275px;
}

.mid_bottom_r{
	position:absolute;
	width:94px;
	height:140px;
	top:15px;
	left:490px;
}

/* end of bottom section for main page */

/* 1 column, 3 rows for Services page */
.top_serv, .middle_serv, .bottom_serv{
	position:absolute;
	left:10px;
	height:150px;
	width:750px;
}

.top_serv{top:210px}
.middle_serv{top:360px}
.bottom_serv{top:510px}

.r_serv{
	position:absolute;
	float:right;
	right:20px;
}

.l_serv{
	position:absolute;
	float:left;
	left:20px;
}

.r_serv_text{
	position:absolute;
	float:right;
	text-align:right;
	right:180px;
	width:335px;
	
}

.serv_text{
	position:absolute;
	float:left;
	text-align:left;
	left:180px;
	width:335px;
}
/* end of services page */

/* espresso page */
.espresso_table{
	position:absolute;
	left:5px;
	top:260px;
}

.espresso_table th{
	color:#3d1d00;
}

.espresso_bottom{
	position:absolute;
	left:50px;
	top:630px;
	width:680px;
}

.espresso_top{
	position:absolute;
	left:50px;
	top:220px;
	width:680px;
}

.l_col{
	background-color:#b37237;
	padding:0px 10px 0px 0px;
	color:#703601;
}

.m_col{
	background-color:#a34f01;
	padding:0px 5px 0px 0px;
	color:#3d1d00;
}

.r_col{
	background-color:#703601;
	color:#b37237;
}
/* End of espresso page*/

/* This one is for the about us and products pages */
.left_2col,.l_prod{
	position:absolute;
	float:left;
	left:10px;
	top:210px;
	width:355px;
	height:425px;
	border-color:#0060f0;
	padding:0px 5px 0px 5px;
	/*border-style:groove;*/
	display:inline;
}


/* This one is for the FAQ page */
.left_pic{
	position:absolute;
	float:left;
	background: url("images/waterfall.jpg") no-repeat;
	left:20px;
	top:210px;
	width:320px;
	height:420px;
	display:inline;
}

/*about page, products page*/
.about_list,.res_benefits,.res_benefits li,.res_financial,.res_financial li,.biz_benefits, .biz_benefits li,.biz_blurb{ 
	text-align:left;
}

.faq_list{ /* FAQ page */
	text-align:left;
	font-size:12pt;
	
}

span{ /*Headlines Main and FAQ*/
	color:#105672;
	font-family:"georgia", serif;;
}

/* Used on FAQ page */
.right_2col{
	position:absolute;
	left:320px;
	top:210px;
	width:400px;
	height:420px;
	border-color:#0060f0;
	/*border-style:groove;*/
	padding:0px 10px 0px 5px;
	overflow-y:scroll;
	display:inline;
}

.faq_list li{
	margin-bottom:1em;
}

/* on the About us page */
.about_right,.r_prod{
	position:absolute;
	left:395px;
	top:210px;
	width:335px;
	height:425px;
	border-color:#0060f0;
	/*border-style:groove;*/
	padding: 0px 5px 0px 5px;
	display:inline;
}


.l_prod a, .r_prod a{
	position:relative;
	left:7em;
}

.application input, .application select, .application textarea{
	border:1px solid #666;
}

.application input:focus, .application select:focus, .application textarea:focus{
	border:2px solid #0060f0;
}

/*  for the forms  */
.application{
	position:absolute;
	float:left;
	top:50px;
	left:15px;
	font-size:12px;
	background-color: #96b5be;
	border: medium double #0060f0;
	width:280px;
	padding:5px 5px 0px 5px;
}

.application textarea {
	padding:5px 5px 0px 5px;
}
.application #subbutton{
	position:relative;
	left:8em;
	margin-bottom:5px;
}
/* The residential page */
.res_wholehouse_title{
	position:absolute;
	left:315px;
	top:200px;
}

.res_drink_link{
	position:absolute;
	left:260px;
	top:217px;
	z-index:1;
}

.drink_systems{
	position:absolute;
	left:15px;
	height:50px;
	width:450px;
	top:30px;
	text-align:left;
}

.res_row1,.res_row2,.res_row3,.res_row4,.res_row5,.res_row6{
	position:absolute;
	left:10px;
	height:150px;
	width:745px;
}
.res_row1{top:240px;}
	.row1_right{
		float:right;
		right:20px;
		height:100px;
		width:300px;
		padding:5px;
		text-align:left;
		color:white;
		background-color:#7f8787;
	}

	.row1_left{
		float:left;
		text-align:left;
		width:420px;
		height:150px;
	}
	
.res_row2{top:390px;}
.res_row3{top:690px;}
.res_row4{top:900px;}
.res_row5{top:1050px;}
.res_row6{top:1500px;}
	.row2_left,.row3_left,.row4_left,.row5_left,.row6_left{
		position:absolute;
		float:left;
		text-align:left;
		width:150px;
		height:100px;
		left:25px;
		top:50px;
	}
	
	.row2_right,.row3_right,.row4_right,.row5_right,.row6_right{
		position:absolute;
		float:left;
		text-align:left;
		width:500px;
		height:300px;
		left:170px;
	}
	
	.row4_left{
		top:150px;
		z-index:1;
	}




/*  for current page marker on nav menu  */
.current{
	color:black;
	font-size:1.25em;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
}

/*  for the navigation menu  */
.nav_bar{
	top:25px;
	padding:0;
	margin:0;
	text-align:center;
	list-style-type:none;
}


.navitem{
	margin-left: 20px;
	padding: 60px 10px;
	display:inline;
}

.topnav_link{
	color:white;
	font-size:1.35em;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
}

.bottomnav_link{
	color:#0060f0;
	font-size:10pt;
	font-weight:bold;
	text-align:center;
}

.inline_link{
	color:#0060f0;
	font-family:"georgia", serif;
	text-decoration:none;
}

.inline_link:hover{
	color:#7f8787;
	font-size:1em;
}

.bottomnav_link:hover{
	color:#7f8787;
}

a:hover{
	color:#9cf6f8;
}

a:active{
	background-color:#e0e0e0;
}



