/* =================================================== Layout stylesheet - Dyson Version: v2.0 Author: James Taylor - 25/04/2007 /* =================================================*/ /* import color/typography stylesheets */ @import url(color.css); @import url(typography.css); /* General ================================ */ /* Normalize some of the default styling of common (X)HTML browsers */ * { margin: 0; padding: 0; outline: 0; } /* normalizes margin, padding of all elements */ ul, ol { list-style: none; } /* no list markers */ a img, :link img, :visited img, fieldset { border: 0; } /* no borders on linked images and fieldsets */ address { font-style: normal; } /* de-italicize address */ table { border-collapse: collapse; border-spacing: 0; } /* normalizes table borders and spacing */ caption, th { text-align: left; } q:before, q:after { content: ''; } /* removes quotation marks from q */ :focus { outline: 0; } /* Global Classes */ .clear { clear: both; } hr, .hide { display: none; } .clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clear {display:inline-block;} /* Hide from IE Mac \*/ .clearfix {display:block;} /* End hide from IE Mac */ *html .clear { height: 1px; } /* For ie6 and lower */ .col { width: 193px; float: left; position: relative; } .dblCol { width: 397px; float: left; } .col, .dblCol { margin: 0 10px 0 0; } .sifr { padding: 0 0 8px 8px; } .offscreen { position: absolute; left: -10000px; top: -1000px; } /* These are standard sIFR styles... do not modify */ .sIFR-flash { visibility: visible !important; margin: 0; } .sIFR-replaced { visibility: visible !important; } span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; } /* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */ .sIFR-flash + div[adblocktab=true] { display: none !important; } a.btn { margin-bottom: 3px; display: block; } /* Layout ================================ */ html { text-align: center; } body { width: 770px; margin: 0 auto; position: relative; text-align: left; } #header { height: 171px; position: relative; } #subheader {height:91px;} #logo { padding-top: 34px; } #logoPrint{ display:none; visibility:hidden;} #content { position: relative; width:750px; min-height:200px; } #content #letterbox { margin:10px; } #content #inner { text-align: left; margin: 18px 0 35px; padding: 18px; min-height: 300px; width: 710px; position: relative; } #content #inner h2 { text-align: left; } #footer { text-align: center; clear:both; position:relative} #footer #topline { width: 65em; margin:auto; padding-top:20px;display: block;} #footer #topline.script { margin:0 0 0 auto; } #footer p#copyright { display: inline; float: left; margin-top:5px;} #footer p#copyright span { display: inline-block; padding-left: 7px; position: relative; top: -7px; } #footer div#siteLocation { float: left; margin-right:35px;} #footer #siteLocation ul#trigger {margin: 9px 0px 0px 25px;} ul#trigger li a img { position: relative; top: 3px; left: 5px; } #frmLocation { padding: 7px 0 0 15px;} #frmLocation input { position: relative; top: -3px; } #frmLocation img { position: relative; top: -4px; } #footer #siteLocation ul#trigger li a { display: inline-block; padding-left: 10px; } #footer #siteLocation img { margin: -2px 0 0 3px; } #dvLocation { position: absolute; z-index: 1000; height: 11.8em; overflow: auto; padding-right: 2px; margin-top: 15px; padding-bottom: 0; text-align: left; margin-left: 30px; width:270px;} #dvLocation.ie { width: 248px; } #footer #siteLocation ul#navLocation { z-index: 100; margin-bottom: -35px;} #footer #siteLocation ul#navLocation li a { display: block; height: 1.7em; width: 19em; position: relative; padding: 4px 20px 0 3px; } #footer #siteLocation ul#navLocation li a img { position: absolute; right: 2px; margin-top: 1px; } /* Footer Nav */ #footer #navFooter { padding-top: 10px; clear: none; float: left; } #footer #navFooter li { display: inline; } #footer #navFooter li a { display: inline-block; margin: 0 5px; } #footer #navFooter li a:active { outline: none; } /* hide dotted outline in firefox */ #header #toplineHead {z-index: 1000;position:absolute;top:43px; right:0px;width:28em;text-align:right;} #header #toplineHead.script {z-index: 1000;position:absolute;top:43px; right:0;width:28em;text-align:right;} #header div#siteLocationHead { float: right;} /*Min width is for browsers who can utilise this feature. Stops the top menu from shrinking when the bottom menu is open at the same*/ #header #siteLocationHead ul#triggerHead { margin: 4px 20px 0 0px; width:270px;} ul#triggerHead li a img { position: relative; top: 3px; left: 5px; } #frmLocationHead { padding: 7px 0 0 15px; } #frmLocationHead input { position: relative; top: -3px; } #frmLocationHead img { position: relative; top: -4px; } #header #siteLocationHead ul#triggerHead li a { display: inline-block; padding-left: 10px; } #header #siteLocationHead select { position: relative; top: -2px; float: left; } #header #siteLocationHead img { margin: -2px 0 0 3px; } #dvLocationHead { z-index: 1000; height: 7.8em; overflow: auto; padding-right: 2px; margin-top: 3px; padding-bottom: 0; text-align: left; margin-left: 17px; } #dvLocationHead.ie { width: 248px; } #header #siteLocationHead ul#navLocationHead { z-index: 100; margin-bottom: -135px; } #header #siteLocationHead ul#navLocationHead li a { display: block; height: 1.7em; width: 19em; position: relative; padding: 4px 20px 0 3px; } #header #siteLocationHead ul#navLocationHead li a img { position: absolute; right: 2px; margin-top: 1px; } /* Navigation =========================== */ /* Main Nav - Original left value for #navMain= 87px*/ #navMain { position: absolute; top: 111px; left: 150px; } #navMain li { display: inline; } #navMain li a { display: block; float: left; height: 28px; text-indent: -10000px; } #navMain li#HOME {display:none;} #navMain li#HOW a { width: 120px; } #navMain li#WHY a { width: 130px; } #navMain li#WHO a { width: 128px; } #navMain li#STORE a { width: 130px; } #navMain li#AFTERSALES a { width: 65px; } /* Store Navigation ================================*/ #navStore { position: absolute; top: 141px; left: 87px; } #navStore li { display: inline; } #navStore li#BUYING a { width: 95px; background: url(/airblade/dk/images/nav/subnav_buying.png) no-repeat; } #navStore li#SUITABILITY a { width: 240px; background: url(/airblade/dk/images/nav/subnav_suitability.png) no-repeat; } #navStore li#LEASING a { width: 66px; background: url(/airblade/dk/images/nav/subnav_leasing.png) no-repeat; } #navStore li#INSTALLING a { width: 70px; background: url(/airblade/dk/images/nav/subnav_installing.png) no-repeat; } #navStore li#MAINTAINING a { width: 85px; background: url(/airblade/dk/images/nav/subnav_maintaining.png) no-repeat; } #navStore li#GUARANTEE a { width: 118px; background: url(/airblade/dk/images/nav/subnav_guarantee.png) no-repeat; } #navStore li a { display: block; float: left; background-position: left; text-indent: -10000px; height: 26px; } #navStore li#BUYING a:hover, #navStore li#BUYING a:focus, #navStore li#BUYING.on a, #navStore li#SUITABILITY a:hover, #navStore li#SUITABILITY a:focus, #navStore li#SUITABILITY.on a, #navStore li#LEASING a:hover, #navStore li#LEASING a:focus, #navStore li#LEASING.on a, #navStore li#INSTALLING a:hover, #navStore li#INSTALLING a:focus, #navStore li#INSTALLING.on a, #navStore li#MAINTAINING a:hover, #navStore li#MAINTAINING a:focus, #navStore li#MAINTAINING.on a, #navStore li#GUARANTEE a:hover, #navStore li#GUARANTEE a:focus, #navStore li#GUARANTEE.on a { background-position: top right; } /* How Navigation ================================*/ #navStore li#TECHNOLOGY a { width: 60px; background: url(/airblade/dk/images/nav/subnav_technology.png) no-repeat; } #navStore li#TRY a { width: 51px; background: url(/airblade/dk/images/nav/subnav_tryit.png) no-repeat; } #navStore li#STORY a { width: 60px; background: url(/airblade/dk/images/nav/subnav_story.png) no-repeat; } #navStore li#GALLERY a { width: 50px; background: url(/airblade/dk/images/nav/subnav_gallery.png) no-repeat; } #navStore li a { display: block; float: left; background-position: left; text-indent: -10000px; height: 26px; } #navStore li#TECHNOLOGY a:hover, #navStore li#TECHNOLOGY a:focus, #navStore li#TECHNOLOGY.on a, #navStore li#TRY a:hover, #navStore li#TRY a:focus, #navStore li#TRY.on a, #navStore li#STORY a:hover, #navStore li#STORY a:focus, #navStore li#STORY.on a, #navStore li#GALLERY a:hover, #navStore li#GALLERY a:focus, #navStore li#GALLERY.on a { background-position: top right; } /* Why Navigation ================================*/ #navStore li#FASTER a { width: 60px; background: url(/airblade/dk/images/nav/subnav_faster.png) no-repeat; } #navStore li#HYGIENIC a { width: 60px; background: url(/airblade/dk/images/nav/subnav_hygienic.png) no-repeat; } #navStore li#LOWERCOST a { width: 120px; background: url(/airblade/dk/images/nav/subnav_lowercosts.png) no-repeat; } #navStore li#ENVIRONMENT a { width: 50px; background: url(/airblade/dk/images/nav/subnav_environment.png) no-repeat; } #navStore li#ENDORSEMENT a { width: 80px; background: url(/airblade/dk/images/nav/subnav_endorsement.png) no-repeat; } #navStore li#WHYGUARANTEE a { width: 118px; background: url(/airblade/dk/images/nav/subnav_guarantee.png) no-repeat; } #navStore li#COMPARE a { width: 75px; background: url(/airblade/dk/images/nav/subnav_compare.png) no-repeat; } #navStore li a { display: block; float: left; background-position: left; text-indent: -10000px; height: 26px; } #navStore li#FASTER a:hover, #navStore li#FASTER a:focus, #navStore li#FASTER.on a, #navStore li#HYGIENIC a:hover, #navStore li#HYGIENIC a:focus, #navStore li#HYGIENIC.on a, #navStore li#LOWERCOST a:hover, #navStore li#LOWERCOST a:focus, #navStore li#LOWERCOST.on a, #navStore li#ENVIRONMENT a:hover, #navStore li#ENVIRONMENT a:focus, #navStore li#ENVIRONMENT.on a, #navStore li#ENDORSEMENT a:hover, #navStore li#ENDORSEMENT a:focus, #navStore li#ENDORSEMENT.on a, #navStore li#WHYGUARANTEE a:hover, #navStore li#WHYGUARANTEE a:focus, #navStore li#WHYGUARANTEE.on a, #navStore li#COMPARE a:hover, #navStore li#COMPARE a:focus, #navStore li#COMPARE.on a { background-position: top right; } /* Aftersales Navigation ================================*/ #navStore li#HOWTOUSE a { width: 120px; background: url(/airblade/dk/images/nav/subnav_howtouse.png) no-repeat; } #navStore li#INSTALLSERVICE a { width: 70px; background: url(/airblade/dk/images/nav/subnav_installing.png) no-repeat; } #navStore li#MAINTAINING a { width: 95px; background: url(/airblade/dk/images/nav/subnav_maintaining.png) no-repeat; } #navStore li#WHYGUARANTEE a { width: 80px; background: url(/airblade/dk/images/nav/subnav_guarantee.png) no-repeat; } #navStore li a { display: block; float: left; background-position: left; text-indent: -10000px; height: 26px; } #navStore li#HOWTOUSE a:hover, #navStore li#HOWTOUSE a:focus, #navStore li#HOWTOUSE.on a, #navStore li#INSTALLSERVICE a:hover, #navStore li#INSTALLSERVICE a:focus, #navStore li#INSTALLSERVICE.on a, #navStore li#MAINTAINING a:hover, #navStore li#MAINTAINING a:focus, #navStore li#MAINTAINING.on a, #navStore li#WHYGUARANTEE a:hover, #navStore li#WHYGUARANTEE a:focus, #navStore li#WHYGUARANTEE.on a { background-position: top right; } p.back { position: absolute; left: 10px; top: 0; padding-top: 5px; } p.back a { font-size: 1.1em; color: #b4b4b4 !important; text-decoration: none; font-weight: bold; display: inline-block; padding-left: 10px; background: url(/images/arrow_back.png) no-repeat left; } p.back a:hover, div.back a:focus { color: #ffcc00 !important; background: url(/images/arrow_back_o.png) no-repeat left; } /* Utility Nav */ #navUtil { position: absolute; top: 3px; right: 0; } #navUtil li { display: inline; } #navUtil li a:active { outline: none; } /* hide dotted outline in firefox */ #navUtil li a { display: inline-block; margin: 0 6px; } #navUtil li#basket a { padding-right: 18px; } /* Right Side Navigation Panel ================================*/ div.inPageNav {position:relative;float:right;width:199px;} div.inPageNav ul {padding-bottom:10px;border-bottom:1px solid #6C6C6C;margin-bottom:10px;} div.inPageNav ul li {background-color:#222222;padding:3px 10px;margin-bottom:3px;} div.inPageNav ul li a { display: inline-block; color: #999999; background: url(/airblade/dk/images/arrow_g1.png) no-repeat left; padding-left: 12px; font-size: 1.1em; font-weight: bold; text-decoration: none; } div.inPageNav ul li a:hover{ color: #ffcc00; background: url(/airblade/dk/images/arrow_o.png) no-repeat left; }