@charset "utf-8";

/*Main structure of the page*/
/*#header, #Home, #Products, #Store, #Application, #Info, #Contact, #footerLine {
	-webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    CCborderRadius: 20px;
}*/
	
	body {
		background-color: #EBF7FA;
	}

	#main{
		position: relative;
		width: 800px; 
		height: 600px;
		top: 35px;
		margin-right: auto;
		margin-left: auto;
		background-color: #FFFFFF;
		/*z-index: 1;*/
	}
	
	#siteLinks {
		position: absolute;
		left: 5%;
		bottom: 60px;
		width: 90%;
	}
	
		#header{
			position: relative;
			margin-right: auto;
			margin-left:auto;
			top:0px;
			height:230px;
			width:100%;
			background-image: url(images/head.png);
			background-repeat: no-repeat;
			/*z-index: 2;*/
		}

			#logo {
				position: absolute;
				top: 25px;
				left: 20px;
				width: 189px;
				height: 132px;
				background-image: url(images/logo.png);
				background-repeat: no-repeat;
			}		

			#emailLogin {
				position: absolute;
				top: 5px;
				right: 8px;
				width: 100%;
				height: 20px;
				text-align: right;
			}

		/*Start of Navigation*/

		#nav{
			position:absolute;
			top:126px;
			left:226px;
			width:547px;
			height: 46px;
			z-index:3;
		}

			.navTab {
				position: absolute;
				top: 0px;
				left: 0px;
				width: 87px;
				height: 46px;
				background-image: url(images/tab.png);
				background-repeat:repeat-x;
				text-align: center;
				padding-top: 10px;
				/*z-index: 10;*/
				overflow: hidden;
			}
			
			.image{
				background-image: url(images/tab.png);
				background-repeat: repeat-x;
			}

			.navTab:hover {
				background-image: url(images/tabOver.png);
			}

			#Home {
				left: 0px;
			}

			#Products {
				left: 92px;
			}

			#Store {
				left: 184px;
			}

			#Application {
				left: 276px;
			}

			#Info {
				left: 368px;
			}

			#Contact {
				left: 460px;
			}

			#dropMenu {
				position: absolute;
				left: 0px;
				top: 50px;
				width: 547px;
				background-image: url(images/drop.png);
				background-repeat: repeat-x;
				/*z-index: 10;*/
			}

				#certs {
					position: absolute;
					left: 5px;
					top: 5px;
					width: 100px;
					height: 100px;
					background-color: #B8DFE8;
					border: thin solid #1B75BC;
					font-family:Verdana, Arial, Helvetica, sans-serif;
					font-size: 10px;
					font-style: normal;
					color: #000000;
					text-align: left;
					padding-left: 8px;
					/*z-index: 15;*/
				}
	
				.dropImg {
					padding-left: 20px;
				}	

			

				.smOMRI {
					padding: 5px 5px 5px 0px;
					float: left;
				}

			
	
				#tiny {
					font-size: 10px;
				}
				
				.menuGroups {
					position: absolute;
					top: 15px;
					z-index:15;
				}
				
				.menuGroup1{
					width: 160px;
					left: 150px;
				}
				
				.menuGroup2{
					width: 160px;
					left: 340px;
				}
				/*
				.menuJug {
					position: absolute;
					top: 3px;
					z-index:15;
					text-align: center;
				}

				.bioJug{
					width: 115px;
					left: 175px;
				}*/
				
				.carbonJug{
					width: 90px;
					left: 300px;
				}
				
				.mineralJug{
					width: 115px;
					left: 400px;
				}
				
				.infoMenu {
					position: absolute;
					top: 15px;
					z-index:15;
					text-align: center;
				}
				
				.info1{
					width: 115px;
					left: 25px;
				}
				
				.info2{
					width: 115px;
					left: 160px;
				}
				
				.info3{
					width: 120px;
					left: 270px;
				}
				
				.info3a{
					width: 120px;
					left: 270px;
				} 
				
				.info4{
					width: 115px;
					left: 410px;
				}
				
				
				.menuText {
					text-decoration: none;
					font-family: Verdana, Arial, Helvetica, sans-serif;
					font-size: 12px;
					color: #333333;
				}
				
				.subDrop {
					position: absolute;
					top: 0px;
					padding-top: 3px;
					padding-left: 3px;
					padding-right: 3px;
					padding-bottom: 3px;
					left: 0px;
					width: 126px;
					text-align: center;
					background-image: url(images/subDrop.png);
					background-repeat: repeat-x;
					background-color: #FFFFFF;					
					/*z-index: 20;*/
					
				}
					.subDocs {
						background-color: #B8DFE8;
						border: thin solid #1B75BC;
					} 

						.subDocsLink {
							text-align: center;
							font-family:Verdana, Arial, Helvetica, sans-serif;
							font-size: 12px;
							color: #1874A7;
							line-height: 18px;
							text-decoration: none;
						}

						.subDocsLink:hover{
							color: #FFFFFF;
							background-color: #3CB44A;
							display:block;
							text-decoration:none;
						}
						
						.smGrayMSDS{
							font-family: Arial, Helvetica, sans-serif;
							font-size: 9px;
							color: #333333;
						}
				.infoDropLink {
					padding-left: 20px;
				}

		/*End of Navigation*/

		

		#content{
			position:absolute;
			top:190px;
			left: 1%;
			width:98%;
			/*z-index: -1;*/
		}
		
		#content2{ /*only on home page*/
			position:absolute;
			top:205px;
			left: 1%;
			width:98%;
			/*z-index: -1;*/
		}
		
		#content li{
			font-family: Verdana, Arial, Helvetica, sans-serif;
			font-size: 12px;
			list-style:disc;
			list-style-position:inside;
			padding-left: 2em;
		}

		/*Start of Divs nested in content div*/

			#rightSide{ /*not on home page*/
				position:absolute;
				top:20px;
				right: 25px;
				width:450px;
				/*z-index: -1;*/
			}
			
			#rightSide2{ /*ONLY on home page*/
				position: absolute;
				top: 0px;
				right: 10px;
				width: 312px;
				/*z-index: -1;*/
				padding: 0px 10px 0px 15px;
			}

			#leftSide{
				position:absolute;
				top:0px;
				left: 0px;
				width: 320px;
				/*z-index: 3;*/
		/*		width:413px;*/
			}
			
			
			/*Start of Divs on the home page only*/
				#hmTitle{
					position:absolute;
					top:0px;
					left: 20px;
					height:23px;
					width:382px;
					background-image: url(images/hmTitle.png);
					background-repeat: no-repeat;
					/*z-index: 4;*/
				}
	
				.hmSquareB{
					position:absolute;
					height:87px;
					width:87px;
					text-align: center;
					padding-top: 4px;
					background-image: url(images/hmSquareB.png);
					background-repeat: no-repeat;
					/*z-index: 4;*/
				}
				
				.hmSquareG{
					position:absolute;
					height:87px;
					width:87px;
					text-align: center;
					padding-top: 4px;
					background-image: url(images/hmSquareG.png);
					background-repeat: no-repeat;
					/*z-index: 4;*/
				}
		
				#hmSquare1{
					top:36px;
					left: 20px;
				}
	
				#hmSquare2{
					top: 36px;
					left: 116px;
				}
	
				#hmSquare3{
					top: 36px;
					left: 212px;
				}
	
				#hmSquare4{
					top:36px;
					left: 310px;
				}
	
				.hmButtonImage {
					position: absolute;
					/*z-index: 5;*/
				}
	
				#hmButtonMultipurpose, #hmButtonCarpet, #hmButtonOdor {
					left: 3px;
					bottom: -1px;
				}
	
				#hmButtonGlass {
					left: 11px;
					bottom: 13px;
				}
				
/*				#hmButtonCarpet {
					left: 15px;
				}
		
				#hmButtonOdor {
					left: 0px;
					bottom: 5px;
				}
*/	
				.hmButtonText {
					position: absolute;
					left: 0px;
					text-align: center;
					font-family: Verdana, Arial, Helvetica, sans-serif;
					font-size: 12px;
					font-weight: bolder;
					text-decoration: none;
					/*z-index: 5;*/
					color:#663300;
					cursor: pointer;
				}
	
				.hmTextMoney {
					left: 25px;
				}
	
				.hmTextCrops {
					left: 15px;
				}
	
				.hmTextWater, .hmTextEnviro {
					left: 12px;
				}
	
				.hmTextSoil {
					left: 15px;
				}
	
				#hmInfo{
					position:absolute;
					top:140px;
					left: 20px;
					height:149px;
					width:382px;
					background-image: url(images/hmStart.png);
					background-repeat: no-repeat;
				}
				
				#hmInfoContainer{
					position: absolute;
					top:16px;
					left: 10px;
					height:115px;
					width:362px;
					padding-top: 0px;
				}
				
					#hmInfoText{
						position: absolute;
						top:0px;
						left: 135px;
						height:115px;
						width:220px;
						padding-top: 0px;
					}
					
					.hmInfoPic{
						position: absolute;
						top:0px;
						left: 0px;
						height:115px;
						width:120px;
						padding-top: 0px;
						background-repeat: no-repeat;

					}
					
					.multipurpose, .carpet, .odor{
						padding-top: 5px;
						padding-left: 8px;
					}
					
					.glass{
						padding-top: 13px;
						padding-left: 17px;
					}
					
					.hmInfoStart{
					}
					
					
									
				
				#pageTitle {
					position: relative;
					top: 10px;
					left:20px;
				}
				
				#firefoxBanner {
					position: relative;
					top: 300px;
					left: 0px;
					width: 445px;
					height: 125px;
					background-image: url(images/firefoxBanner.png);
					background-repeat: no-repeat;
					padding-top: 30px;
					padding-left: 130px;
				}
					
			/*End of Divs on the home page only*/

			/*Start of Divs on the Product page only*/
			
				#pro1, #pro2, #pro3, #pro4, #pro5, #pro6, #pro7{
					width:26%;/*33 with pic*/
					height: 125px; 
				}
				
				#pro1 {
					padding-left: 50px;
				}
				
				.proImgPad {
					padding: 0px 10px 0px 0px;
				}
				

		/*End of Divs on the Product page only*/


		.borderGreen {
			border: #66FF33 thick ridge;
		}
		
		.borderBlue {
			border: #33CCFF thick ridge;
		}
		
		.recommendationsSingleApp, .recommendationsFullYear {
			width: 350px;
		}
		
		#recFullYearTable, #recSingleAppTable {
			width: 340px;
		}
		
		
			
		/*Start of Divs on the Application page only*/
				#recAppForm {
					padding-top: 20px;
					padding-left: 20px;
					width: 100%;
				}
					#yourInfoTable {
						width: 100%;
					}
						.col1 {
							width: 192px;
						}
					#whatCrop {
						width: 140px;
					}
			
					.smField {
						width: 30px;
						
					}
					
					.medField {
						width: 60px;
						text-align: right;
					}
					
					.lgField {
						width: 80px;
						text-align: right;
					}
					
					.td75{
						width: 100px;
					}
					
					#yourInfoTable label {
						cursor: pointer;
					}
					
					input[disabled='disabled'], .disabled {
						background-color: #FFFFFF;
						color: #666666;
						cursor: default;
						border: none;
						border-collapse: collapse;
					}
					#bioGal, #bioJugs, #carbonGal, #carbonJugs, #totalGal, #totalJugs {
						text-align:right;
					}
					
				
		/*End of Divs on the Application page only*/
		
		
		#descriptions {used on info page
			width: 90%;
			height: 145px;
			padding: 10px;
		}
		
		.bioLogicIcon{
			padding-left: 5px;
			padding-top: 20px;
		}
		
		.bioLogicNav{
			position:absolute;
			left: 32%;
			height: 70px;
		}
		
		.jqDockLabel {
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size: 12px;
			font-style: normal;
			color: #1874A7;
			text-align: left;
			padding: .1em 1em 0em 1em;
		}
		
		.padBottom {
			padding-bottom: 15px;
		}
		/*End of Divs nested in content div*/		


	#footer{
			position: absolute;
			left: 0px;
			bottom: 0px;
			width:100%;
			height: 149px;
			background-image: url(images/footer.png);
			background-repeat: no-repeat;
			text-align:center;
			padding-top: 0px;
			/*z-index: -3;*/
		}

			#footerLine{
				position: absolute;
				left: 1%;
				top: 125px;
				width:98%;
				height: 17px;
				background-color: #B32C28;
				text-align:center;
				padding-top: 2px;
			}		


/*Start of Buttons*/
		#calc{
			margin-right:auto;
			margin-left: auto;
			width: 180px;
			height: 65px;
			background-image: url(images/buCalc.png);
			background-repeat: no-repeat;
			padding-top: 24px;
			padding-left: 8px;
		}
		
		#calc:hover{
			background-image: url(images/buCalc_over.png);
		}
		
		#addToTruck {
			position: absolute;
			bottom: 34px;
			background-image: url(images/addToTruck.png);
			background-repeat: no-repeat;
			margin-left: 85px;
			width: 145px;
			height: 34px;				
		}
		
		#addToTruck:hover {
			background-image: url(images/addToTruck_over.png);
		}	
		
		.quoteContainer {
			position:absolute;
			top: 0px;
			right: 0px;
			width: 220px;
			height: 105px;
			background-image: url(images/speechBubble.png);
			background-repeat: no-repeat;
			/*z-index: 1;*/
		}
		
			.quote {
				position: absolute;
				top: 13px;
				right: 16px;
				width: 179px;
				height: 55px;
				padding-top: 2px;
				padding-left: 5px;
				display: block;
				cursor: pointer;
				/*z-index: 5;*/
				
			}
			
			#author{
				color:#C93;
			}
		
		.bioRight {
			width: 415px;
			padding: 10px;
			margin-left: 15px;
			margin-right: 15px;
			
		}
		
		.blLeftBox1 {
			float:left; 
			width:235px;
			border: #006699 solid 1px;
			padding:0px 10px 10px 15px; 
			margin:15px 25px 15px 15px;
		}				
/*End of Buttons*/


/*Text styles that we're using*/	

	.copy, .copy11, .copySmall, .copyWhite, .copyWhiteSm, .copyGray, .titleL, .titleBrn, .titleC, .titleC2, .title2, .titleB, .medGray, .copyGrayLg, .medBlueNP, .medGrayNP, .copyNP, .link, .linkSmall, .linkSmallGray, .titleBlink, .menuLink, .contactMapTitle, .linkWhite {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-style: normal;
	}
	
	.alignRight{
		position: absolute;
		right:25px;
	}
	
	.copy, .copy11, .copySmall, .copyWhiteSm, .titleL, .titleBrn, .copyGrayLg, .medGray, .titleB, .medBlueNP, .medGrayNP, .copyNP, .contactMapTitle {
		text-align: left;
	}
	
	.copyWhite, .titleC, .titleC2 {
		text-align:center;
	}
	
	.copySmall, .medGray, .medBlueNP, .medGrayNP {
		font-size: 10px;
	}
	
	.copy, .copyWhite, copyGray, .copyNP, .titleB {
		font-size: 12px;
	}
	
	.titleL, .titleBrn, .titleC, .contactMapTitle {
		font-size: 16px;
	}

	.copyGrayLg {
		font-size: 14px;
	}
	
	.copy, .copy11, .copySmall, .titleC, .titleC, .titleC2, .copyNP {
		color: #000000;
	}
	
	.copyWhite, .copyWhiteSm {
		color:#FFFFFF;
	}
	
	.copyGray, .copyGrayLg, .medGray, .medGrayNP {
		color: #666666;
	}
		
	.copy11 {
		font-size: 11px;
	}
	
	.copy, .copy11, .medGray {
		padding: .1em 1em 0em 1em;
	}
	
	.titleL, .titleBrn {
		padding: 0em 0em 0em .5em;
	}
	
	.copyWhite {
		font-weight:bold;
		left:12%;
		padding:0.25em 0 0;
		position:absolute;
		top:2px;
	}
	
	.titleL, .title2, .medBlueNP, .titleB, .contactMapTitle {
		color: #1B75BC;
	}	
	
	.titleC2, .title2, .titleC, .contactMapTitle {
		font-weight:bold;
	}	
	
	.copyWhiteSm { 
		font-size: 9px;
		text-decoration: none;
	}

	.titleBrn {
		color: #663300;
	}

	.titleC2 {
		font-size: 14px;
	}	
	
	.title2 {
		font-size: 13px;
		text-decoration: none;
	}
	
	.title2:hover {
		color: #0099CC;
	}


/*Link styles*/

	.link, .linkSmall, .linkSmallGray, .titleBlink, .menuLink, .linkWhite {
		text-align: left;
	}
	
	.linkSmall, .linkSmallGray {
		font-size: 10px;
	}
	
	.link, .linkSmall, .linkSmallGray, .titleBlink, .menuLink, .linkWhite {
		text-decoration:none;
	}
	
	.menuLink{
		color: #0D713C;
	}
		
	.link, .linkSmall, .titleBlink {
		color: #1B75BC;
	}
	
	.menuLink:hover{
		color: #29A500;
	}
	
	.link, .menuLink, .linkWhite{
		font-size: 12px;
	}

	.link:hover, .linkSmall:hover {
		color: #1790C6;
	}
	
	.linkSmallGray {
		color: #CCCCCC;
	}
	
	.linkWhite {
		color:#FFFFFF;
	}
	
	.linkSmallGray:hover, .linkWhite:hover{
		text-decoration: underline;
	}
	
	.titleBlink {
		font-size: 16px;
		font-style: normal;
		padding: 0em 0em 0em .5em;
	}

	.titleBlink:hover {
		color: #0099CC;
	}

	.loggedInAs {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size:12px;
		color: #FFFFFF;
		font-style:italic;
		font-weight: bold;
	}
	
	.loginLinks, .loginCopy{
		font-family: Verdana, Arial, Helvetica, sans-serif;
		text-decoration: none;
		font-size:12px;
		color: #FFFFFF;
		font-weight: bold;
	}
	
	.loginLinks:hover {
		text-decoration: underline;
	}
/*Other styles that we're using*/	

	.floatL {
		float: left;
	}

	.floatR {
		float: right;
	}	
	
	.paddingR, .paddingSides{
		padding-right: 25px;
	}
	
	.paddingL, .paddingSides {
		padding-left: 25px;
	}



	.width40 {
		width: 40%;
	}
	
	.width60, .width60C, .thankDoc {
		width: 60%;
	}
	
	.width90, .productLinks {
		width: 90%;
	}
	
	.width50, .width50C {
		width: 50%;
	}
	
	.width50C, .thankDoc, .width60C {
		margin-left:auto;
		margin-right:auto;
	}
	
	.productLinks {
		margin-left:auto;
		margin-right:auto;
	}
	
	
	
	.floatingPic1 {
		position: absolute;
		left: -165px;
	}
	
	.floatingPic2 {
		position: absolute;
		left: -200px;
	}
	
	.floatingPic2a {
		position: absolute;
		left: -225px;
	}
	
	.floatingPic3 {
		position: absolute;
		left: -250px;
	}

/*Ajack ticker stuff*/	

#ajaxticker1{
		position:absolute;
		top: 13px;
		left: 19px;
		width: 80%;
		height: 50%;
}


.message {/*used for the ticker */
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		color: #000000;
		text-align: left;
		cursor: pointer;
}

/*End Ajack ticker stuff*/	

/*Text styles*/	


	.copySmList {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		font-style: normal;
		color: #000000;
		text-align: left;
	}

	.copyright {
		padding: 0.5em 0em;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 9px;
		display:block;
	}
	

/*Link styles*/

	.lgLink {
		text-align: left;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 13px;
		font-weight:bold;
		color: #000066;
		text-decoration:none;
	}

	.lgLink:hover {
		text-align: left;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #006699;
		text-decoration:none;
	}


	.navLinks {
		text-align: left;
		position:relative;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 14px;
		width:175px;
		/*z-index: 4;*/
	}

	.navLinks a {
		text-decoration: none;
		color: #000000;
	}

/*	.navLinks a:hover, .navLinks a:focus {

		text-decoration: underline;

		color: #000000;

	}*/

	#footerLinks li{
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		display: inline;
		list-style-type: none;
		padding-right: 5px;
	}

	.footerLinks a {
		color: #000000;
		text-decoration: none;
	}

	.footerLinks a:hover, .footerLinks a:focus {
		color:#FFFFFF;
	}

/*Other styles*/	

	.hide {
		display: none;
	}

	.navLine {
		width:150px;
	}

	.hr50 {
		width:50%;
	}

	.hr75 {
		width:75%;
	}
	
/*Contact Page Styles for map info*/	
	#brkrDlrRm {
		width: 40%;
		margin-right: auto;
		margin-left: auto; 
	}
	
	.PuertoRico{
		position: relative;
		top: -60px;
		left: 200px;
	}
	.statePic{
		width: 60%;
		margin-right:auto;
		margin-left:auto;
		text-align: center;
	}	
	
	.zoomOut {
		position:absolute;
		top: 45px;
		left: 45px;		
		width: 50px;
		height: 40px;
		background-image: url(images/zoomout.png);
		background-repeat: no-repeat;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size:9px;
		color:#666666;
		vertical-align:bottom;
		margin: 15px 0px 0px 45px;
	}
/*End Contact Page Styles*/
