/* CSS Document */

body {
background-image:url(images/bg.gif);
margin:0;
padding:0;
text-align:center;
font:11px sans-serif;
color:#000000
	}
	
.header {
float:left;
left:0; 
top:0; 
text-align:left; 
width:100%;
background-image:url(images/bg-header.gif);
}



.home-link {
	height:20px; font-size:12px; margin:-18px 0 0 740px; color:#efefef
	}



a:link, a:visited {
	color: green; text-decoration: underline;
	font-weight:bold;
}

a:hover {
	color: green;	text-decoration: underline;
	font-weight:bold
}



.required-fields {
	color:#FF0000;
	font-size:10px;
	text-align:left;
	}
	
.form {
	background-color:#fff;
	width:570px;
	padding:15px;
	text-align:left;
	}

.form-intro {
	color:#000;
	font-size:10px;
	text-align:left;
	}
.cssform p{
position:relative;
width: 250px;
clear: left;
margin-left: 20px;

font-size:14px;
font-weight:bolder;
color:#000000;
text-align:left;
padding: 5px 0 8px 0;
padding-left: 155px; /*width of left column containing the label elements*/
border-top: 1px dashed gray;
height: 75%;
}

.cssform label{
font-weight: bold;
float: left;
margin-left: -155px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
}

.cssform textarea{
width: 250px;
height: 60px;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

td {
padding:5px;
}

h1 {
float:left; margin-top:25px; text-align:left; width:475px; font-size:24px; font-weight:bolder; color:#076318
}

h3 {margin:0; text-align:left; width:100%; font-size:16px; font-weight:bolder; color:#076318
}

.content {
float:left; width: 100%; text-align:left; left:0; top:0; background-image:url(images/bg-body.gif)
}

.left-column {
float: left; width:178px; margin:20px 25px 20px 0;
}

.50th-anniversary{
width:75px; margin-top:25px; float:left;
}

.index-body {
float:left; width:600px; margin:0; padding: 0 20px;  font-size:12px; text-align:left; line-height:18px;
	}
	
.guts {
float:left; padding:0px 10px; width:643px; margin-top:0px; border:solid 1px #CCCCCC; border-bottom:none; border-top:none; background-color:#FFFFFF
}

.index-graphic1 {
float:left; width:600px; margin-top:20px;
}

.index-graphic2 {
float:left; width:732px; margin-top:50px;
}

.benefits {
float:left; width:550px; margin:7px 10px;  font-size:12px; border:solid 1px #C1EAB0;  text-align:left; line-height:16px;
	}
	
.benefits-rows {
float: left; margin: 0;  width:550px; background-color:#C1EAB0; padding: 7px
}

.menu {
	margin: 0;
	padding: 0;
	width: 187px;
	list-style: none;
	background:#dbdbdb
}
.menu li {
	padding: 0;
	margin: 0;
	height: 59px;
	list-style: none;
	background-repeat: no-repeat;
	border-bottom:solid 1px #d6d6d6;4
	
}
.menu li a, .menu li a:visited {
	display: block;
	text-decoration: none;
	text-indent: -1000px;
	height: 59px;
	background-repeat: no-repeat;
}
.about {background-image: url(images/about2-down.gif);}
.about a {background-image: url(images/about2-up.gif);}

.purchase-online {background-image: url(images/purchase-on.gif);}
.purchase-online a {background-image:url(images/purchase-off.gif);}

.air-booster {background-image: url(images/robinhood-booster2-down.gif);}
.air-booster a {background-image:url(images/robinhood-booster2-up.gif);}

.ul-certified {background-image:url(images/ul-certified2-down.gif);}
.ul-certified a {background-image:url(images/ul-certified2-up.gif);}

.smart-booster {background-image:url(images/smart-booster2-down.gif);}
.smart-booster a {background-image:url(images/smart-booster2-up.gif);}

.filter-packs {background-image: url(images/TonerCleaning-down.gif);}
.filter-packs a {background-image: url(images/TonerCleaning-up.gif);}

.fiber-filter {background-image:url(images/natural-fiber2-down.gif);}
.fiber-filter a {background-image: url(images/natural-fiber2-up.gif);}

.fxstudio {background-image:url(images/SpecialEffects-down.gif);}
.fxstudio a {background-image: url(images/SpecialEffects-up.gif);}

.poly-last {background-image: url(images/poly-last2-down.gif);}
.poly-last a {background-image:url(images/poly-last2-up.gif);}

.window-unit {background-image: url(images/window-unit2-down.gif);}
.window-unit a {background-image:url(images/window-unit2-up.gif);}

.contact {background-image:url(images/contact-down2.gif);}
.contact a {background-image:url(images/contact-up2.gif);}

ul.menu li a:hover {background: none;}

.footer {
float:left; width:100%; background-color:#000000; color:#FFFFFF;
}

/*Start Animated Menu*/
.animatedtabs{
overflow: hidden;
float:left;
width: 600px;
font-size: 14px; /*font of menu text*/
}


.animatedtabs ul{
list-style-type: none;
margin: 0;
margin-left: 10px; /*offset of first tab relative to page left edge*/
padding: 0;
}

.animatedtabs li{
float: left;
margin: 0;
padding: 0;
}

.animatedtabs a{
float: left;
position: relative;
top: 5px; /* 1) Number of pixels to protrude up for selected tab. Should equal (3) MINUS (2) below */
background: url(images/tab-blue-left.gif) no-repeat left top;
margin: 0;
margin-right: 3px; /*Spacing between each tab*/
padding: 0 0 0 9px;
text-decoration: none;

}

.animatedtabs a span{
float: left;
position: relative;
display: block;
background: url(images/tab-blue-right.gif) no-repeat right top;
padding: 5px 14px 3px 5px; /* 2) Padding within each tab. The 3rd value, or 3px, should equal (1) MINUS (3) */
font-weight: bold;
color: #265d63;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
.animatedtabs a span {float:none;}
/* End IE5-Mac hack */


.animatedtabs .selected a{
background-position: 0 -125px;
top: 0;
}

.animatedtabs .selected a span{
background-position: 100% -125px;
color: #1b7882;
padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
top: 0;
}

.animatedtabs a:hover{
background-position: 0% -125px;
top: 0;
}

.animatedtabs a:hover span{
background-position: 100% -125px;
padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
top: 0;
}
/*End Animated Menu*/






<!--[if IE 6]>
.guts {
float:left; padding:0px 10px; width:600px; margin-top:0px; border:solid 1px #CCCCCC; border-bottom:none; border-top:none; background-color:#FFFFFF
}
<![endif]-->

