/*-------------------------------------------------- */
/*  COPYRIGHT (C) 2005-2007, AUTHOR: RAYMOND WEI HE  */
/*-------------------------------------------------- */
/* -------------------------------------------- [ FRAME ] --------------------------------------------------------------- */
#framebg {
	z-index: 1;
	POSITION: relative;
	float: left;
	background: url(images/beverage.jpg) no-repeat 30px bottom;
}
/* -------------------------------------------- [ FRONT IMAGE ] --------------------------------------------------------------- */
#frontimage {
	z-index: 1;
	/*	background: url(images/glass.jpg) no-repeat 0px 68px; */
	margin: 0px; 
	float: left;
	width: 100%;
	height: 300px;
}
/* -------------------------------------------- [ FIELDS ] --------------------------------------------------------------- */
#fields {
	z-index: 2;
	background: url(images/drinkwater3.jpg) no-repeat bottom center;
	float: left;
	width: 100%;
	height: 200px;
	margin: 10px 0px 0px 0px; /* top right bottom left */
}
#field {
	filter:alpha(opacity=80); /* ie's opacity */
	opacity: 0.75;
	-moz-opacity:0.75;
	background: #fff;
	font-weight: bold;
	border-left: #40ffff 1px solid;
	border-right: #40ffff 1px solid;
	font-size:10pt;
	width: 24%;
	float: left;
	font-size: 9pt;
	color: #ffff00;
	margin: 0px 10px 0px 0px; /* top right bottom left */
}
#field ul {
	margin: 0px; 
	padding-left: 0px; 
	padding-right: 0px; 
	padding-top: 0px; 
	padding-bottom: 0px; 
}
#field ul li.title {
	background: #0066cc;
	border-bottom: #84c1ff 4px solid;
	padding-left: 10px; 
	padding-right: 10px; 
	padding-top: 2px; 
	padding-bottom: 2px; 
	list-style-type: none; 
}
#field ul li.content {
	padding-left: 0px; 
	padding-right: 10px; 
	padding-top: 4px; 
	padding-bottom: 4px; 
	margin: 0px 0px 0px 30px; /* top right bottom left */
}
#field ul li.more {
	padding-left: 10px; 
	padding-right: 10px; 
	padding-top: 0px; 
	padding-bottom: 4px; 
	border-bottom: #84c1ff 4px solid;
	list-style-type: none; 
	text-align: right;
}
.content#field a, .more#field a {
	color: #003aea;
}
#field a:hover {
	color: #ff6600;
}
/* -------------------------------------------- [ MAP ] --------------------------------------------------------------- */
#map { 
	z-index:10;
	padding-top: 0px;
	padding-bottom: 5px;
	height: 25px;
	font-family: verdana;
	margin: 0px 0px 0px 19px; /* top right bottom left */
	float: left;
	position: absolute;
	top: 85px;
	left: 18%;
}
#map a { 
	font-size: 9pt;
	color: #00ccff; 
}
#map a:hover { 
	color: #ff6600; 
	text-decoration:underline;
}
/* -------------------------------------------- [ CONTENT ] --------------------------------------------------------------- */
#frame h1 {
	background: #ffffff;
	height: 25px;
	font-size: 11pt;
	font-weight: bold;
	color: #ff6600;
	margin: 25px 0px 0px 0px; /* top right bottom left */
	float: left;
}
#content ul, #contentwhite ul, #contentsolid ul {
	list-style-image: url('images/bullet.gif'); 
}
#contentframe {
	z-index: 10;
	padding-left: 0px; 
	padding-right: 0px; 
	padding-top: 0px;
	padding-bottom: 0px;
	float: left;
	width: 64%;
	font-family: verdana;
	position: relative;
	left: 15px;
	top: 0px;
	margin: 80px 0px 0px 0px; /* top right bottom left */
}
#contentframewide {
	z-index: 10;
	padding-left: 0px; 
	padding-right: 0px; 
	padding-top: 0px;
	padding-bottom: 0px;
	float: left;
	width: 80%;
	font-family: verdana;
	position: relative;
	left: 15px;
	top: 0px;
	margin: 80px 0px 0px 0px; /* top right bottom left */
}
#content {
	filter:alpha(opacity=85); /* ie's opacity */
	opacity: 0.80;
	-moz-opacity:0.80;
	background: #ffffff;
	float: left;
	border: 1px solid #99ccff;
	padding-left: 15px; 
	padding-right: 15px; 
	padding-top: 5px;
	padding-bottom: 10px;
	margin: 15px 0px 0px 0px; /* top right bottom left */
	font-size: 10pt;
	color: #000000;
	font-family: verdana;
}
#contentsolid {
	z-index: 1;
	float: left;
	border: 1px solid #b9dcff;
	padding-left: 15px; 
	padding-right: 15px; 
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 15px 0px 0px 0px; /* top right bottom left */
	font-size: 10pt;
	color: #202020;
	font-family: verdana;
}
#contentwhite, .contentwhite {
	z-index: 1;
	float: left;
	background: #ffffff;
	border: 1px solid #b9dcff;
	padding-left: 15px; 
	padding-right: 15px; 
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 15px 0px 0px 0px; /* top right bottom left */
	font-size: 10pt;
	color: #202020;
	font-family: verdana;
}
#contenttable { 
	z-index: 5;
	filter:alpha(opacity=95); /* ie's opacity */
	opacity: 0.90;
	-moz-opacity:0.90;
	float: left;
	background: #ffffff;
	font-family: verdana;
}
#contentsolid td, #contentwhite td, #content td	{ 
	font-size: 10pt;
	font-family: verdana;
}
#content a, #contentsolid a, #contentwhite a, .contentwhite a, #contenttable a, #content li a { 
	text-decoration: none;
	color: #0066ff; 
}
#content a:hover, #contentsolid a:hover, #contentwhite a:hover, .contentwhite a:hover, #contenttable a:hover { 
	color: #FF6600;
	text-decoration:underline;
}
#contentsolid h1, #contentwhite h1, #content h1, .contentwhite h1 { font-family: arial; font-size: 18pt; color: #006600; font-weight: bold; }
#contentsolid h2, #contentwhite h2, #content h2, .contentwhite h2 { font-family: arial; font-size: 13pt; color: #009933; font-weight: bold; }
#contentsolid h3, #contentwhite h3, #content h3, .contentwhite h3 { font-family: arial; font-size: 11pt; color: #0099CC; font-weight: bold; }
#contentsolid h4, #contentwhite h4, #content h4, .contentwhite h4 { font-family: arial; font-size: 10pt; color: #FF6600; }
.products {
	border-bottom: #c0c0c0 1px solid;
	height: 98px;
}
/* -------------------------------------------- [ SIDEFIELD ] --------------------------------------------------------------- */
#sidefield {
	z-index: 10;
	padding-left: 0px; 
	padding-right: 0px; 
	padding-top: 0px;
	padding-bottom: 0px;
	float: left;
	width: 12%;
	font-family: verdana;
	position: relative;
	left: 25px;
	top: 0px;
	margin: 138px 0px 0px 0px; /* top right bottom left */
	font-size: 7pt; 
}
#howtodiff {
	background: #ffffff url(images/aquafinadasanismall.gif) no-repeat right top;
	border: 1px solid #99ccff;
	float: top;
	height: 65px;
	font-family: verdana;
}
#howtodiff ul {
	margin: 0px; 
	padding-left: 5px; 
	padding-right: 5px; 
	padding-top: 3px; 
	padding-bottom: 5px; 
	list-style-type: none; 
}
#howtodiff li a {
	color: #003aea;
	background: #ffffff;
}
#howtodiff li a:hover {
	color: #ff6600;
	background: #ffffff;
	text-decoration:underline;
}
#usage {
	z-index: 10;
	filter:alpha(opacity=75); /* ie's opacity */
	opacity: 0.80;
	-moz-opacity: 0.80;
	background: #ffffff;
	border: 1px solid #99ccff;
	float: left;
	color: #ff6600;
	margin: 15px 0px 0px 0px; /* top right bottom left */
	font-family: verdana;
	position: relative;
}
#usage ul {
	margin: 0px; 
	padding-left: 0px; 
	padding-right: 0px; 
	padding-top: 0px; 
	padding-bottom: 5px; 
	list-style-type: none; 
}
#usage ul li.title {
	margin: 0x; 
	background: #ffffff;
	margin: 10px 5px 5px 5px; /* top right bottom left */
	text-align: left;
	font-weight: bold;
}
#usage ul li.image {
	background: url(images/usage.jpg) no-repeat left top;
	height: 50px;
	margin: 0px; 
	width: 100%;
}
#usage ul li.content {
	margin: 10px 5px 10px 5px; /* top right bottom left */
	text-align: left;
	color: #000000;
}
#usage li.content a {
	color: #003aea;
}
#usage li.content a:hover {
	color: #ff6600;
}
#info {
	filter:alpha(opacity=75); /* ie's opacity */
	opacity: 0.80;
	-moz-opacity: 0.80;
	background: #ffffff;
	float: top;
	height: 110px;
	border: 1px solid #99ccff;
	padding-top: 10px; 
	padding-left: 5px; 
	padding-right: 0px; 
	padding-bottom: 0px; 
	font-size: 9pt;
	margin: 20px 0px 0px 0px; /* top right bottom left */
	color: #003aea;
}
#info li {
	margin: 0px 0px 0px -15px; /* top right bottom left */
}
#info li a {
	color: #003aea;
}
#info li a:hover {
	color: #ff6600;
}
