@charset "utf-8";

/* CSS Document */
/* Need to Be Placed Divs */

#ball{
	position:absolute;
	width: 30px;
	height: 30px;
	z-index: 100;
}

#siteLinks {
	position: absolute;
	left: 0px;
	bottom: 10px;
	width: 100%;
} 

div.statePic {
	width: 60%;
	margin-right:auto;
	margin-left:auto;
	text-align: center;
}

#brkrDlrRm {
	width: 40%;
	margin-right: auto;
	margin-left: auto; 
}

.PuertoRico{
	position: relative;
	top: -60px;
	left: 200px;
}

form#state input {
	border: none;
}

.clickable {
	cursor: pointer;
}

/*Main structure of the page*/
	body {
		background-color: #a5a5a5;
	}	

	#main{
		position: relative;
		width: 860px; 
		margin-right: auto;
		margin-left: auto;
		background-image: url(images/backGrad.jpg);
		background-repeat: repeat-y;
	}
	
		#header{
			position:absolute;
			top:0px;
			left:0px;
			height:256px;
			width:100%;
			background-image: url(images/header.png);
		}
		
			#logo {
				position: absolute;
				top: 70px;
				left: 95px;
				width: 312px;
				height: 139px;
				background-image: url(images/logo.png);
				background-repeat: no-repeat;
				border: none;
				z-index: 121;			
			}		

			#nav{
				position: absolute;
				top: 178px;
				left:0px;
				width:100%;
				height: 20px;
				z-index: 123;
			}
			
			#navBar{
				position: absolute;
				top: 178px;
				left: 38px;
				width:783px;
				height: 32px;
				background-image: url(images/navBar.png);
				background-repeat: no-repeat;
				z-index: 119;
 			}		
			
			#headBlue{
				position: absolute;
				top: 10px;
				left: 35px;
				width:789px;
				height: 241px;
				background-image: url(images/headBlue.png);
				background-repeat: no-repeat;
				z-index:117;
 			}

			#headWhite{
				position: absolute;
				top: 36px;
				left: 41px;
				width:708px;
				height: 167px;
				background-color:#FFFFFF;
				z-index:118;
 			}
			
			#headPic{
				position: relative;
				top: 5px;
				left: 5px;
				width:698px;
				height: 157px;
				background-image: url(images/headPic2.jpg);
				background-repeat: no-repeat;
				z-index:118;
 			}
			
		#pageTitle{
			position:absolute;
			top:260px;
			left:56px;
			width:746px;
			height:30px;
			background-color: #D9EEF9;
			padding-top:5px;
		}
		
		#leftSideHm{
			position:absolute;
			top:0px;
			left: -30px;
			width: 385px;
			height: 290px;
			z-index: 3;
		}
				

		#rightSide{ /*not on home page*/
			position:absolute;
			top:0px;
			right: -15px;
			width:450px;
		}
		
		#rightSide2{ /*ONLY on home page*/
			position: absolute;
			top: 0px;
			right: 10px;
			width: 300px;
			background-image: url(images/homeContent.png);
			background-repeat: repeat-x;
			background-color: #FFFFFF;
			padding: 0px 10px 0px 10px;
		}

		#leftSide{
			position:absolute;
			top:0px;
			left: -30px;
			width: 255px;
		}

		#content{
			position:absolute;
			top: 305px;
			left: 10%;
			width: 80%;
		}
				
		#footer{
			position:absolute;
			left:0px;
			bottom:0px;
			width:100%;
			height:30px;
			background-image: url(images/footer.jpg);
			background-repeat: no-repeat;
			text-align:center;
			padding:0px;
		}		

		#leftContent {
			position:absolute;
			top: 15px;
			left: 15px;
			width: 250px;
		}
		
		#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);
		}
		
				
		
		
		.floatingPic3 {
			position: absolute;
			left: -290px;
		}
		
		.floatingPic1 {
				position: absolute;
				left: -331px;
			}
			/*Start of Divs on the Product page only*/
			
				#proBio, #proCarbon, #proMin {
					width:33%;
					height: 250px;
				}
				
				#proBio {
					padding-left: 0px;
				}
				
				.proImgPad {
					padding-right: 10px;
				}
				

			/*End of Divs on the Product page only*/

/*Here are the tags for the drop down menu's*/

#dropmenudiv{
	position: absolute;
	border-top-width: 5px;
	border-left-width: 5px;
	border-right-width: 5px; 
	border-bottom-width: 5px;
	border-style: solid;
	border-color: #f9de48;
	font-family: Verdana;	
	font-size: 11px;
	font-weight: normal;	
	text-decoration: none;
	text-align: left;
	line-height: 18px;
	z-index:119;
}

#dropmenudiv a{
	background-color: #ffffff;
	width: 200px;/*this is the width of the hrefs in the menu, safari and firefox are very picky the width of the body is in the js*/
	display: block;
	text-indent: 8px;
	text-align: left;
	padding: 0px;
	font-family: Verdana;	
	font-size: 11px;
	font-weight: normal;	
	text-decoration: none;	
	color: #000000;
}

#dropmenudiv a:hover{ /*hover background color*/
	background-color: #1a76b3;
	color: #ffffff;
}

/*END tags for the drop down menu's*/

/*Text styles that we're using*/	

	.copy, .copy11, .copySmall, .copyWhite, .copyWhiteSm, .copyGray, .titleL, .titleBrn, .titleC, .titleC2, .title2, .medGray, .medBlueNP, .medGrayNP, .copyNP, .link, .linkSmall, .linkSmallGray, .titleBlink, .contactMapTitle, .linkWhite  {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-style: normal;
	}
	
	.copy, .copy11, .copySmall, .copyWhiteSm, .titleL, .titleBrn, .medGray, .medBlueNP, .medGrayNP, .copyNP, .contactMapTitle {
		text-align: left;
	}
	
	.copyWhite, .titleC, .titleC2, .title2 {
		text-align:center;
	}
	
	.copySmall, .medGray, .medBlueNP, .medGrayNP {
		font-size: 10px;
	}
	
	.copy, .copyWhite, copyGray, .copyNP {
		font-size: 12px;
	}

	.titleC2 {
		font-size: 14px;
	}	
	
	.titleL, .titleBrn, .titleC, .contactMapTitle {
		font-size: 16px;
	}

	.copy, .copy11, .copySmall, .titleC, .titleC, .titleC2, .copyNP {
		color: #000000;
	}
	
	.copyWhite, .copyWhiteSm {
		color:#FFFFFF;
	}
	
	.copyGray, .medGray, .medGrayNP {
		color: #666666;
	}
	
	.copy, .copy11, .medGray {
		padding: .1em 1em 0em 1em;
	}
	
	.titleL, .titleBrn {
		padding: 0em 0em 0em .5em;
	}
	
	.copy11 {
		font-size: 11px;
	}
	
	.copyWhite {
		font-weight:bold;
		left:25%;
		padding:0.25em 0 0;
		position:absolute;
		top:2px;
	}
	
	.titleL, .title2, .medBlueNP, .contactMapTitle {
		color: #1874A7;
	}	
	
	.titleC2, .title2, .titleC, .contactMapTitle, .titleL {
		font-weight:bold;
	}	
	
	.copyWhiteSm { 
		font-size: 9px;
		text-decoration: none;
	}

	.titleBrn {
		color: #663300;
	}	
	
	.title2 {
		font-size: 13px;
		text-decoration: none;
	}
	
	.title2:hover {
		color: #0099CC;
	}


/*Link styles*/

	.link, .linkSmall, .linkSmallGray, .titleBlink, .linkWhite {
		text-align: left;
	}
	
	.linkSmall, .linkSmallGray {
		font-size: 10px;
	}
	
	.link, .linkSmall, .linkSmallGray, .titleBlink, .linkWhite {
		text-decoration:none;
	}
		
	.link, .linkSmall, .titleBlink {
		color: #1874A7;
	}
	
	.link, .linkWhite {
		font-size: 12px;
	}
	
	.linkWhite {
		color:#FFFFFF;
	}
	
	.link:hover, .linkSmall:hover {
		color: #1790C6;
	}
	
	.linkSmallGray {
		color: #CCCCCC;
	}
	
	.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: #666666;
		font-style:italic;
		font-weight: bold;
	}
	
	.loginLinks, .loginCopy {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		text-decoration: none;
		font-size:12px;
		color: #999999;
		font-weight: bold;
	}
	
	.loginLinks:hover {
		text-decoration: underline;
		color: #333333;
	}

	
/*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;
	}
	
/*End Text and Links*/
	.stateName {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		color: #649338;
		font-size: 18px;
		font-weight: bold;
	}	

	.subTitle {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 14px;
		font-style: normal;
		color: #848484;
		text-align: left;
		font-weight:bold;
		padding: 1.5em 1em 0em 0em;
	}	

	.subInfo {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 11px;
		font-style: normal;
		color: #333333;
		text-align: left;
		padding: 0em 0em 0em 2em;
	}					

	.copyright {
		padding: 0.5em 0em;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 9px;
		display:block;
	}
	
/*Link styles*/
	#navLinks li{
		position: relative;
		top: 6px;
		left: 65px;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		margin:0px 0px 0px 0px;
		display: inline;
		list-style-type: none;
		padding: 0px 0px 0px 40px;
	}	
	.navLinks a {
		padding: 0.5em 1em;
		color: #333333;
		text-decoration: none;
	}	

	.navLinks a:hover, .navLinks a:focus {
		color: #000000;
		background-color: #F9DE48;
	}

	#footerLinks li{
		position: relative;
		top: 8px;
		vertical-align: bottom;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		display: inline;
		list-style-type: none;
		padding: 3px 0px 0px 5px;
	}	

	.footerLinks span {
		vertical-align: bottom;
		padding: 3px 0px 0px 5px;
		position: relative;
		top: 10px;
	}	

	.footerLinks a {
		color: #000000;
		text-decoration: none;
	}
	
	.footerLinks a:hover, .footerLinks a:focus {
		text-decoration: underline;
	}
/*
	.link {
		text-align: left;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		color:#0033CC;
		text-decoration:none;
	}
	
	.link:hover {
		text-align: left;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		color:#0099CC;
		text-decoration:none;
	}	
	.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;
	}		
	.smLink {
		text-align: left;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		font-style: normal;
		color:#0033CC;
		text-decoration:none;
	}	
	.smLink:hover {
		text-align: left;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		font-style: normal;
		color: #0099CC;
		text-decoration:none;
	}		
	#content li {
		font-family:Verdana, Arial, Helvetica, sans-serifl;
		font-size: 12px;
		list-style-type: disc;
	}
/*Experinces Picture Placement*/	

/*	.floatL {
		float: left;
		margin: 10px 18px 10px 10px;
	}
		.floatR {
		float: right;
		margin: 10px 10px 10px 18px; 
	}
*/	

/*Other styles*/	
	.hide {
		display: none;
	}	

	.zoomOut {
		float:left;
		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;
	}
	
	.hr100 {
		color:#FFFF00;
		border-style: solid;
	}	

/*	.navLine {
		width:150px;
	}			

	.hr75 {
		width:75%;
	}*/				

/*Nav Rollover pictures*/	
	span.home {
		position: absolute;
		top: 170px;
		left: 120px;
		z-index: 122;
	}
		
	span.products {
		position: absolute;
		top: 170px;
		left: 238px;
		z-index: 122;	
	}
	
	span.store {
		position: absolute;
		top: 170px;
		left: 347px;
		z-index: 122;
	}
	
	span.application {
		position: absolute;
		top: 170px;
		left: 457px;
		z-index: 122;
	}
	
	span.why {
		position: absolute;
		top: 170px;
		left: 587px;
		z-index: 122;
	}	

	span.contact {
		position: absolute;
		top: 170px;
		left: 680px;
		z-index: 122;
	}		

	#trail {
		position: absolute;
		top: 106px;
		left: 210px;
		z-index: 122;
	}			

	#logoText {
		position: absolute;
		top: 86px;
		left: 486px;
		z-index: 122;
	}		
	
	#emailLogin {
		position: absolute;
		top: 15px;
		right: 45px;
		width: 100%;
		height: 20px;
		text-align: right;
		z-index: 122;
	}
			

.paddingL {
	padding-left: 50px;
}

/* BioLogic Styles */

		.bioLogicIcon{
			padding-left: 5px;
			padding-top: 20px;
		}
		
		.bioLogicNav{
			position:absolute;
			left: 29%;
			height: 70px;
		}
		
		.bioRight {
			width: 415px;
			padding: 10px;
			margin-left: 15px;
			margin-right: 15px;
			
		}		
		
		.blLeftBox1 {
			float:left; 
			width:250px;
			border: #006699 solid 1px;
			padding:0px 10px 10px 15px; 
			margin:15px 25px 15px 15px;
		}	
		
		#descriptions {used on info page
			width: 90%;
			height: 145px;
			padding: 10px;
		}
				
		.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;
		}