body { background-color: #ffffff; margin: 0 0; padding: 0 0;  color: #333333; font-family: Calibri, Tahoma, Verdana, Arial; }

h1, h2, h3, h4, h5, h6, p { color: #333333; font-family: Calibri, Tahoma, Verdana, Arial;}

h1 { font-size: 30pt; }
h2 { font-size: 18pt; }
h3 { font-size: 11pt;  }
a {text-decoration: none;}
a:hover { text-decoration: underline; }
.currentPage a{ color: #666666 !important; }
.currentSubPage a { background-image:  url(/site_images/productsectionarrow.gif); background-position: right center;  background-repeat: no-repeat; }
#breadCrumb { color: #03519f; font-size: 8pt; position: absolute; top: 0 ;left: 0;}
#breadCrumb a {text-transform: uppercase; color: #03519f; }
#breadCrumb .last {color: #03519f; text-transform: uppercase;  }

/* ####################### Common Styles ############################# */

#topBar { margin-top: 18px; margin-bottom: 7px; width: 100%; display: block; float: left; }
#topBarInner { margin: 0 auto; position: relative; top: 0; left: 0; }

#footerBar { display: block; background-color: #ffffff; color: #666666;  width: 100%; float: left; margin-top: 0px; padding-top: 0;}
#footerBarInner { margin: 0 auto; position: relative; top: 0; left: 0;  }
#rightFooter p { text-align: left; font-size: 8pt !important; color: #666666; padding-top: 3px; margin-top: 0; }
.copyright { padding-right: 10px; padding-left: 0px;  text-align: right; font-size: 8pt !important; color: #666666;  padding-top: 5px;}
    .copyright a {
        border-right 0px none #ffffff !important;
    }
#rightFooter p a {color: #666666; border-right: 1px solid #666666; padding-right: 10px; padding-left: 10px; padding-top: 3px; padding-bottom: 3px;}
    #rightFooter p a:first-child {
        padding-left: 0;
    }
        #rightFooter p a:last-child {
        border-right: 0px none #666666;
    }
.blackBar { color: #ffffff;}
.PentairLogo img {margin-top: 20px; float: right; }
.hiddenFields { width: 0; overflow: hidden; }
.callPumpShopText { margin-top: 25px; }
.callPumpShop { font-weight: 800; font-size: 16pt !important; }
.callPumpShopNumber { padding-left: 50px; font-size: 12pt !important; font-weight: 600;}

.findPumpShop { padding-top: 25px; font-weight: 200; font-size: 12pt !important; }
.findPumpShop a {text-decoration: underline;}
#pentairLogo  {
    display: block;
    float: left;
    width: 200px;
    height: 82px;
    background-image: url(/site_images/pentair-logo-top.gif);
    background-repeat: no-repeat;
    position: relative;
    left: -14px;
    top: 10px;
}
#mainlogo { float: right; display: block; width: 118px; height: 82px; background-image: url(/site_images/onga_pumpshop_logo.gif); background-repeat: no-repeat; text-indent: -9999px; position: relative; right:2px;}
#coreContent {  width: 100%; position: relative; display: block;float: left; margin-bottom: 0; z-index: 10; }
#coreContentInner {  margin:  0 auto; position: relative; top: 0; left: 0; }
#navline { position: relative; left: 0; float: left; padding-left: 0;  }
#navline ul { list-style-type: none; padding: 0; margin-top:  7px;  margin-right: auto; margin-left: 0; margin-bottom: 0; position: relative; bottom: 0;}
#navline ul li a {text-transform: uppercase ;  color: #666666; font-weight: 700;}
#navline ul li a:hover {text-decoration: none; color: #333333; }
#navline ul li { margin-left: 0 !important; float: left; border-left: 1px solid #b2b2b2;  padding: 3px 10px; color: #666666; font-size: 11px; line-height: 13px;}
#searchBox { position: relative; top: 0; right: 3px;  float: left; width: 145px; height: 22px; text-align: right; }
#navline ul li:first-child {
    border-left: 0px none #b2b2b2;
    padding-left: 0;
}
.searchfield { background-color: #e6e6e6; border : 0 none #ffffff; color: #666666; float: right; height: 11px;margin-top: 0; padding-top: 4px; padding-bottom: 3px; padding-left: 5px; font-size: 8pt; width: 130px;}
.searchlink { display: block; width: 15px; height: 16px; padding-right: 3px; padding-left: 2px;padding-top: 2px; font-size: 11px; margin-left: 0; color: #ffffff; font-weight: 700; margin-right: 0px; float: right;background-color: #64a70b; }
    .searchlink:hover {
        text-decoration: none;
    }
.longShowcase { height: 360px; }
.shortShowcase { height: 297px; }

/*  ##################### Home Page Resources  ######################## */

#leftContent { background-color: #f2f2f2; float: left; width: 311px; height: 295px; color: #818185; margin-right: 5px;  position: relative; border: 1px solid #bcbdc0;}
#leftContent h1, #leftContent h2, #leftContent h3, #leftContent h4, #leftContent p, #leftContent p a { color: #818185 !important; }
#leftContent h2 { font-size: 11pt; display: block; width: 258px; height: 93px;  background-image: url(/site_images/Welcome_to_onga_pumpshop.gif); background-repeat: no-repeat; margin-top: 20px; margin-left: 15px; text-indent: -9999px;} 
#flyLonga h2 { margin-left: 25px;display: block; width: 258px; height: 344px;  background-image: url(/site_images/FlyLongaCompetitionTitle.jpg) !important; background-repeat: no-repeat; }

#leftContent p {font-size: 8pt; margin-top: 0px; padding-top: 10px; margin-left: 15px; width: 240px;}
.faderIMG { border: 0 none #ffffff; width: 0px;}
#showcaseImages { float: left; width: 0px; background-repeat: no-repeat;}
#showcaseImages a { display: block; border: 0 none #ffffff !important;}
#signPosts { border-bottom: 1px solid #666666; padding-bottom: 5px; float: left; }
#topRow { border-bottom: 1px solid #666666; padding-bottom: 5px; float: left;}
#pumpResources {float: left; margin-top: 5px; background-color: #808285; color: #ffffff; padding: 10px 10px 10px 10px; width: 293px; height: 69px; background-image: url(/site_images/resourcesArrow.gif); background-repeat: no-repeat; background-position: right center; }
#pumpResources h2 { display: block; height: 40px; background-image: url(/site_images/pump_resources.gif); background-repeat: no-repeat; text-indent: -9999px; margin-top: 0; padding-top: 0;}
.signPost { float: left; width: 155px; height: 89px; overflow: hidden; margin-left: 5px; margin-top: 5px;}
.signPost a img { border: none 0px #ffffff; }

/*  ##################### Promo Page Resources  ######################## */

.longContent { padding-top: 15px;}
.longContent p {padding-top: 10px; margin-left: 25px !important; }
#leftContent p a img { border: none 0px #ffffff; }

#pumpResourcesSmall {float: left; margin-top: 5px; background-color: #808285; color: #ffffff; padding: 0px 10px 0px 10px; width: 293px; height: 26px; background-image: url(/site_images/resourcesArrow-small.gif); background-repeat: no-repeat; background-position: right center; }
#pumpResourcesSmall h2 { display: block; height: 26px; text-indent: -9999px; margin-top: 0; padding-top: 0;}
.signPostSmall { float: left; width: 155px; height: 26px; overflow: hidden; margin-left: 5px; margin-top: 5px;}
.signPostSmall a img { border: none 0px #ffffff; }

/*  ##################### Video Page Resources  ######################## */

#videoContainer {background-color: #f6f6f6; float: left;} 

#videoArea { float: left; width: 0px; background-repeat: no-repeat; }
#videoSelector { float: left; width: 0px; background-repeat: no-repeat; }
#mediaItems { float: left; overflow: hidden; }
#mediaTitle { float: left; overflow: hidden; }
#mediaTitle h2 { color: #03519f; font-size: 14pt; padding-top: 10px;}
#promoImage { margin-left: 25px; position: absolute; bottom: 25px;}

#mediaItems p { text-align: right; }

/*  ##################### Dealer Locator Page Resources  ######################## */

#searchResults { background-color: #f6f6f6; float: left; } 

.resultEntry { padding-left: 15px; float: left; margin: 10px 10px 10px 10px; background-color: #eeeeee; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; border-right: 1px solid #cccccc; border-left: 1px solid #cccccc;}
.resultEntryLeft {  margin-right: 10px; }
.resultEntryMiddle { border-bottom: 1px solid #cccccc; }
.resultEntry h4 { color: #03519f; margin-bottom: 3px;}
.distance { font-size: 7pt; margin-top: 0px;}

/*  ##################### Product Page Resources  ######################## */

#productLeftContent { background-color: #0351a0; float: left; width: 313px; height: 360px; color: #ffffff; margin-right: 5px;  position: relative;}
#productLeftContent h1, #leftContent h2, #leftContent h3, #leftContent h4, #leftContent p, #leftContent p a { color: #ffffff; }
#productLeftContent h2 { font-size: 11pt; display: block; width: 258px; height: 50px;  background-image: url(/site_images/products-title.gif); background-repeat: no-repeat; margin-top: 30px; margin-left: 25px; text-indent: -9999px;} 
#productLeftContent p {font-size: 8pt; margin-top: 0px; padding-top: 10px; margin-left: 15px; width: 240px;}
#productLeftContent ul { padding-left: 0; margin-left: 25px;}
#productLeftContent ul li { width: auto; list-style-type: none; color: #ffffff; padding-bottom: 2px; padding-right: 30px;}
#productLeftContent ul li a { padding-right: 30px; font-size: 16px; font-weight: 500; color: #ffffff; }
#productLeftContent ul li a:hover {text-decoration: none; color: #cccccc; }

#productRightContainer { background-color: #f6f6f6; float: left; padding-top: 30px; padding-left: 30px;} 
.productItem { margin-right: 5px; margin-bottom: 20px; border-bottom: 2px solid #d9dadc; padding-bottom: 2px; float: left; width: 97px; height: 77px; overflow: hidden;}
.productItemInner { text-align: center; position: relative;  width: 97px; height: 77px; overflow: hidden; }
.productOverlay { width: 97px; height: 77px; position: absolute; top: 0; left: 0; background-image: url(/site_images/productOverlay.png); background-repeat: repeat-x; background-position: 0 0 ; }
.productOverlay h3 { color: #ffffff; margin-top: 20px; font-weight: 400; font-size: 14px; }
#productDetails {  float: left; overflow: hidden;}
#productColumn1, #productColumn2 { width: 230px;   float: left; }
#productColumn1 { margin-right: 10px; }
#productColumn1 p { text-align: center ; }
#productColumn1 ul { margin-top: 0 ; margin-left: 5px; padding-left: 5px; text-indent:0; margin-bottom: 5px;}
#productColumn1 ul li { font-size: 8pt; margin-left: 0 ; padding-left: 5px;}
#productColumn1 h3 { text-transform: uppercase; color: #0351a0; margin-top: 0; margin-bottom: 2px; font-size: 9pt;} 

#productColumn2 p { text-align: center ; }
#productColumn2 ul { margin-top: 0 ; margin-left: 14px; padding-left: 0px; text-indent:0; margin-bottom: 5px;}
#productColumn2 ul li { font-size: 8pt; margin-left: 0px ; padding-left: 0;}
#productColumn2 h3 { text-transform: uppercase; color: #0351a0; margin-top: 0; margin-bottom: 2px; font-size: 9pt;} 
#productTitle { display: inline; height: 1px; line-height: 0; text-indent: -9999px; margin: 0 0 ; padding: 0 0; background-image: url('') !important;}
.productTitleImg { padding-left: 20px; }
#productOutline { position: relative ; width: 265px; top: 10px;}
.productHero { margin-left: 25px; }
#productOutline p { margin-top: 0 ; padding-top: 0; }
#productOutline h2 { height: 1px; width: 1px; text-indent: -9999px; margin: 0 0 0 0 !important; padding: 0 0 0 0 !important; }
#otherProducts {margin-left: 25px; margin-top: 20px;  display: table; padding-left: 25px; background-color: #f6f6f6; background-image: url(/site_images/otherproducts-arrow.gif); background-position: left center; background-repeat: no-repeat;  width: 235px; height: 30px; color: #000000;}
#otherProducts ul { display: table; vertical-align: middle; font-size: 7pt; color: #000000; width: 240px; }
.parentProduct {color: #0351a0; text-transform: uppercase; }
.siblingSet { margin:  auto 0 auto 0 !important; padding: 4px 0 0 0 !important; list-style-type: none; float: left;  }
.siblingSet li { float: left; padding-right: 5px; }
.siblingSet li a { color: #000000; } 
.siblingSet li a:hover { text-decoration: underline; }
.productLink { font-size: 8pt; }
.productLink a { color: #000000; } 
.productLink a:hover { text-decoration: underline; }

/* ##########################  Dealer Locator  ##############################  */
#DealerLocator h2 { display: block; width: 258px; height: 91px; padding-bottom: 0; margin-bottom: 0; background-image: url(/site_images/dealer-title.gif); background-repeat: no-repeat; margin-top: 30px; margin-left: 25px; text-indent: -9999px; }
#DealerLocatorForm  { margin-left: 25px; }
             
.dealerCard {overflow: hidden;  height: 140px; width: 190px; padding-left: 10px; padding-right: 10px;  float: left; border: 1px solid #aaaaaa; background-colour: #cccccc; margin:  5px 15px 5px 0px; } 
.dealerCard p { font-size: 10px; color: #666666; }
.dealerCard p a { font-size: 10px; color: #333333; }
.mapLink { font-size: 7px !important; }
#dealerRightContainer { background-color: #f6f6f6; float: left; padding-top: 15px; padding-left: 15px;} 
.dealerDistance { font-size: 7px; color: #aaaaaa; }

#dealerDetailsShell { width: 100%; }
#dealerDetailsShellInner { margin: 20px auto ; width: 500px; overflow: hidden; }
#headerLogo { display: block;  width: 200px; margin: 0 0; float: left;}
#headerLogo h1 { margin: 0 0; padding: 0 0 ; }
#mainlogo {  display: block; width: 118px; height: 82px; background-image: url(/site_images/onga_pumpshop_logo.gif); background-repeat: no-repeat; text-indent: -9999px;}

#detailsDiv { width: 500px; }
#dealerDetailsInner { width: 280px;  background-color: #f6f6f6; float:left; padding-left: 20px; margin-bottom: 20px;}
#dealerDetailsInner .dealerTitle { font-size: 10pt; font-weight: 700; }
#dealerDetailsInner p { font-size: 8pt; font-weight: 200; color: #666666; }
#dealerDetailsInner p a { font-size: 8pt; color: #333333; }
#googleMapDiv {width: 500px; height: 350px; }
#locatorFooter { width: 500px; }
#locatorFooter p { float: right; text-align: right; }

/* #############################  Search Results  ################################  */

#textSearchResults h2 { display: block; width: 258px; height: 91px; padding-bottom: 0; margin-bottom: 0; background-image: url(/site_images/searchresults.gif); background-repeat: no-repeat; margin-top: 30px; margin-left: 25px; text-indent: -9999px; }
#searchRightContainer { background-color: #f6f6f6; float: left; padding-top: 15px; padding-left: 15px;} 

#searchRightContainer p {text-align: center; font-size: 8pt !important; float: left;}
#searchRightContainer p a {color: #333333;font-size: 8pt !important; }
.searchResultItem { margin: 10px; margin-right: 20px;border: 1px solid #cccccc; padding: 5px 10px 5px 10px; float: left; background-color: #f0f0f0; width: 160px;} 
.searchResultItem h4 { margin-top: 0; margin-bottom: 0; font-size: 11pt; color: #333333;}
.searchResultItem h4 a { font-size: 11pt; color: #333333;}
.searchResultItem p { font-size: 8pt; color: #333333;}

/* ############################### Text Pages ###################################### */
#textRightContainer { background-color: #f6f6f6; float: left; padding-top: 15px; padding-left: 15px; } 
#textRightContainer p { font-size: 10px; color: #333333; margin-right: 15px;}
#textRightContainer h4 { margin-top: 0;font-size: 12px; margin-bottom: 0; font-size: 11pt; color: #333333;}
#textRightContainer p a { font-size: 10px !important; color: #333333; font-weight: 700; }

/* ################################ Click and Collect ############################## */

#selectedStore {text-align: left; display: block; width: 190px; font-weight: 800; padding-top: 6px;padding-right: 5px; float: left; font-size: 8pt; color: #333333; vertical-align: middle;}
.collectLabel {text-align: right; display: block; width: 90px;padding-top: 6px;padding-right: 5px; float: left; font-size: 8px; color: #333333;vertical-align: middle;}
.collectLabelLeft {text-align: left; display: block; padding-top: 6px;padding-right: 5px; float: left; font-size: 8px; color: #333333;vertical-align: middle;}

#reserve, #quote {
    width: auto !important;
    margin-left: 90px;
}
#collectionForm { width: 300px; margin-top: 5px;height: 470px;}
#collectionForm h4 { margin-top: 10px; }
#collectionForm div { display: block; width: 300px; float: left; margin-top: 3px; margin-bottom: 8px;}
#collectionForm div input, #collectionForm div select {width: 190px; float: left; font-size: 7pt; color: #666666; margin-top: 3px;}
#storeDetails { width: 0px; float: left; overflow: hidden; height: 80px;}
#storeMap { width: 0px; float: left; overflow: hidden;}
#nearestStores { display: block; overflow: hidden; width: 450px; height: 0; float: left;}
.collectionCard {overflow: hidden;  height: 90px; width: 180px !important; padding-left: 10px; padding-right: 10px;  float: left !important; border: 1px solid #aaaaaa; background-color: #eeeeee; margin:  5px 15px 5px 0px; } 
.collectionCard p { font-size: 8pt; color: #666666; }
.collectionCard p a { font-size: 8pt; color: #333333; }
#collectionStore { overflow: hidden; height: 30px; width: 1px; }
#collectionForm div input { padding-left: 2px; }
.fieldError { border: 1px solid #ff0000 !important; color: #ff0000 !important; padding-top: 2px; padding-bottom: 2px; padding-left: 3px !important;}
.labelError { color: #ff0000 !important; }

.ShortPara { width: 270px; }
.formSection { margin-bottom: 10px; }
.formSection table { border-top: 1px solid #666666; border-left: 1px solid #666666; border-right: 1px solid #666666;}
.orderLabel { background-color: #dddddd; font-size: 8pt; color: #333333; width: 100px;border-bottom: solid 1px #666666; border-right: solid 1px #666666;}
.orderDetail { background-color: #f4f4f4; font-size: 8pt; color: #666666; width: 200px;border-bottom: solid 1px #666666;}       
.alignTop { vertical-align: top ;}         

/* ################################ StarCash Promo ########################## */
#starcash h2 {display: block; width: 258px; height: 91px; padding-bottom: 0; margin-bottom: 0; background-image: url(/site_images/Onga-Rewards.gif); background-repeat: no-repeat; margin-top: 30px; margin-left: 25px; text-indent: -9999px; }
#confirmterms {width: 30px !important; margin-top: 15px !important; }
.widePromoLabel {text-align: left; display: block; float: left; width: 370px; margin-top: 10px; padding-top: 6px;padding-right: 5px; font-size: 8pt; color: #333333;vertical-align: middle;}
.widePromoLabel a { color: #333333;  font-weight: 600; text-decoration: none;}
.widePromoLabel a:hover { text-decoration: underline; }
.promoLabel {text-align: right; display: block; float: left; width: 120px;padding-top: 6px;padding-right: 5px; font-size: 8pt; color: #333333;vertical-align: middle;}
#promoForm div input { float: left; width: 250px; font-size: 7pt; color: #666666; margin-top: 3px; margin-right: 0;}
#promoForm div select { float: left; width: 256px; font-size: 7pt; color: #666666; margin-top: 3px; margin-right: 0;}
#promoForm div textarea { float: left; height: 50px; width: 250px; font-size: 7pt; color: #666666; margin-top: 3px;}
.promoFormSection { margin-bottom: 10px; }
#promoForm h4 { margin-top: 10px; float: left;}
#promoForm div { display: block; width: 410px; margin-top: 3px; margin-bottom: 8px; float: left;}
#promoForm {width: 400px; float: left;}
#starCashSubmit {float: left; margin-right: 100px; margin-top: 10px;}
#flyLongaSubmit {float: left; margin-left: 100px; margin-top: 10px; width: 150px !important;}

.promoResultLabel { background-color: #dddddd; font-size: 8pt; color: #333333; width: 130px;border-bottom: solid 1px #666666; border-right: solid 1px #666666;}
.promoResultDetail { background-color: #f4f4f4; font-size: 8pt; color: #666666; width: 250px;border-bottom: solid 1px #666666;}   
#promoFooter { display: block;  width: 300px;  float: left;} 

/* ################################# Click and collect in-page ################ */
#clickAndCollect {width: 220px; margin-left: 10px; margin-top: 20px;}
#clickAndCollect h3 { color: #16a0b0; font-size: 10pt; margin-bottom: 10px;}
.collectItemOff { padding-top: 3px; height: 20px; background-image: url(/site_images/candc-off.gif); background-repeat: no-repeat; background-position: 2px 3px; }
.collectItemOff p { margin-top: 0px !important; margin-bottom: 0px !important;text-align: left !important; font-size: 10pt; margin-left: 15px !important;}
.collectItemOff p a { color: #0b51a1; text-decoration: none;}
.collectItemOff p a:hover { text-decoration: underline;} 
.collectItemOn { padding-top: 3px; margin-bottom: 2px; height: 20px; background-image: url(/site_images/candc-on.gif); background-repeat: no-repeat; background-position: 2px 3px; background-color: #0c51a2; }
.collectItemOn p { float: left; width: 100px;color: #ffffff; margin-top: 0px !important; margin-bottom: 0px !important;text-align: left !important; font-size: 10pt; margin-left: 15px !important;}
.collectItemOn p a { color: #ffffff; text-decoration: none;}
.collectItemOn p a:hover { text-decoration: underline;} 
.collectItemOn p.onOffer { float: left; color: #16a0b0; text-align: right; width: 80px;}