/* ---------------------------------------- 

Created: Ricky
Date: 07/20/2009

---------------------------------------- */

/* Import the resets style sheet*/
@import url("resets.css");

@media screen
{
	
html, body
	{
		height:100%;
		margin:0;
		padding:0;
		text-align:center;
		width:100%;
	}
	
	img
	{
		border:0;
	}
	
	body
	{
		color: #4c4c4c;
		font: normal normal 12px Arial, Helvetica, sans-serif;
		background:#000 url(/images/pro_background_dark.jpg) top repeat-y;
	}
	
	ul, ol
	{
		list-style:disc;
		margin:0 0 17px 0; 
		padding:0 0 0 18px;
	}
	
	p
	{
		margin-bottom:15px;
	}
	
	strong
	{
		font-weight:bold;
	}
	
	hr
	{
		color:#999;
		height:1px;
		margin:20px 0;
		width:100%;
	}
	
	a:link, a:visited
	{
		color:#0099CC;
		text-decoration:none;
	}
	
	a:hover
	{
		text-decoration:underline;
	}
	
	

	/* clear without structural mark-up from PIE website*/
	.clear:after 
	{ 
		clear:both;
		content:"."; 
		display:block; 
		height:0;  
		visibility:hidden; 
	}
	
	.clear
	{ 
		display:inline-block;
		line-height:0; 
	}
	
	/* mac hide \*/
	* html .clear 
	{
		height: 1%;
	}
	
	.clear
	{
		display:block;
	}
	/* End hide */
	/* do not change or amalgamate clearfix styles*/
	
	
	
	#aspnetform /* Safari Fix */
	{
		margin:0;
		padding:0;
	}	
	
/* -------------------- Container -------------------- */
	
	#proContainer
	{
		margin:0 auto;
		text-align:left;
		width:961px;
		z-index:1000;
	}
	
	#proPrintHeader
	{
		
		display:none;
	}	
	
	#proHeader
	{
		background:url(/images/pro_header_background.jpg) left top no-repeat;
		float:left;
		height:146px;
		position:relative;
		width:100%;
		z-index:500
	}
	
	*html #proHeader
	{
		left:6px;
		
	}
	
	#proHeaderBrands
	{
		background:url(/images/pro_header_background.jpg) left top no-repeat;
		float:left;
		height:146px;
		position:relative;
		width:100%;
		z-index:500
	}
	
	*html #proHeaderBrands
	{
		left:6px;
	}
	
	
	/* GOOGLE CUSTOM SEARCH */
	#proSearchContainer
	{
		margin:0 auto;
		position:relative;
		text-align:left;
		width:961px;
		z-index:7000;
	}
	#proSearch
	{
		left:698px;
		top: 35px;
		position:absolute;
		z-index:9998;
	}

	#proLogo
	{
		float:left;
		margin:32px 0 0 40px;
	}
	
	*html #proLogo
	{
		margin-left:20px;
		margin-top:29px;	
	}
	
	#proHeaderRight
	{
		float:right;
		margin:11px 13px 0 0 ;
	}
	#proHeaderRight a:link, #proHeaderRight a:visited 
	{
		color:#ccc;
		text-decoration:none;
	}
	
	#proHeaderRightTop
	{
		clear:both;
		margin-bottom:10px;	
	}
	#proHeaderRightBottom
	{
		clear:both;
		margin-bottom:10px;	
	}
	
	
	#proHeaderRight a:hover
	{
		text-decoration:underline;
	}
	
	
	#proNavigation
	{
		float:left;
		height: 25px;
		position:relative;
		top:39px;
		width: 100%;
	}
	
	#proNavigationLeft
	{
		float:left;
		min-height: 25px;
		position:relative;
		top:-1px;
		left:38px;
		width:500px;
	}
	
	#ProNavContainer
	{
		height:26px;
	}
	
	
	#proNavigationRight
	{
		float:left;
		left:228px;
		min-height: 25px;
		position:relative;
	}
	
	#proFooter
	{
		float:left;
		height:30px;
		left:35px;
		position: relative;
		width:100%
		
	}
	
	#proFooterLeft
	{
		float:left;
		position: relative;
	}
	
	#proFooterRight
	{
		float:right;
		position: relative;
		right:70px;
	}
	
	#proFooterRight a:link, #proFooterRight a:visited
	{
		color:#fff;
		text-decoration:underline;
	}
	
	#proFooterRight a:hover
	{
		text-decoration:none;	
	}
	
	
	/*  SPLASH ONLY  */
	#proSplashBody
	{
		
		float:left;
		padding:10px;
		width:100%;
	}
	
	*html #proSplashBody
	{
		position:relative;
		left:23px;	
	}
	
	#proSplashBanner
	{
		background:url(/images/pro_home_banner.jpg) left top no-repeat;
		float:left;
		height:284px;
		width:100%;
		
	}
	
	#proSplashBannerCopy
	{
		position: relative;
		left:35px;
		top:33px;
		width:436px;	
	}
	
	#proSplashBannerCopyMiddle
	{
		height: 60px;
		overflow:hidden;
		width:375px;
		
	}
	
	#proSplashBannerCopyBottom
	{
		height: 134px;
		margin: 20px 0 0 0;
		overflow:hidden;
		width:420px;
	}
	
	#proSplashJqueryRotator
	{
		background:url(/images/pro_jquery_background.jpg) left top no-repeat;
		float:left;
		height:213px;
		left: -26px;
		position:relative;
		top: 10px;
		width:996px;
	}

	*html #proSplashJqueryRotator
	{
		left: -25px;
	}
	
	#proSplashInfoBoxes
	{
		background:#fff url(/images/pro_splash_bottom_background.jpg) left bottom no-repeat;
		color:#4c4c4c;
		float:left;
		margin: 0px 0px 0px 1px;
		padding: 0 0 20px 0;
		width:940px;
		
	}
	
	#proSplashInfoBoxesLeft
	{
		float:left;
		position:relative;
		left:35px;
		top:20px;
		width:430px;
		padding: 0 0 20px 0;
	}
	
	#proSplashInfoBoxesRight
	{
		float:right;
		position:relative;
		top:20px;
		right:20px;
		width:440px;
		padding: 0 0 20px 0;
	}
	
	#proSplashInfoBoxes .Header
	{
		margin:0 0 10px 0;
	}
	
	#proSplashInfoBoxes .Header a:link, #proSplashInfoBoxes .Header a:visited
	{
		color:#e2373f;
		text-decoration:none;
	}
	
	#proSplashInfoBoxes .Header a:hover
	{
		text-decoration:underline;
	}
	
	
	#proBody
	{
		background:#fff url(/images/pro_splash_bottom_background.jpg) left bottom no-repeat;
		float:left;
		left: 10px;
		margin:0 0 20px 0;
		padding:0 0 50px 0;
		position: relative;
		top:10px;
		width:940px;
	}
	
	
	#proBodyChemicals
	{
		background:#fff url(/images/ProChemicalsBodyBottom.jpg) left bottom no-repeat;
		float:left;
		padding:0 0 140px;
		margin-bottom:20px;
		position: relative;
		top:10px;
		left:10px;
		width:940px;
	}
	
	#proBodyAmericanHydro
	{
		background:#fff url(/images/AmericanHydroBottomImage2.jpg) left bottom no-repeat;
		float:left;
		padding:0 0 180px;
		margin-bottom:20px;
		position: relative;
		top:10px;
		left:10px;
		width:940px;
	}
	
	#proBodyLanoSoft
	{
		background:#fff url(/images/LanoSoftBottomImage.jpg) left bottom no-repeat;
		float:left;
		padding:0 0 180px;
		margin-bottom:20px;
		position: relative;
		top:10px;
		left:10px;
		width:940px;
	}
	
	#proBodySpectrum
	{
		background:#fff url(/images/SpectrumBottomImage.jpg) left bottom no-repeat;
		float:left;
		padding:0 0 180px;
		margin-bottom:20px;
		position: relative;
		top:10px;
		left:10px;
		width:940px;
	}
	
	#proBodyRedBGone
	{
		background:#fff url(/images/pro_splash_bottom_background.jpg) left bottom no-repeat;
		float:left;
		padding:0 0 100px;
		margin-bottom:20px;
		position: relative;
		top:10px;
		left:10px;
		width:940px;
	}
	
	#proBreadCrumb
	{
		border-bottom: solid 1px #666;
		float:left;
		clear:both;
		padding: 0 0 5px 0;
		position:relative;
		top: 10px;
		left:30px;
		width:880px;
	}
	
	#proBreadCrumbLeft
	{
		float:left;
	}
	
	#proBreadCrumbLeft a:link, #proBreadCrumbLeft a:visited
	{
		color:#666;
		text-decoration:underline;	
	}
	
	#proBreadCrumbLeft a:hover
	{
		text-decoration:none;	
	}
	
	#proBreadCrumbRight
	{
		float:right;
	}
	
	#proBodyLeft
	{
		float:left;
		width:246px;
		top:10px;
		left:30px;
		position:relative;
	}
	
	#proBodyCatLeft
	{
		float:left;
		width:610px;
		position:relative;
		top:20px;
		left:30px;
	}
	
	#proOurBrandsContainerLeftCol
	{
		float:left;
		margin:15px 0 0 -10px;
		width:246px;
		
	}
	
	*html #proOurBrandsContainerLeftCol
	{
		position:relative;	
	}
	
	#proOurBrandsContainerLeftColTop
	{
		background:#fff url(/images/OurBrandsTopLeftCol.jpg) left top no-repeat;
		float:left;
		height:58px;
		padding:0;
		margin:0;
		width:100%;
		
	}
	
	#proOurBrandsContainerLeftColMiddle
	{
		background:#fff url(/images/OurBrandsMiddleLeftCol.jpg) left top repeat-y;
		float:left;
		padding:20px 0;
		margin:0;
		text-align: center;
		width:100%;
		
	}
	
	#proOurBrandsContainerLeftColBottom
	{
		background:#fff url(/images/OurBrandsBottomLeftCol.jpg) left top no-repeat;
		float:left;
		height:16px;
		padding:0;
		margin:0;
		width:100%;
		
	}
	
	#proBodyOneCol
	{
		float:left;
		width:880px;
		position:relative;
		top:30px;
	}
	
	#proBodyRight
	{
		float:left;
		left:20px;
		width:610px;
		position:relative;
		top:30px;
	}
	
	#proBodyCatRight
	{
		float:left;
		width:246px;
		position:relative;
		left:50px;
		
	}
	
	#proBodyRightCopy
	{
		float:left;
		width:100%;
		position:relative;
		left:30px;
	}
	
	/*BRAND LANDING PAGE */
	#proBrandLandingItemContainer
	{
		float:left;
		left:-16px;
		margin-top:30px;
		position:relative;
		width:909px;
	}
	
	#proBrandLandingItemContainer a
	{
		position:relative;	
	}
	
	
	
	#proBrandLandingItem
	{
		background:#FFFFFF url(/images/BrandLandingBackgroundItem.png) no-repeat scroll left top;
		float:left;
		height:338px;
		width:303px;
	}
	#proBrandLandingItemTop
	{
		float:left;
		height:120px;
		padding-top:30px;
		text-align:center;
		width:100%;
	}
	#proBrandLandingItemBottom
	{
		float:left;
		height:156px;
		overflow:hidden;
		padding:0 30px;
	}
	
	/*PRODUCT IMAGE */
	#proProductImage
	{
		text-align:center;	
		position:relative;
		top:30px;
	}
	
	/*MSDS */
	#proMSDS
	{
		margin:10px 0 0;
		position:relative;
		text-align:center;
		top:30px;
	}
	
	/* TOOLKIT */
	#proToolkit
	{
		margin:40px 0 0;
		width:263px;
	}
	
	#proToolkitTop
	{
		height:68px;
		width:100%;
	}
	
	#proToolkit .ProChemicals
	{
		background:#FFFFFF url(/images/proToolkitPC.jpg) no-repeat scroll left top;
	}
	
	#proToolkit .AmericanHydro
	{
		background:#FFFFFF url(/images/proToolkitAH.jpg) no-repeat scroll left top;
	}
	
	#proToolkit .LanoSoft
	{
		background:#FFFFFF url(/images/proToolkitLA.jpg) no-repeat scroll left top;
	}
	
	#proToolkit .Spectrum
	{
		background:#FFFFFF url(/images/proToolkitSP.jpg) no-repeat scroll left top;
	}
	
	#proToolkit .RedBGone
	{
		background:#FFFFFF url(/images/proToolkitRG.jpg) no-repeat scroll left top;
	}
	
	#proToolkit .culliganToolkit
	{
		background:#FFFFFF url(/images/culliganToolkitPC.jpg) no-repeat scroll left top;
	}
	
	
	#proToolkitMiddle
	{
		background:#FFFFFF url(/images/proToolkitMiddle.jpg) repeat-y scroll left top;
		padding:10px 25px;
	}
	
	#proToolkitBottom
	{
		background:#FFFFFF url(/images/proToolkitBottom.jpg) no-repeat scroll left top;
		height:16px;
		width:100%
		
	}
	

	/* -------------------- Contact Us --------------------- */
	
	table.contactUs td
	{
		padding-bottom:10px;
	}
	
	.textBox
	{
		color:#2f2f2d;
		
		border:solid 1px #999;
		width:295px;
	}
	
	.textArea
	{
		color:#2f2f2d;
		font-family:Arial;
		font-size:11px;
		
		border:solid 1px #999;
		height:75px;
		width:600px;
	}
	
	.asterik
	{
		color:#990000;
	}
	
	.catchTB, .addresses
	{
		display:none;
	}

	.supReplace
	{
		font-size:70%;
		margin:0 0.1em 0 0.2em;
		position:relative;
		top:-1.3ex;
	}

	
	
	/*  TEXT STYLES */
	
	/*SIZE */
	.ten{font-size:10px;}
	.fourteen{font-size:14px;}
	.fifteen{font-size:15px;}
	.sixteen{font-size:16px;}
	.eightteen{font-size:18px;}
	.twenty{font-size:20px;}
	.twentysix{font-size:26px;}
	
	/*STYLE*/
	.bold {font-weight:bold;}
	.italic{ font-style:italic;}
	
	/*COLOR*/
	.gray{color: #ccc;}
	.yellow{color: #fff100;}
	.white{color: #fff;}
	.red{color:#e2373f;}
	.black{color:#000;}
	
	.proChemicalsBlue{color:#00a3e5}
	.americanHydroGreen{color:#00853e}
	.lanoSoftBlue{color:#559cbe}
	.spectrumBlue{color:#559cbe}
	.redbgoneRed{color:#e90000}
	
	h1
	{
		color:#e2373f;
		font-size: 20px;
		margin:0;
		padding:0;
	}
	
	.ProductDetailHeaderPC
	{
		font-family:Arial Black,  Arial, Helvetica, sans-serif;
		color: #00a3e5;
	}
	
	.ProductDetailHeaderAH
	{
		font-family:Arial Black,  Arial, Helvetica, sans-serif;
		color: #00853e;
	}
	
	.ProductDetailHeaderLA
	{
		font-family:Arial Black,  Arial, Helvetica, sans-serif;
		color: #559cbe;
	}
	
	.ProductDetailHeaderSP
	{
		font-family:Arial Black,  Arial, Helvetica, sans-serif;
		color: #559cbe;
	}
	
	.ProductDetailHeaderRG
	{
		font-family:Arial Black,  Arial, Helvetica, sans-serif;
		color: #e90000;
	}
	
	.proBreadCrumb a:link, .proBreadCrumb a:visited
	{
		text-decoration:none;
	}
	
	.proBreadCrumb a:hover
	{
		text-decoration:underline;
	}
	
	
	/*  NEWSROOM  */
	.sf_photoListLightbox
	{
		width:640px;
	}
	
	/* BUY ONLINE */
	#proBuyNow
	{	
		margin:9px 0 0 18px;
		text-align:center;
	}
	
	/*  Warranty card form */
	#warrantyCardForm {float: left; margin-top: 30px}
	#warrantyCardForm .fieldHeader {clear: both; float: left; margin: 0 30px 5px 0; width: 140px;}
	#warrantyCardForm .field {float: left; margin: 0 25px 10px 0}
	#warrantyCardForm .field input[type=text] {width: 230px}
	#warrantyCardForm #pumpNumber {float: left}
	#warrantyCardForm #opt {clear: both; float: left; margin-top: 10px;}
	#warrantyCardForm #submitWarranty {clear: both; font-size: 20px; color:#0099CC; float: left; margin-top: 10px;}
    #proBodyLeftCopy #waiting {clear: both; display:none; float: left; margin-top: 10px;}
	
	a.dp-choose-date {
	    float: left;
	    width: 16px;
	    height: 16px;
	    padding: 0;
	    margin: 5px 3px 0;
	    display: block;
	    text-indent: -2000px;
	    overflow: hidden;
	    background: url(calendar.png) no-repeat; 
    }
    a.dp-choose-date.dp-disabled {
	    background-position: 0 -20px;
	    cursor: default;
    }
    /* makes the input field shorter once the date picker code
     * has run (to allow space for the calendar icon
     */
    input.dp-applied {
	    width: 149px;
	    float: left;
    }
}

@media print
{
	#proContainer
	{
		margin:0 auto;
		text-align:left;
		width:650px;
	}
	
	#proPrintHeader
	{
		display:block;
		
	}
	
	#proHeader
	{
		display:none;
	}
	
	#proHeaderBrands
	{
		display:none;
	}
	
	#proBreadCrumb
	{
		display:none;
	}
	
	#proBodyLeft
	{
		display:none;	
	}
	
	#proFooter
	{
		display:none;
	}
	
	
	#proBrandLandingItem
	{
		margin:30px 0 0 0;
	}
	
	#proBodyCatRight
	{
		display:none;
	}
	
	#proSplashJqueryRotator
	{
		display:none;	
	}
	
	#proSplashInfoBoxes
	{
		margin:20px 0 0 0;
	}
}