/*--------------------------------------------------------------------------------------- Website: Mer Author: Allen Design Group Created: August 2009 ---------------------------------------------------------------------------------------*/ @import "default.css"; @import "slider.css"; body { background: #fff;} /*--------------------------------------------------------------------------------------- Base Typography ---------------------------------------------------------------------------------------*/ /*------------------------------------ Links ------------------------------------*/ a:link { color: #fff; background: transparent;} a:visited { color: #fff; background: transparent;} a:hover { color: #e22027; text-decoration: none; background: transparent;} #footer a { color: #939598;} #footer a:hover { color: #5eb0e6; background: transparent;} /* Backlink */ .backLink { overflow: hidden; margin-bottom: 1.4em; padding-left: 9px;} .productsPage .backLink { margin-bottom: 0;} .wheretobuyPage .backLink { padding-left: 0;} .backLink a { background: #e22027; color: #fff; font-weight: bold; text-decoration: none; padding: 3px 10px; float: left; width: auto;} .backLink a:hover { color: #e22027; background: #fff;} /*------------------------------------ Type ------------------------------------*/ body { font: 62.5% arial, tahoma, arial, helvetica; color: #000;} #containerWrapper, #footerWrapper { font-size: 1.2em; line-height: 1.4em; text-align: left; z-index: 2;} #footer { color: #939598;} p { padding: 0 0 1.4em 0;} #mainCol, #sideCol { color: #fff; background: transparent;} /*------------------------------------ Headers ------------------------------------*/ #footer h6 { color: #e22027; font-size: 1em; font-weight: bold; background: transparent;} /*h1 { float: right; margin: 55px 0 0 0; color: #5eb0e6; width: 750px; text-align: right; font-size: 2.4em; word-spacing: -5px;}*/ h1 { float: left; margin: 55px 0 0 0; padding-left: 192px; color: #5eb0e6; width: 592px; font-size: 2.5em; } body.homePage h1, body.knowledgePage h1, body.newsPage h1 { padding-left: 192px; width: 592px;} h2 { font-size: 1.6em; line-height: 1.4em; padding: 0 0 15px 0; color: #e22027; font-weight: bold; background: transparent;} h3 { font-size: 1.6em; line-height: 1.4em; color: #e22027; font-weight: bold; background: transparent; margin-top: 25px; padding-bottom: 10px;} h4 { font-size: 1.2em; line-height: 1.4em; color: #fff; font-weight: bold; background: #e22027; padding: 3px 10px;} /*--------------------------------------------------------------------------------------- Layout ---------------------------------------------------------------------------------------*/ /*------------------------------------ Container ------------------------------------*/ #container:after, #footer:after {content: ""; display: block; height: 0; clear: both; visibility: hidden;} #container, #footer { width: 980px; margin: 0 auto;} #containerWrapper { background: url('../images/bg.png') repeat-x #5eb0e6; min-height: 500px; min-width: 980px;} /*------------------------------------ Header ------------------------------------*/ #header { overflow: hidden;} img#logo { float: left; margin: 22px 0 0 40px;} /*------------------------------------ Search ------------------------------------*/ #search { float: right; margin: 20px 0 0 0; width: auto;} #search div { display: inline;} #search .input { width: 137px; height: 18px; padding: 2px 5px 2px 25px; background: url('../images/search-input.png') no-repeat; border: 0; vertical-align:top; margin-right: 3px; font-size: 1.2em; color: #585b60;} #search .input.blur { font-size: .9em; color: #939598; width: 137px; height: 16px; padding: 4px 5px 2px 25px;} #search .submit { width: 21px; height: 22px; background: url('../images/search-submit.png') no-repeat; text-indent: -9999px; margin: 0; vertical-align:top;} #search .submit:hover { background-position: top right;} #mailinglist { float: right; margin: 20px 2px 0 0; width: auto; position: relative;} #mailinglist #txtEmailAddress { width: 137px; height: 18px; padding: 2px 5px 2px 25px; background: url('../images/search-input.png') no-repeat; border: 0; vertical-align:top; margin-right: 3px; font-size: 1.2em; color: #585b60; float: left;} #mailinglist #txtEmailAddress.blur { font-size: .9em; color: #939598; width: 137px; height: 16px; padding: 4px 5px 2px 25px;} #mailinglist #lblTopMailingListThanks { position: absolute; top: 30px; left: 0; background: #e22027; color: #fff; display: block; padding: 2px 10px;} #mailinglist .submit { width: 21px; height: 22px; background: url('../images/search-submit.png') no-repeat; text-indent: -9999px; margin: 0; vertical-align:top;} #mailinglist .submit:hover { background-position: top right;} #mailinglist #txtEmailAddress.blur { color:#939598;} /*------------------------------------ Cols ------------------------------------*/ #cols:after {content: ""; display: block; height: 0; clear: both; visibility: hidden;} #cols {display:inline-block; padding: 25px 0 50px; width: 980px;} #mainCol { float: left; width: 590px;} #sideCol { float: left; width: 390px;} #innermainCol { float: left; padding: 0 9px 0 9px; width: 569px;} #innersideCol { float: left; width: auto;} /*------------------------------------ Footer ------------------------------------*/ #footer { padding: 20px 0; font-size: .9em;} #footerProducts { float: left; width: 320px; padding-left: 50px} #footerProducts ul { overflow: hidden; list-style: none; margin: 0;} #footerProducts ul li { float: left; width: 45%; padding: 0 5% 0 0;} #footerProducts ul li a.selected { background: #e22027; color: #fff; text-decoration: none; padding: 0 2px;} #footerInfo { float: left; width: 420px; padding-left: 20px;} #icons { overflow: hidden;} a#facebook { display: block; width: 94px; height: 28px; background: url('../images/facebook.png') no-repeat !important; text-indent: -9999px; overflow: hidden; margin-top: 15px; float: left; margin-right: 15px;} img.autoexpress { float: left; margin-top: 15px;} #copyright { margin-top: 17px;} #footerLinks { float: left; width: 150px; padding-left: 15px;} #design { margin-top: 17px;} /*--------------------------------------------------------------------------------------- Content ---------------------------------------------------------------------------------------*/ /*------------------------------------ Home Page ------------------------------------*/ body.homePage #innermainCol{ padding: 0; width: auto;} #sideColInfo { padding: 25px 0 0 55px; width: 315px; font-size: 1.2em;} body.homePage { } body.homePage #videoContainer { width: 245px; height: 244px; padding: 16px 21px 0; margin-top: 20px; background: url('../images/home/videoFeatureContainer.png') no-repeat; float: right; position: relative;} body.homePage #videoContainer h3 { width: 192px; height: 23px; background: url('../images/home/vidchannel.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-bottom: 11px; margin-top: 0;} body.homePage #videoContainer .vid { position: relative;} body.homePage #videoContainer .thumb { border: 1px solid #fff; margin-bottom: 5px;} body.homePage #videoContainer .vid a span { position: absolute; top: 0; left: 0; display: block; width: 243px; height: 141px; background: url('../images/home/vidoverlay.png') no-repeat; text-indent: -9999px; overflow: hidden; cursor: pointer;} body.homePage #videoContainer .vid a:hover span { background-position: bottom left;} body.homePage #videoContainer .abstract { color: #2b72a1; font-weight: bold;} body.homePage #videoContainer .watchmore { display: block; width: 120px; height: 23px; background: url('../images/home/watchmore.png') no-repeat; position: absolute; top: 226px; left: 146px; text-indent: -9999px; overflow: hidden;} body.homePage #videoContainer .watchmore:hover { background-position: bottom left;} body.homePage #questionContainer { width: 287px; height: 123px; background: url('../images/home/questionContainer.png') no-repeat; float: left; margin-top: 20px; position: relative;} body.homePage #questionContainer h3 { width: 129px; height: 58px; background: url('../images/home/havequestion.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 16px; left: 139px; margin-top: 0;} body.homePage #questionContainer a { display: block; width: 133px; height: 23px; background: url('../images/home/askexpert.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 89px; left: 134px;} body.homePage #questionContainer a:hover { background-position: bottom left;} body.homePage #stockistContainer { width: 287px; height: 123px; background: url('../images/home/stockistContainer.png') no-repeat; float: left; margin-top: 14px; position: relative;} body.homePage #stockistContainer h3 { width: 183px; height: 54px; background: url('../images/home/findstockist.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 16px; left: 85px; margin-top: 0;} body.homePage #stockistContainer a { display: block; width: 78px; height: 23px; background: url('../images/home/search.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 89px; left: 190px;} body.homePage #stockistContainer a:hover { background-position: bottom left;} /*body.homePage #facebookfan { width: 245px; height: 244px; padding: 16px 21px 0; margin-top: 20px; background: url('../images/home/facebookContainer.png') no-repeat; float: right; position: relative;} body.homePage #facebookfan h3 { width: 245px; height: 87px; background: url('../images/home/facebookwin.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-top: 30px; margin-bottom: 11px; margin-top: 0;} body.homePage #facebookfan a#facebookterms { display: block; width: 83px; height: 17px; position: absolute; top: 139px; right: 23px; background: url('../images/home/facebookterms.png') no-repeat; text-indent: -9999px; overflow: hidden;} body.homePage #facebookfan a#becomefan { display: block; width: 137px; height: 43px; background: url('../images/home/becomeafan.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 184px; left: 121px;} body.homePage #facebookfan a#becomefan:hover { background-position: bottom left;} */ body.homePage #win { width: 245px; height: 244px; padding: 16px 21px 0; margin-top: 20px; background: url('../images/home/winContainer.png') no-repeat; float: right; position: relative;} body.homePage #win h3 { width: 245px; height: 87px; background: url('../images/home/facebookwin.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-top: 20px; margin-bottom: 11px;} body.homePage #win a.terms { display: block; width: 83px; height: 17px; position: absolute; top: 139px; right: 23px; background: url('../images/home/facebookterms.png') no-repeat; text-indent: -9999px; overflow: hidden;} body.homePage #win a.link { display: block; width: 116px; height: 41px; background: url('../images/home/register_newsletter.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 175px; left: 151px;} body.homePage #win a.link:hover { background-position: bottom left;} body.homePage #homecontentContainer { float: left; margin-top: 20px; width: 589px; background: url('../images/home/content_bottom.png') no-repeat bottom left;} body.homePage #homecontent { width: 529px; padding: 30px 30px 30px; background: url('../images/home/content_top.png') no-repeat; font-size: 1.1em; position: relative; overflow: hidden;} body.homePage #homecontent .intro { font-weight: bold;} body.homePage #homecontent .readmore { display: block; width: 110px; height: 23px; background: url('../images/home/readmore.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; bottom: 15px; right: 30px; cursor: pointer;} body.homePage #homecontent .readmore:hover { background-position: bottom left;} body.homePage #homecontent .close { display: block; width: 66px; height: 23px; background: url('../images/home/close.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; bottom: 15px; right: 30px; cursor: pointer;} body.homePage #homecontent .close:hover { background-position: bottom left;} /*------------------------------------ Knowledge Pages ------------------------------------*/ body.knowledgePage #innermainCol { padding:0; width:100%;} body.knowledgePage h2 { padding-bottom: 10px;} /* Ask Expert */ #askexpertContainer { width: 562px; height: 174px; padding: 24px 0 0 27px; background: url('../images/knowledge/askexpertContainer.png') no-repeat; position: relative; z-index: 9999;} #askexpertContainer h3 { display: block; width: 302px; height: 27px; background: url('../images/knowledge/askourexpertsaquestion.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-bottom: 14px; margin-top: 0;} #askexpertContainer #questionform { overflow: hidden;} #askexpertContainer #questionform .input { background: url('../images/knowledge/input.png') no-repeat; width: 525px; padding: 14px 10px 14px 10px; color: #fff; font-size: 2em; font-family:Verdana, Geneva, sans-serif; float: left; border: 0;} #askexpertContainer #questionform .submit { width: 80px; height: 57px; background: url('../images/knowledge/search.png') no-repeat; text-indent: -9999px; overflow: hidden; float: left; margin: 0 0 0 26px; padding: 0;} #askexpertContainer #questionform .submit:hover { background-position: bottom left;} #askexpertContainer p { color: #1a618d; padding: 10px 0 0 5px; width: 450px;} /* Ask Expert Ajax Search */ #suggestions{ width:530px; position: absolute; top: 123px; left: 28px; max-height: 400px; background: #daecfa; overflow: auto; border: 1px solid #fff; color: #29749e; display: none; z-index: 99;} #suggestions .item { } #suggestions .item p { width: auto !important;} #suggestions .item a { text-decoration: none; display: block; border-bottom: 1px solid #40769a; padding: 15px;} #suggestions .item a:hover { background: #cddfed; } #suggestions .item a span.question { font-size: 1.2em; color: #1a3a4f; display: block; font-weight: bold;} #suggestions .item a span.answer { color: #29749e; display: block; margin-top: 5px;} #suggestions #noanswer { padding: 5px 15px; background: #eff6fb; color: #1a3a4f; font-weight: bold;} #suggestions #noanswer a { color: #29749e; font-weight: normal; margin-left: 10px;} /* SEARCHRESULTS */ #searchresults { border-width:1px; border-color:#919191; border-style:solid; width:320px; background-color:#a0a0a0; font-size:10px; line-height:14px; } #searchresults span.seperator { float:right; padding-right:15px; margin-right:5px; background-image:url(../images/shortcuts_arrow.gif); background-repeat:no-repeat; background-position:right; } #searchresults span.seperator a { background-color:transparent; display:block; margin:5px; height:auto; color:#ffffff; } /* Facebook */ body.knowledgePage #facebookfanFeature { width: 245px; height: 304px; padding: 16px 21px 0; margin-top: 20px; background: url('../images/knowledge/facebookContainer.png') no-repeat; float: left; position: relative;} body.knowledgePage #facebookfanFeature h3 { width: 245px; height: 87px; background: url('../images/home/facebookwin.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-top: 20px; margin-bottom: 11px; margin-top: 0;} body.knowledgePage #facebookfanFeature a { display: block; width: 137px; height: 43px; background: url('../images/home/becomeafan.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 234px; left: 121px;} body.knowledgePage #facebookfanFeature p { color: #1A618D;} body.knowledgePage #facebookfanFeature a:hover { background-position: bottom left;} /* Video Container */ body.knowledgePage #videoFeatureContainer { width: 245px; height: 304px; padding: 16px 21px 0; margin-top: 20px; background: url('../images/knowledge/videoFeatureContainer.png') no-repeat; float: left; position: relative;} body.knowledgePage #videoFeatureContainer h3 { width: 192px; height: 23px; background: url('../images/knowledge/vidchannel.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-bottom: 11px; margin-top: 0;} body.knowledgePage #videoFeatureContainer .vid { position: relative;} body.knowledgePage #videoFeatureContainer .thumb { border: 1px solid #fff; margin-bottom: 10px;} body.knowledgePage #videoFeatureContainer .vid a span { position: absolute; top: 0; left: 0; display: block; width: 243px; height: 141px; background: url('../images/knowledge/vidoverlay.png') no-repeat; text-indent: -9999px; overflow: hidden; cursor: pointer;} body.knowledgePage #videoFeatureContainer .vid a:hover span { background-position: bottom left;} body.knowledgePage #videoFeatureContainer .abstract { color: #2b72a1; } body.knowledgePage #videoFeatureContainer .watchmore { display: block; width: 120px; height: 23px; background: url('../images/knowledge/watchmore.png') no-repeat; position: absolute; top: 283px; left: 146px; text-indent: -9999px; overflow: hidden;} body.knowledgePage #videoFeatureContainer .watchmore:hover { background-position: bottom left;} #videochannelContainer { width: 554px; height: 486px; padding: 28px 33px 0; background: url('../images/knowledge/videoContainer.png') no-repeat; position: relative;} #videochannel { overflow: hidden; margin-left: -30px;} #videochannel .vid { position: relative; float: left; height: 190px; margin-left: 30px; width: 245px;} #videochannel .thumb { border: 1px solid #fff; margin-bottom: 5px;} #videochannel .vid a span { position: absolute; top: 0; left: 0; display: block; width: 243px; height: 141px; background: url('../images/home/vidoverlay.png') no-repeat; text-indent: -9999px; overflow: hidden; cursor: pointer;} #videochannel .vid a:hover span { background-position: bottom left;} #videochannel .abstract { color: #2b72a1; font-weight: bold;} #videochannel .abstract span { float: right; font-weight: normal;} #videochannelContainer .nextpage { display: block; width: 105px; height: 23px; background: url('../images/knowledge/nextpage.png') no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; left: 447px;} #videochannelContainer .nextpage:hover { background-position: bottom left;} #videoform { overflow: hidden; padding-bottom: 30px;} #videoform label { float: left;} #videoform select {width: 248px; color: #1c618b; float: left; margin-left: 10px;} #videoform .submit { width: 78px; height: 23px; background: url('../images/knowledge/search2.png') no-repeat; text-indent: -9999px; overflow: hidden; padding: 0; float: left; margin: 0 0 0 20px;} #videoform .submit:hover { background-position: bottom left;} /* MSDS Feature */ body.knowledgePage #msdsFeatureContainer { width: 245px; height: 304px; padding: 16px 21px 0; margin-top: 20px; background: url('../images/knowledge/videoFeatureContainer.png') no-repeat; float: left; position: relative;} body.knowledgePage #msdsFeatureContainer h3 { margin-top: 0;} body.knowledgePage #msdsFeatureContainer h3 a { display: block; width: 123px; height: 28px; background: url('../images/knowledge/safetydata.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-bottom: 6px; margin-top: 0;} body.knowledgePage #msdsFeatureContainer .info { position: relative; float: left; width: 245px;} body.knowledgePage #msdsFeatureContainer .thumb { border: 1px solid #fff; margin-bottom: 10px;} body.knowledgePage #msdsFeatureContainer .abstract { color: #2b72a1; } body.knowledgePage #msdsFeatureContainer .download { display: block; width: 101px; height: 23px; background: url('../images/knowledge/download.png') no-repeat; position: absolute; top: 280px; left: 146px; text-indent: -9999px; overflow: hidden;} body.knowledgePage #msdsFeatureContainer .download:hover { background-position: bottom left;} /* Top Tips */ body.knowledgePage #toptipsFeatureContainer { width: 245px; height: 304px; padding: 16px 21px 0; margin-top: 20px; background: url('../images/knowledge/videoFeatureContainer.png') no-repeat; float: right; position: relative;} body.knowledgePage #toptipsFeatureContainer h3 { width: 88px; height: 29px; background: url('../images/knowledge/toptips.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-bottom: 5px; margin-top: 0;} body.knowledgePage #toptipsFeatureContainer img { position: relative; border: 1px solid #fff; margin-bottom: 10px;} body.knowledgePage #toptipsFeatureContainer p { color: #2b72a1; padding-bottom: 4px;} body.knowledgePage #toptipsform { } body.knowledgePage #toptipsform select { width: 248px; color: #1c618b;} body.knowledgePage #toptipsform .submit { width: 78px; height: 23px; background: url('../images/knowledge/search2.png') no-repeat; text-indent: -9999px; overflow: hidden; padding: 0; position: absolute; top: 283px; left: 187px; margin: 0;} body.knowledgePage #toptipsform .submit:hover { background-position: bottom left;} #toptipsContainer { width: 562px; height: 194px; padding: 24px 0 0 27px; background: url('../images/knowledge/toptipsContainer.png') no-repeat; position: relative;} #toptipsContainer h3 { width: 88px; height: 29px; background: url('../images/knowledge/toptips.png') no-repeat; text-indent: -9999px; overflow: hidden; margin-bottom: 5px; margin-top: 0; padding-bottom: 0;} #toptipsContainer .clear { overflow: hidden;} #toptipsContainer .img { float: left; border: 2px solid #fff; width: 243px; margin-right: 20px;} #toptipsContainer p { float: left; width: 285px; color: #1c618b;} #toptipsContainer #toptipsform { float: left; width: 285px;} #toptipsContainer #toptipsform select { width: 275px;} #toptipsContainer #toptipsform .submit { top: 177px; left: 490px;} /* FAQ and Top Tips Accordian */ dl#faq, dl#toptips { width: 100%;} dl#faq dt, dl#toptips dt { overflow: hidden; font-weight: bold; font-size: 1.2em; background: url('../images/bg-line.gif') repeat-x top left; padding: 7px 0 4px 20px; position: relative;} dl#faq dt.cursor, dl#toptips dt.cursor { cursor: pointer;} dl#faq dt .faqarrow, dl#toptips dt .faqarrow { float: left; padding: 3px 10px 0 0; width: auto; position: absolute; top: 8px; left: 0;} dl#faq dt span, dl#toptips dt span { float: right; background: #e22027; color: #fff; font-weight: bold; text-decoration: none; padding: 1px 5px; cursor: pointer; font-size: 12px; width: auto;} dl#faq dt span:hover, dl#toptips dt span:hover { color: #e22027; background: #fff;} dl#faq dt.nospan, dl#toptips dt.nospan { cursor: default !important} dl#faq dt.nospan span, dl#toptips dt.nospan span { display: none;} dl#faq dd, dl#toptips dd { padding: 3px 0 0 20px;} /* Material Safety Data Sheets */ #msds { overflow: hidden; } #msds .item { background: url('../images/bg-line.gif') repeat-x top left; padding: 7px 0 4px 0; overflow: hidden; } #msds .item div { float: left; width: 454px; background: url('../images/arrow.png') no-repeat 0 4px; padding-left: 20px; font-size:1.2em; font-weight: bold;} #msds .item div span { font-size: .9em; font-weight: normal; padding-left: 7px;} #msds .item a { background: #e22027; color: #fff; font-weight: bold; text-decoration: none; padding: 1px 5px; cursor: pointer; font-size: 12px; float: right;} #msds .item a:hover { color: #e22027; background: #fff;} /*------------------------------------ News Page ------------------------------------*/ body.newsPage #innermainCol { padding:0; width:100%;} div.newstabs { background: url('../images/news/newsContainer.png') no-repeat bottom left; min-height: 352px; padding: 15px 29px 0;} ul.newstabsnav { background: url('../images/news/newstabsnav.png') no-repeat bottom left; width: 587px; margin: 0; padding: 0 0 7px 0; list-style: none; overflow: hidden;} ul.newstabsnav li { float: left; display: inline; padding: 0; margin: 0;} ul.newstabsnav li a { display: block; height: 46px; text-indent: -9999px; overflow: hidden; outline: 0;} ul.newstabsnav li.nav-ournews a { background: url('../images/news/ournews.png') no-repeat; width: 134px;} ul.newstabsnav li.nav-ournews a:hover { background-position: 0 -46px;} ul.newstabsnav li.nav-ournews a.selected { width: 119px; background-position: 0 -92px;} ul.newstabsnav li.nav-industrynews a { background: url('../images/news/industrynews.png') no-repeat; width: 165px;} ul.newstabsnav li.nav-industrynews a:hover { background-position: 0 -46px;} ul.newstabsnav li.nav-industrynews a.selected { width: 150px; background-position: 0 -92px;} ul.newstabsnav li.nav-newsarticles a { background: url('../images/news/newsarticles.png') no-repeat; width: 115px;} ul.newstabsnav li.nav-newsarticles a:hover { background-position: 0 -46px;} ul.newstabsnav li.nav-newsarticles a.selected { width: 100px; background-position: 0 -92px;} ul.newstabsnav li.nav-newsarchive a { background: url('../images/news/newsarchive.png') no-repeat; width: 115px;} ul.newstabsnav li.nav-newsarchive a:hover { background-position: 0 -46px;} ul.newstabsnav li.nav-newsarchive a.selected { width: 100px; background-position: 0 -92px;} .newstabs .newslinks { overflow: hidden; padding-bottom: 18px;} .newstabs .newslinks a { display: block; height: 21px; overflow: hidden; text-indent: -9999px; float: right;} .newstabs .newslinks a.rssfeed { background: url('../images/news/rssfeed.png') no-repeat; width: 101px; margin-right: 20px;} .newstabs .newslinks a.viewarchive { background: url('../images/news/viewarchive.png') no-repeat; width: 124px;} .newstabs .newslinks a:hover { background-position: bottom left;} #news .item { overflow: hidden; background: url('../images/news/newsborder.png') repeat-x top left; padding: 15px 0; margin-bottom: 0; width: 529px;} .newsarchive .item { background: url('../images/news/newsborder.png') repeat-x bottom left !important; padding: 0 0 15px !imporant; margin-bottom: 15px !important; padding-bottom: 30px !important;} .newsarchive .last { background: none !important;} #news .item .title { background:#E22027 none repeat scroll 0 0; color:#FFFFFF; float:left; font-size:1.2em; font-weight:bold; padding:3px 6px; width:auto;} #news .item .title h4 { font-size: 1em; line-height: 1.2em; padding: 0; margin: 0;} #news .item .abstract { float:left; padding:0.7em 0; width:100%;} #news .item .abstract img { border: 5px solid #fff; margin-bottom: 5px;} #news .item .link { float:left; width:100%; margin-top: -1em;} #news .item .link a { background: #e22027; color: #fff; font-weight: bold; text-decoration: none; padding: 3px 10px; float: right; width: auto;} #news .item .link a:hover { color: #e22027; background: #fff;} /* News */ #newsArticle { width: 529px;} #newsArticle .title { padding: 3px 6px; background: #e22027; color: #fff; font-weight: bold; float: left; font-size: 1.2em; width: auto;} #newsArticle .abstract { float: left; width: 100%; padding: .7em 0;} #newsArticle .abstract h5 { font-size: 1em; font-weight: bold; padding: 0 0 1.4em; margin: 0;} #newsArticle img { margin-bottom: .7em; padding: 5px; background: #fff;} #newsArticle .autoexpressaward { background: transparent; float: right; margin: 0 0 10px 15px;} /*------------------------------------ Product Range ------------------------------------*/ #productsRange { overflow: hidden; padding-left: 2px;} #productsRange .item { float: left; width: 277px; position: relative; padding: 23px 0 15px; margin: 0 7px; min-height: 140px;} #productsRange .title { background: #e22027; color: #fff; font-weight: bold; padding: 5px 50px 5px 90px; width: 137px; line-height: 1em; font-size: 1.2em; min-height: 30px;} #productsRange .title a { color: #fff !important; text-decoration: none;} #productsRange .abstract { padding: 4px 0 0 90px; color: #fff; font-size: 1.1em; background: transparent;} #productsRange .abstract p { padding: 0;} #productsRange .link { text-align: right; padding: 3px 0; margin-top: 4px;} #productsRange .link a { background: #e22027; color: #fff; font-weight: bold; text-decoration: none; padding: 3px 5px;} #productsRange .link a:hover { color: #e22027; background: #fff;} #productsRange .image { position: absolute; top: 0; left: 0;} #productsRange .image a { outline: none;} #productsRange .asSeenOnTV { position: absolute; top: 15px; right: -5px;} #productsRange .lastproduct { width: 568px;} #productsRange .lastproduct .title { width: 308px; padding: 5px 50px 5px 210px;} #productsRange .lastproduct .abstract { padding: 4px 0 0 210px; } #productsRange .lastproduct .image { left: 20px;} /*------------------------------------ Products Page ------------------------------------*/ body.productsPage #innersideCol { float: left; width: 290px;;} body.productsPage #innermainCol { float: left; width: 289px; padding: 20px 0 0 0;} #productImg { margin: 0 0 0 0; min-height: 43px;} #productInfoLinks { overflow: hidden; width: 100%;} #productInfoLinks a { display: block; width: 246px; height: 25px; text-indent: -9999px; overflow: hidden; margin-bottom: 4px; background: url('../images/productLinks.png') no-repeat; float: left;} #productInfoLinks .wheretobuyLink { background-position: 0 0;} #productInfoLinks .wheretobuyLink:hover { background-position: 100% 0;} #productInfoLinks .msdsLink { background-position: 0 -29px;} #productInfoLinks .msdsLink:hover { background-position: 100% -29px;} #productInfoLinks .faqLink { background-position: 0 -58px;} #productInfoLinks .faqLink:hover { background-position: 100% -58px;} #tips { background: #70b9e9; padding: 8px 10px 0;} h3#hdDirections { margin-top: 0; } body.productsPage #innermainCol ul { list-style: decimal; margin-top: -1.4em; margin-bottom: 1.6em;} /*------------------------------------ Where to buy Page ------------------------------------*/ body.wheretobuyPage #mainCol { float: left; width: 568px; padding: 0 11px 11px 11px;} body.wheretobuyPage #innersideCol { float: left; width: 275px; padding: 0 15px 0 0;} body.wheretobuyPage #innermainCol { float: left; width: 300px; padding: 20px 0 0 0;} #wheretobuy { margin-left: -10px; position: relative;} #wheretobuy a { float: left; width: 134px; padding: 77px 0 5px 0; margin: 0 0 0 10px; color: #fff; text-decoration: none; display: block; text-align: center; background: transparent; font-size: .9em;} #wheretobuy a.halfordsLink { background: url('../images/logo-halfords.png') no-repeat #e22027;} #wheretobuy a.passionautoLink { background: url('../images/logo-passionautomotive.png') no-repeat #e22027;} #wheretobuy a.motorworldLink { background: url('../images/logo-motorworld.png') no-repeat #e22027;} #wheretobuy a.idealworldLink { background: url('../images/logo-idealworld.png') no-repeat #e22027;} #wheretobuy a:hover { background-color: #fff; color: #e22027; } #wheretobuy a.idealworldReadmore { padding: 0; width: 64px; height: 64px; position: absolute; top: -25px; right: -10px; text-indent: -9999px; overflow: hidden; background: url('../images/readmore.png') no-repeat; z-index: 9;} #wheretobuy #idealWorldPopup { background: #e22027; position: absolute; top: 0; right: 0; width: 506px; height: 59px; padding: 20px 40px 20px 20px; color: #fff; font-weight: bold; z-index: 8; display: none;} #stockistsForm { overflow: hidden; margin-left: -15px; font-size: 1.2em; font-weight: bold;} #stockistsForm h3 { padding:0 0 15px 15px; margin-top: 25px;} #stockistsForm .formRow { float: left; width: auto; margin: 0 0 0 15px; padding-bottom: 15px;} #stockistsForm .formRow .input { margin-left: 5px; padding: 2px 4px; width: 146px;} #stockistsForm .formRow .select { padding: 1px 0; width: 120px;} #stockistsForm .submit { background: #e22027; color: #fff; font-weight: normal; text-decoration: none; font-size: .8em; padding: 2px 5px; min-width: 50px; float: left; margin: 0; text-align: center;} #stockistsForm .submit:hover { color: #e22027; background: #fff;} .noresults { float: left; margin-left: 15px; background: #e22027; color: #fff; padding: 3px 10px;} /*#stockistsForm h1 { width: 580px; margin: 15px 0 15px 15px; float: left; font-size: 1.2em; background: #e22027; color: #fff; padding: 3px 10px;}*/ #stockistsMainCol { float: left; margin-right: 15px; width: 372px; font-weight: normal;} #stockistsMainCol #warning { margin-top: 25px;} #stockistsMainCol #warningreg { margin-top: 25px;} #stockistsSideCol { float: left; font-weight: normal; width: 180px;} #stockistsSideCol h2 { background:transparent none repeat scroll 0 0;color:#FFFFFF;font-size:1.2em; margin-top: 25px;} .stockmap { padding: 5px; background: #fff;} #stockDefault { width: 363px; height: 234px;} #stockDefault #map { width: 363px; height: 234px;} #stockLocation { width: 363px; height: 234px;} #stockLocation #map { width: 363px; height: 234px;} #stockistsList { width: 568px; margin: 0 0 0 15px; float: left; font-weight: normal;} #stockistsList thead { background: #000; font-size: 1.2em; font-weight: bold;} #stockistsList th { padding: 6px 10px; text-align: left;} #stockistsList th.info { width: 80px;} #stockistsList th.distance { width: 80px;} #stockistsList td { padding: 5px 10px; height: 44px;} #stockistsList tr.alt { background: #59a6d9;} #stockistsList .moreinfo { background: #e22027; color: #fff; text-decoration: none; padding: 1px 5px; cursor: pointer; border: 0; width: auto; float: right; margin: 0; font-size: .8em; min-width: 50px;} #stockistsList .moreinfo:hover { color: #e22027; background: #fff;} #stockAll { width: 559px; margin-left: 15px; height: 470px; color: #000; font-weight: normal;} #mapAll { float: left;} #mapAll h4 { background: #000; padding: 3px 10px; color: #fff; margin: 25px 0 0 15px; cursor: pointer; width: 548px;} .gmnoprint h3 {font-size:1em;margin-top:-13px;padding:0 !important;} /*------------------------------------ Exhibitions and Events Page ------------------------------------*/ #events { background: url('../images/bg-line.gif') repeat-x top left;} #events .event { background: url('../images/bg-line.gif') repeat-x bottom left; padding: 1.4em 0;} #events .event .info { overflow: hidden;} #events .event .name { float: left; padding: 12px 10px; background: #e22027; color: #fff; font-weight: bold; margin-right: 15px; width: auto;} #events .event .date { margin-top: 4px;} #events .event .location { } #events .event .abstract { margin-top: .7em; } /*------------------------------------ Contact Us Page ------------------------------------*/ body.contactPage #innermainCol { padding-top: 30px;} body.contactPage #innersideCol { float: left; padding: 0 9px 0 9px; width: 569px;} #mapContainer { background: #fff; padding: 5px; overflow: hidden; width: 559px; position: relative;} #contact { float: left; width: 185px; padding-top: 54px;} #contact strong { font-size: 1.2em;} #contact, #contactForm { font-size: 1.2em;} #contact h2, #contactForm h2 { color: #fff; font-size: 1em; background: transparent; margin-top: 15px;} #contact a { color: #fff; text-decoration: none; background: transparent;} #contact a:hover { background: #fff; color: #e22027;} #contactForm { float: left; width: 340px; padding-top: 15px;} #contactForm .formRow { margin: 0 0 5px;} #contactForm .title { padding-top: 5px;} #contactForm .title .formLeft { width: auto; padding-right: 15px;} #contactForm .formLeft { padding: 0 15px 2px 0; width: 84px; text-align: right;} #contactForm .input { width: 200px; padding: 2px 4px;} #contactForm select { width: 210px;} #contactForm .textarea { width: 200px; padding: 2px 4px; height: 85px;} #contactForm .input, #contactForm textarea {font-family:Verdana,Geneva,sans-serif; font-size: .9em;} #contactForm input.submit { background: #e22027; color: #fff; font-weight: bold; text-decoration: none; padding: 1px 5px; width: auto; float: left; margin: 0 0 0 252px;} #contactForm input.submit:hover { color: #e22027; background: #fff;} #contactForm .selectedField { border: 1px solid #900; background: #f8f8ea;} .mandatory { margin: 0 0 1.4em 0;} /*------------------------------------ Mailing List Page ------------------------------------*/ #mailinglistForm { font-size: 1.2em; position: relative;} #mailinglistForm .formrow { overflow: hidden; margin-bottom: 10px;} #mailinglistForm label { display: block; float: left; padding: 0 15px 2px 0; width: 140px; text-align: right;} #mailinglistForm .text-input, #mailinglist select { width: 200px; padding: 2px 4px;} #mailinglistForm select { width: 210px;} #mailinglistForm .text-input, #mailinglist textarea {font-family:Verdana,Geneva,sans-serif; font-size: .9em;} #mailinglistForm .submitbutton { padding-bottom: 1.4em;} #mailinglistForm .submitbutton input { margin-left: 296px;} #mailinglistForm #lblThanks, #mailinglistForm #lblGoodbye { display: inline-block; position: absolute; top: 34px; right: 284px; padding: 3px 10px; background: #e22027; color: #fff; display: none;} #mailinglistForm #lblGoodbye { top: 205px;} #mailinglistForm .remove { margin-top: 5.6em;} #mailinglistForm h2 { font-size: 1.3em; padding-bottom: 15px;} #mailinglistForm p { font-size: 12px; line-height: 16px;} /*------------------------------------ Privacy Policy Page ------------------------------------*/ body.privacyPage ol { padding: 0 0 1.4em 0; margin: 0 0 0 35px;} /*--------------------------------------------------------------------------------------- Navigation ---------------------------------------------------------------------------------------*/ /*------------------------------------ MainNav ------------------------------------*/ ul#mainNav { margin: 0; padding: 0; list-style: none;} ul#mainNav li { margin: 0; padding: 0; width: 100%;} ul#mainNav li a { color: #fff; text-decoration: none; font-weight: bold; font-size: 3em; line-height: 1.1em; display: block; width: 388px; height: 39px; text-indent: -9999px; overflow: hidden; background: transparent;} ul#mainNav li a:hover {} ul#mainNav li a.navhome { background: url('../images/nav-home.png') no-repeat; width: 145px;} ul#mainNav li a.navabout { background: url('../images/nav-about.png') no-repeat; width: 230px;} ul#mainNav li a.navproducts { background: url('../images/nav-products.png') no-repeat; width: 298px;} ul#mainNav li a.navwheretobuy { background: url('../images/nav-wheretobuy.png') no-repeat; width: 269px;} ul#mainNav li a.navknowledge { background: url('../images/nav-knowledge.png') no-repeat; width: 354px;} ul#mainNav li ul { list-style: none; margin: 0 0 3px; padding: 0;} ul#mainNav li ul li a { height: 21px;} ul#mainNav li ul li a.navexpert { background: url('../images/nav-expert.png') no-repeat; width: 195px;} ul#mainNav li ul li a.navvideo { background: url('../images/nav-video.png') no-repeat; width: 233px;} ul#mainNav li ul li a.navtips { background: url('../images/nav-tips.png') no-repeat; width: 147px;} ul#mainNav li ul li a.navmsds { background: url('../images/nav-msds.png') no-repeat; width: 314px;} ul#mainNav li ul li a.windscreen { background: url('../images/nav-windscreen.png') no-repeat; width: 177px;} ul#mainNav li ul li a.carpet { background: url('../images/nav-carpet.png') no-repeat; width: 150px;} ul#mainNav li ul li a.bodywork { background: url('../images/nav-bodywork.png') no-repeat; width: 165px;} ul#mainNav li ul li a.wheels { background: url('../images/nav-wheels.png') no-repeat; width: 141px;} ul#mainNav li a.navevents { background: url('../images/nav-events.png') no-repeat; width: 384px;} ul#mainNav li a.navnews { background: url('../images/nav-news.png') no-repeat; width: 242px;} ul#mainNav li a.navcontact { background: url('../images/nav-contact.png') no-repeat; width: 237px;} ul#mainNav li a:hover { } ul#mainNav li a.selected { background-color:#e22027 !important;} /*------------------------------------ MinorNav ------------------------------------*/ ul#minorNav { margin: 0; padding: 0; list-style: none;} ul#minorNav li { margin: 0; padding: 0;} ul#minorNav li a.selected { background: #e22027; color: #fff; text-decoration: none; padding: 0 2px;} /*--------------------------------------------------------------------------------------- Misc. ---------------------------------------------------------------------------------------*/ /*------------------------------------ ErrorPage ------------------------------------*/ body#errorPage #footerInfo { width: 100%; padding: 0; text-align: center;} body#errorPage p#errorMessage { padding: 70px 0 100px; text-align: center;} body#errorPage #cols { width: 500px; margin: 0 auto; padding-top: 100px;} body#errorPage #containerWrapper { min-height: 300px;} /*------------------------------------ Video Players ------------------------------------*/ /* Popup Players */ #page { padding:80px; font-family:verdana; width:600px;} div.overlay { background:url('../images/vidbox_white.png') #fff no-repeat; padding: 10px 10px 39px 10px; width: 600px; height:368px; display:none;} #exposeMask { background: #000;} div.overlay div.close { background:url('../images/closelabel.gif') no-repeat; position:absolute; bottom:7px; right:10px; width:66px; height:22px; cursor:pointer;} a.player { display:block; width: 600px !important; height:368px !important;}