/* sGrid v 0.1 */ .sgrid { position: relative; width: 100%; } .sgrid .column { margin-right: 16px; width: 55px; } .sgrid .column.first { clear: left; *clear: both; } .sgrid .column.last { margin-right: 0 !important; float: right !important; } .sgrid .column.clear { clear: both; } /* clearing */ .sgrid:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; } .sgrid, .sgrid .column { _zoom: 1; } /*re-colour HTML correctly*/ html { background-color: #F3F3F3; } /* replaced */ .replaced { background-repeat: no-repeat; background-position: top left; display: block; height: 18px; overflow: hidden; text-indent: -9999px; width: auto; } a.privacy { font-size: 11px; } body { background-color: #f3f3f3; } #container { width: 984px; } #container h1 { float: left; margin-top: 18px; margin-bottom: 0px; width: 700px; } #container h1 a { background-image: url(/za/buy/apr/images/overview_title_retailstore.jpg); height: 29px; width: 100%; } #main a { color: #08c; text-decoration: none; } #main a:hover, #main a h3:hover { text-decoration: underline; } #main a.shoponline { float: right; margin-top: 18px; } #make-reservation a { background: url(/za/buy/apr/images/arrow_08c.gif) no-repeat 100% 65%; padding-right: 6px; } #main a.reserve { background: url(/za/buy/apr/images/arrow_08c.gif) no-repeat 100% 65%; padding-right: 6px; margin-right: 10px; } a.more { background: url(/global/elements/arrows/morearrow_08c.gif) no-repeat 100% 60%; padding-right: 8px; } /* content */ #hero { clear: left; } #hero h2 { margin-bottom: 0; } #main { background: #fff url(/za/buy/apr/images/main_bg.gif) repeat-y top left; color: #999; margin: 0; width: 914px; } #main.sgrid .grid3col .column { margin: 18px 0 0 3%; width: 31%; } #container .main_capbottom { background: url(/za/buy/apr/images/main_capbottom.gif) no-repeat bottom left; height: 9px; margin: 0; width: 984px; font-size: 1px; } #main h2 { color: #333; font-size: 20px; font-weight: normal; line-height: 1.2; margin-bottom: 5px; } #main h3 { color: #333; font-size: 14px; font-weight: normal; line-height: 1.4; } #content { clear: both; padding: 0; } body { margin: 0 auto; width: 984px; -moz-opacity: 0.9999; } body#overview h1 { float: left; margin-top: 18px; margin-bottom: 0px; width: 700px; } body#overview h1 a { background-image: url(/za/buy/apr/images/overview_title_apr.jpg); height: 29px; width: 100%; } body#overview #main { margin: 0; padding: 0; position:relative; z-index:1; } body#overview #main-content { background: #fff url(/za/buy/apr/images/content_bg.gif) repeat-y 0 0; padding: 30px 50px 40px; width: 884px; } body#overview #main .main_capbottom .apply { margin: 0 auto; font-size: 11px; color: #000000; text-align: center; padding-top: 4px; } body#overview #main-content { color:#000; } /* hero */ body#overview #container { clear:left; background: url(/za/buy/apr/images/overview-hero-captop.gif) no-repeat 0 0; padding-top: 6px; } body#overview #hero { position:relative; background: #fff url(/za/buy/apr/images/overview-hero-border.gif) repeat-y 0 0; clear: both; height: 342px; padding: 0 2px; width: 980px; z-index:2; } body#overview #main-promo { margin-right: 0; position: relative; top:-5px; width: 747px; z-index: 1; } body#overview h3 { font-weight: bold; } #hero .column.last { height: 342px; position: absolute; right: 2px; width: 248px; z-index: 10; border-left:1px solid #fff; background-color: #fff; } body#overview #main-promo #reserve { margin:0 0 0 -1px; } body#overview #tips { border-top: 1px solid #d3d3d3; margin: 0; padding: 0; position: absolute; top: 0; left: 2px; width: 980px; z-index:50; } #heretohelp.column.first.span_6 { margin:0; } #heretohelp { width:398px; } #heretohelp p.intro { font-size:14px; line-height:1.5em; font-weight:normal; margin:0; } img.right.geniuses { margin:0 8px 0 0; } #hero a.reserve-link { position: absolute; width: 100px; height: 28px; left: 618px; top: 86px; text-indent: -9999px; overflow: hidden; } .search-wrapper { width: 214px; } .search-wrapper input.prettysearch { margin-left: 20px; width: 184px; *width: 174px; } input.prettysearch { width: 201px; } /* hero slideshow */ #hero #main-promo .slideshow-view { height: 347px; position: relative; width: 100%; } #hero #main-promo .slideshow-view .content { height: 347px; position: absolute; top: 0; left: 0; width: 980px; } #hero #main-promo .slideshow-view .content .info { float: left; height: 100%; position: relative; width: 730px; } #hero #main-promo .slideshow-view .content .info a.fader_link { background: url(/za/buy/apr/images/overview_hero_visitarrow.png) no-repeat 100% 55%; color: #ccc; display: block; font-size: 12px; padding-right: 8px; position: absolute; top: 100px; left: 43px; z-index: 3; _background-image: url(/za/buy/apr/images/overview_hero_visitarrow.gif); } #hero #main-promo .slideshow-view .content .info ul{ position:absolute; color:#b1b6ba; font-size:16px; z-index:2; top:165px; left:50px; line-height:19px; } #hero #main-promo .slideshow-view .content h2 { color: #000; font-size: 26px; font-weight: normal; line-height: 1.2; position: relative; z-index: 3; } #hero #main-promo .slideshow-view .content p { color: #353535; font-size: 16px; line-height: 1.4; position: relative; z-index: 3; } #hero #main-promo .slideshow-view .content .store { position:relative; top:280px; left:35px; width:257px; font-size:1.2em; color:#888; } /* Main Promo slideshow */ #hero .info { border-right:1px solid #d2d2d2; } #hero .info h1 { position:absolute; top:-18px; left:1px; } #hero .sideinfo { position:absolute; top:150px; left:30px; font-size:16px; color:#666; line-height:1.3em; width:415px; } #hero .sideinfo a.more { background:transparent url(/global/elements/arrows/morearrow_big_08c.gif) no-repeat 100% 60%; padding-right:12px; } #featureA, #MASKED-featureA { z-index:2; background: url(/za/buy/apr/images/overview-hero-bg2.gif) repeat-x 0 100%; } /*#featureB, #MASKED-featureB { background: url(/za/buy/apr/images/overview-hero-bg2.gif) repeat-x 0 100%; z-index:1; }*/ #featureA img, #MASKED-featureA img { top: 0; } #featureB img, #MASKED-featureB img { top: 0; } #hero .slideshow-nav { display: none; position: absolute; right: 367px; bottom: 16px; width:112px; height:35px; margin: 0; padding: 0; list-style-type: none; } #hero .slideshow-nav li { margin-left:0px; } #hero .slideshow-nav #controls { margin:8px 0 0 12px; } #hero .slideshow-nav #controls .feature-link { color:#FFF; } #hero .slideshow-nav #controls .feature-link.active { color:#797c80; } #hero .slideshow-nav { display: none; position: absolute; right: 525px; bottom: 16px; width:200px; height: 100px; margin: 0; padding: 0; list-style-type: none; } #hero .slideshow-nav.active { display: block; } #hero .slideshow-nav #controls li { float: left; } #hero .slideshow-nav #controls a { display: block; height: 50px; width: 53px; background: transparent url(/za/buy/apr/images/retail_slideshow_controls.png) no-repeat top left; *background: transparent url(/za/buy/apr/images/retail_slideshow_controls.gif) no-repeat top left; } #hero .slideshow-nav #controls #prevbutton a { background-position: -2px 0px; } #hero .slideshow-nav #controls #playpausebutton a { background-position: -102px 0px; } #hero .slideshow-nav #controls #playpausebutton a.playing { background-position: -57px 0px; } #hero .slideshow-nav #controls #nextbutton a { background-position: -157px 0px; } #hero .slideshow-nav #controls #prevbutton a:hover { background-position: -2px -49px; } #hero .slideshow-nav #controls #playpausebutton a:hover { background-position: -102px -49px; } #hero .slideshow-nav #controls #playpausebutton a.playing:hover { background-position: -57px -49px; } #hero .slideshow-nav #controls #nextbutton a:hover { background-position: -157px -49px; } #hero .slideshow-nav #controls #prevbutton a:active { background-position: -2px -98px; } #hero .slideshow-nav #controls #playpausebutton a:active { background-position: -102px -98px; } #hero .slideshow-nav #controls #playpausebutton a.playing:active { background-position: -57px -98px; } #hero .slideshow-nav #controls #nextbutton a:active { background-position: -157px -98px; } #main-content img#instorehardware { clear: left; float: left; margin-bottom:3.5em; margin-top:2.8em; } #main-content img#employees { margin-top: 30px; margin-bottom: 36px; _margin-right: -50px; } #main-content img#gatherlearn { margin: 10px 0 36px; } /* storefinders */ #hero #storefinder { float: left; padding: 17px 0 0 17px; } #hero #storefinder .retailstorefinder { width: 100%; } #hero #storefinder .retailstorefinder h2 { color: rgb(38, 38, 38); font-weight: normal; font-size: 15px; margin-bottom: 5px; } #hero #storefinder .retailstorefinder form select { margin-bottom: 4px; width: 220px; } #hero #storefinder .retailstorefinder form #go { background-image: url(/za/buy/apr/images/button-go.png); float: right; height: 20px; margin-right: 13px; margin-top: 5px; width: 36px; opacity: 0.4; display:inline; behavior:url(/global/scripts/lib/iepngfix.htc); } #hero #storefinder .retailstorefinder form #go.active { cursor: pointer; opacity: 1; } /*#hero #storefinder .retailstorefinder form #go.active:hover { cursor: pointer; opacity: 1; }*/ #hero #storefinder .retailstorefinder a#completestorelist { background: url(/euro/global/elements/arrows/morearrow_08c.gif) no-repeat 100% 60%; float: left; margin-top: 5px; padding-right: 10px; } #main-content #findstore { background: url(/za/buy/apr/images/overview_findstore_bg.gif) no-repeat top left; float: left; padding-bottom: 35px; position: relative; width: 879px; height: 38px; margin-top: 30px;} /* #main-content #findstore .retailstorefinder { background: url(/za/buy/apr/images/overview_findstore_capbottom.gif) no-repeat bottom left; float: left; padding: -5px 24px 0; width: 831px; *padding-bottom: 15px; } */ #main-content #findstore .retailstorefinder h2 { color: #ffffff; display: inline; float: left; font-size: 12px; font-weight: normal; float: left; margin: 10px 21px 18px 18px; } #main-content #findstore .retailstorefinder form { float: left; width: 475px; margin-top: 9px; } #main-content #findstore .retailstorefinder form select { float: left; margin-right: 10px; width: 190px; } #main-content #findstore .retailstorefinder form #gofooter { background-image: url(/za/buy/apr/images/button_go.png); float: left; height: 20px; margin-right: 20px; width: 36px; } #main-content #findstore .retailstorefinder form #gofooter.active { background-position: 0 -22px; cursor: pointer; } #main-content #findstore .retailstorefinder form #gofooter.active:hover { background-position: bottom left; cursor: pointer; } #main-content #findstore .retailstorefinder a#completestorelist { display: none; } #main-content #findstore span#signmeup { background: url(/za/buy/apr/images/overview_findstore_divider.gif) repeat-y top left; display: block; float: right; margin-right: 10px; margin-top: -4em; padding: 1em 1.5em; /*position: absolute; top: 5px; right: 10px;*/ } #main-content #findstore span#signmeup a { background: url(/za/buy/apr/images/morearrow_6cd4ff.gif) no-repeat 100% 60%; color: #6cd4ff; padding-right: 10px; } /* upcoming events */ #hero #upcomingevents { float:left; margin-top:0; padding:0 0 0 14px; width:220px; z-index:1; } #hero #upcomingevents #events { color: #8c8c8c; margin-top: 7px; height: 175px; width: 218px; } #hero #upcomingevents #events img { margin-bottom: 6px; } #hero #upcomingevents #events-holder { display: none; } #hero #upcomingevents #events .slideritem, #hero #upcomingevents #events .empty { float: left; margin: 0; padding: 0; text-align: center; width: 220px; } #hero #upcomingevents #events .ACSliderPageNav { position: absolute; top: -12px; right: -66px; height:8px; padding:0; margin:0 auto; text-align: center; width: 50px; } #hero #upcomingevents #events .ACSliderPageNav li a { background:url(/euro/global/elements/slider/dot20071018.png) center top no-repeat; _background-image:url(/euro/global/elements/slider/dot20080729.gif); text-decoration: none; } #hero #upcomingevents #events .ACSliderPageNav li a:hover { background-position:center -8px; text-decoration: none; } #hero #upcomingevents #events .ACSliderPageNav li a.active { background-position:center -16px; cursor:default; text-decoration: none; } #hero #upcomingevents #events .ACSliderPreviousArrow, #hero #upcomingevents #events .ACSliderNextArrow { display: none; } #hero #upcomingevents #events .ACSliderMaskDiv { height: 175px; margin: 0 auto; width: 220px; } #hero #upcomingevents #events .ACSliderMaskDiv ul { height: 160px; } #hero #upcomingevents #events .ACSliderMaskDiv ul li { display: inline; width: 218px; height: 175px; margin: 0 13px 0.9em 0; } #hero #upcomingevents .slideritem img { margin-bottom: 5px; } #hero #upcomingevents .slideritem p { text-align: left; } #hero #upcomingevents .slideritem p strong { display: block; font-weight: normal; } /* events-slider */ #hero #upcomingevents ul { display:none; float:right; margin-bottom:10px; margin-top:7px; margin-right:40px; } #hero #upcomingevents ul li { float: left; } #hero #upcomingevents a { color: #000; } #hero #upcomingevents a.more { color: #08c; } #hero #upcomingevents a:hover { color: #08c; } #hero #upcomingevents a.event-link { display: block; visibility: hidden; float: left; display: inline; margin-right: 3px; background: url(/global/elements/slider/dot20071018.png) center top no-repeat; _background-image:url(/global/elements/slider/dot20080729.gif); text-decoration: none; width: 8px; height: 8px; text-indent: -9999px; outline: none; overflow: hidden; } #hero #upcomingevents a.event-link:hover { background-position: center -8px; } #hero #upcomingevents a.event-link.active { background-position: center -16px; cursor: default; } #hero #upcomingevents .stories { position:relative; border:1px solid rgba(0,0,0,0.1); background-color:#fff; clear:both; color:#8c8c8c; height:223px; overflow:hidden; margin-top:1.6em; padding:0; width:218px; -webkit-border-radius:4px; -moz-border-radius:4px; -o-border-radius:4px; -khtml-border-radius:4px; *border: 1px solid #d3d3d3;} #hero #upcomingevents .stories #eventContent { margin:0; } #hero #upcomingevents .stories .eventParts { position:absolute; height:223px; top:0; left:0; } #hero #upcomingevents .stories .eventParts h2 { color:#000; font-size:28px; font-weight:100; margin:0.4em 0 0.2em; } #hero #upcomingevents .stories .eventParts h3 { margin:0.9em 0 0 20px; font-weight:100; color:#000; } #hero #upcomingevents .stories .eventParts img { display:block; margin:1.2em auto 0 auto; padding:0 /*18px*/0; text-align:center; } #hero #upcomingevents .stories .eventParts img.screen { display:block; position:relative; bottom:0; margin:.7em auto 0 auto; } #hero #upcomingevents .stories .eventParts p { margin:0 /*22px*/0 0 20px; line-height:16px; color:#9e9e9e; width: 190px; } #hero #upcomingevents .stories .eventParts .title { margin:15px 23px 4px; } #hero #upcomingevents .stories .eventParts .flushtop { margin-top:0; } #hero #upcomingevents .stories .eventParts .flushleft { margin-left:-9px; margin-bottom:4px; } #hero #upcomingevents .stories .eventParts .flushtopleft { margin-top:0; margin-left:0px; margin-bottom:3px; } #hero #upcomingevents .stories .eventParts .flushnone { margin-top:10px; margin-left:9px; margin-bottom:11px; } #hero #upcomingevents .stories .eventPartsCopy { margin-right:20px;} #hero #upcomingevents .stories a em.more { font-style: normal; text-decoration: none; color: #08c; white-space: nowrap; padding-right: 10px; background: url(/global/elements/arrows/morearrow_08c.gif) no-repeat 100% 50%; zoom:1; cursor:pointer; } #hero #eventPartsContainer { text-indent: -9999px; overflow: hidden; height: 0; } /* events promos */ #hero #upcomingevents .stories #MASKED-A { background: url(/euro/buy/apr/images/overview-promo-bg.gif) repeat-x left bottom; } #hero #upcomingevents .stories #MASKED-B { background: url(/euro/buy/apr/images/overview-promo-bg.gif) repeat-x left bottom; } #hero #upcomingevents .stories #MASKED-C { background: url(/euro/buy/apr/images/overview-promo-bg.gif) repeat-x left bottom; } /* tips */ #main-content #tips { height: 1px; overflow: hidden; } #main-content #tips h3 { background: url(/za/buy/apr/images/overview_tips_icon_blue.png) no-repeat top left; color: #585858; float: left; font-size: 15px; font-weight: normal; margin-left: 24px; padding: 7px 0 5px 38px; _margin-left:15px; } #main-content #tips #tip_list { border-left: 1px solid #bababa; position: relative; height: 99%; overflow: hidden; } #main-content #tips ul { margin: 9px 24px; } #main-content #tips ul li { margin-bottom: 18px; position:relative; margin-right:50px; } #main-content #tips ul li strong { color: #585858; position:absolute; top:0; left:0; } #main-content #tips ul li p { color: #9d9d9d; margin-left:47px; *margin-top:-18px; } #main-content #tips ul li p strong{ position:static; display:inline; } #main-content #tips #tip_list a#expand-tips { background-image: url(/buy/apr/images/morecontent_08c.png); background-repeat: no-repeat; background-position: 100% 0; float: right; line-height: 1.5; margin: 9px 24px 10px 10px; padding: 0 20px 4px 0; } #main-content #tips #tip_list a#expand-tips.open { background-image: url(/buy/apr/images/lesscontent_08c.png); } #main-content .geniusbar.grid2col { margin-bottom:1.6em; } #main-content .geniusbar.grid2col .column.first { width:45%; margin-right:0; } #main-content .geniusbar.grid2col .column.first .right { margin:2px 0 0 16px; } #main-content .geniusbar.grid2col .column.last { width:53%; } /* misc */ #main-content #everything_shopping { margin-left: -20px; margin-top:0px; width: 464px; } #main-content #everything_shopping h2 { margin-top:35px; } #main-content #everything_shopping .right { margin: 0 8px 0 0; padding: 15px 0 10px 0; } #main-content #everything_shopping h2{ margin-top:14px; } #main-content #everything_shopping .overlaycallout_capbottom.right{ margin-bottom:0; } #main-content #other_programs .column { width: 268px; margin-left: 39px; } #main-content #other_programs .column .right { margin:-5px 5px 4px 20px; } #main-content h3 a { color: #333; text-decoration: none; } #main-content h3 a:hover { color: #333; text-decoration: underline; } #main-content .secondparagraph{ margin-bottom:0; } #main-content .overlaycallout.left { margin: 15px 15px 0 0; } #main-content .overlaycallout_capbottom{ margin-top:-3px _margin-top:-15px; } /* overlays */ #main .overlaycallout_capbottom { clear: both; } #main #tour-personal-shopping { margin-top: 0; } #main .overlaycallout_capbottom.left{ margin-right:15px; } #main .overlaycallout_capbottom.right{ margin-left:15px; } #main .overlaycallout_capbottom.left.ars { margin-bottom:30px; } #main #o2o-tour{ margin:9px 15px 0 0; } /* programs */ #main-content.sgrid .grid3col .column { margin: 10px 0 0 2%; width: 32%; } #main-content.sgrid .grid3col .column img.programhero { margin-bottom: 10px; } #main-content.sgrid .grid3col .column img.discounts { margin-left: 86px; } #main-content.sgrid .grid3col .column img.business { margin-left: 46px; margin-top: -17px;} #main-content.sgrid .grid3col .column img.recycling { margin-left: 75px; } .borderbottom { border-bottom: 1px solid #e5e5e5; } /* main-content */ #main-content h2 { font-size: 24px; margin-top: 18px; } /* locationChoices */ body form #locationChoices { position:absolute; top:41px !important; left:0px !important; z-index:100 !important; width:217px !important;_width:206px; margin-top:4px; padding:0 0 8px; background:url(/retail/locator/images/locator_locationChoices_bottom20090224.png) 0 100% no-repeat; _background:url(/retail/locator/images/locator_locationChoices_bottom20090224.gif) 0 100% no-repeat; } body form div#locationChoices ul { list-style-type:none; width:200px; margin:-4px 0 0 0 !important; padding:4px 10px 4px 8px !important; _margin:0; _padding:4px 2px 4px 2px; background:url(/retail/locator/images/locator_locationChoices_top20090224.png) top no-repeat; _background:url(/retail/locator/images/locator_locationChoices_top20090224.gif) top no-repeat;} body form #locationChoices li { padding:4px 10px 3px; border-top:1px solid #F1F1F1; } body form #locationChoices li:first-child { border:none; } body form #locationChoices ul li.selected, body form #locationChoices li:hover { cursor:pointer; color:#fff; background:#0053e9 url(/retail/locator/images/locator_locationChoices_hover20090224.jpg) top repeat-x; } li#recently-viewed-title, li#recently-viewed-store { display:none; } /* sosumi */ .sosumi { width:940px; margin:0 auto; margin-bottom:10px !important; padding:18px 20px 0; } ol.sosumi { margin-left:auto; padding-left:0; *padding-left:3px; } .sosumi a { color:#333; } .sosumi li { line-height:14px; padding-bottom:5px; margin-bottom:0; } ol.sosumi li { margin-left:2em; } .sosumi ul, .sosumi ol, .sosumi p { margin-bottom: 0; } /* Personal Shopping */ h3.personalshopping { margin-top:2.6em; } /* Genuis Bar */ .genuisbar { float:left; position:relative; width:100%; } .genuisbar.grid2col .column.first { width:44%; *width:43%; } .genuisbar.grid2col .column.last { width:45%; *width:55%; }