/* --------------------------------------------------------------------------------------------------------------------------------- LiquidShop v2.0 CSS Document Copyright Sitemakers Ltd. - http://www.sitemakers.co.uk /* --------------------------------------------------------------------------------------------------------------------------------- */ body { background:#eee; color:#616161; cursor:default; font-size:62.5%; font-family:Arial, Helvetica, sans-serif; margin:0; padding:0; text-align:center;} #wrapper { background:#fff; font-size:1.2em; margin:0 auto; max-width:1300px; text-align:left; width:100%; border:1px solid #ddd; border-width:0 1px;} /* --------------------------------------------------------------------------------------------------------------------------------- 1) RESETS & UNIVERSAL CLASSES /* --------------------------------------------------------------------------------------------------------------------------------- */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin:0; padding:0;} fieldset, img, abbr, acronym { border:0 none;} table { border-collapse:separate; border-spacing:0;} :focus { outline:0;} address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal;} caption, th { text-align:left;} h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal;} blockquote:before, blockquote:after, q:before, q:after { content:"";} span.hidden, .special_message { display:none;} legend.hidden { display:none;} label.hidden { display:inline; left:-9000px; position:absolute;} .nomargin { margin:0 !important;} .fleft { float:left;} .fright { float:right;} .clear { clear:both; height:0; line-height:0; visibility:hidden;} *[style], pre /* override inline styles */{ font-size:inherit !important; font-family:Arial, Helvetica, sans-serif !important;} .clearfix:after, dl:after { content:"."; display:block; height:0; clear:both; visibility:hidden;} #ie6 .clearfix, #ie6 dl, #ie7 .clearfix, #ie7 dl { display:inline-block;} /* --------------------------------------------------------------------------------------------------------------------------------- 2) TYPOGRAPHY /* --------------------------------------------------------------------------------------------------------------------------------- */ a { color:#1568b6; font-weight:normal; text-decoration:none;} a:hover { cursor:pointer; text-decoration:underline;} a:active { text-decoration:underline;} h1, h2, h3, h4, h5, h6, p { margin:0 0 15px 0;} p { line-height:1.6em;} h1 { font-size:1.8em;} h2 { font-size:1.5em; color:#2e3033;} h3 { font-size:1.2em; font-weight:bold;} h4, h5, h6 { font-size:1em; font-weight:bold; margin-bottom:7px;} ol, ul { margin-left:20px;} li { margin-bottom:3px;} input, select, textarea, optgroup { font:1em Arial, Helvetica, sans-serif;} strong { font-weight:bold;} em { font-style:italic;} acronym { font-weight:bold;} .pageheading { background:#3774ac; color:#fff; height:1%; margin:0; position:relative; padding:10px; overflow:hidden;} .pageheading .results { color:#ABCAE9;} .pageheading .smaller { display:block; font-size:0.6em;} .pageheading a { color:#fff; font-weight:bold;} .subheading { background:#dcecfb; color:#1e4467; font-size:1.2em; font-weight:normal; margin:0; overflow:hidden; padding:4px 0; width:100%;} .subheading span, .subheading a { color:#1e4467; float:left; padding:0 10px;} .subheading a { float:right;} /* Notices for error, warning and success messages */ .notice { margin-bottom:10px;} .notice * { margin:0 0 5px 0;} .notice.error { background:#ffeded; border:1px solid #f89090; color:#d10000; padding:2px;} .notice.warning { background:#fffced; border:1px solid #dfd292; color:#866c13; padding:2px;} .notice.success { background:#f3ffed; border:1px solid #c2e1b6; color:#51713d; padding:2px;} .notice.info { background:#dcedfc; border:1px solid #b7d4ee; color:#7294b2; padding:2px;} .notice .inner { margin:0 0 10px; padding:5px 15px;} .notice dl { padding-left:15px;} .notice dt { margin:5px 0 0; width:100%;} .notice dd { display:inline;} .results/*num results eg Electronics(43)*/{ color:#aaa; font-size:0.9em; font-weight:normal;} a:hover .results, a.selected .results { color:#4c4f57;} .comment/*below some inputs on page forms*/{ font-size:0.9em;} .smaller { font-size:0.9em ;} #cookie_message { margin:0;} /* --------------------------------------------------------------------------------------------------------------------------------- 3) BUTTONS LOGOS ICONS /* --------------------------------------------------------------------------------------------------------------------------------- */ .icon, .logo, .button { display:block; text-indent:-9000px;} input.button, input.icon { font-size:0px; line-height:0;} /* Buttons */ .button { border:0; cursor:pointer; font-size:1.2em; height:34px; width:154px;} .button.add { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -54px;} .button.moreinfo { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -504px;} .button.addsmall { background:#ff9900 url(/images/buttons.jpg) no-repeat -433px -57px; height:31px; width:76px;} .button.moreinfosmall { background:#ff9900 url(/images/buttons.jpg) no-repeat -433px -505px; height:31px; width:76px;} .button.move { background:#ff9900 url(/images/buttons.jpg) no-repeat -433px -158px; float:right; height:31px; width:76px;} .button.productadd { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -106px; height:37px;} .button.checkout { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -6px; margin:10px 0; width:167px;} .button.continueshop { background:#8290a9 url(/images/buttons.jpg) no-repeat -5px -152px; margin:10px 0;} .button.viewbasket { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -202px;} .button.editbasket { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -352px;} .button.newcustomer { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -252px; width:183px;} .button.returningcustomer { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -302px; width:183px;} .button.update { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -637px -36px; height:17px; width:51px;} .button.qtyneg { background:#8290a9 url(/images/buttons.jpg) no-repeat -629px -11px; height:16px; width:13px;} .button.qtypos { background:#8290a9 url(/images/buttons.jpg) no-repeat -682px -11px; height:16px; width:13px;} .button.continue { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -402px; margin:0 0 10px 0;} .button.editaddress { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -610px -76px; height:17px; width:78px;} .button.deleteaddress { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -597px -266px; height:17px; width:91px;} .button.back { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -630px -117px; height:20px; margin-top:14px; width:58px;} .button.signout { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -627px -166px; height:17px; width:61px;} .button.returnshop { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -598px -216px; height:17px; width:90px;} .button.vieworder { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -604px -306px; height:17px; width:84px;} .button.repeatorder { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -604px -346px; height:17px; width:84px;} .button.payatprotx { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -454px; width:163px;} .button.addaddress { background:#ff9900 url(/images/buttons.jpg) no-repeat -5px -552px;} input.button.remove { background:none; border:none; color:#70727a; display:inline; font-size:0.9em; height:auto; line-height:normal; text-indent:0; width:auto;} .button.change { background:#EBF0F5 url(/images/buttons.jpg) no-repeat -630px -386px; height:17px; width:58px;} /* Logos */ .logo.security { background:url(/images/logos.gif) no-repeat 0 -448px; height:65px; width:115px;} .logo.companylogo { background:url(/images/logos.gif) no-repeat left top; cursor:pointer; height:60px; width:274px;} .logo.companylogo:hover { background-position:left -160px;} .logo.liquidshop { background:url(/images/logos.gif) no-repeat left -536px; height:33px; margin:10px 0 0 0; width:137px;} /* Icons */ .icon { border:0; height:32px; width:32px;} .icon.remove { background:url(/images/icons.gif) no-repeat -884px -4px; cursor:pointer; float:left; height:16px; width:16px;} .icon.basketbig { background:url(/images/icons.gif) no-repeat 0 -664px; float:left; margin:-5px 10px 0 0; width:29px;} .icon.review { background:url(/images/icons.gif) no-repeat 0 -744px; float:left; margin:-5px 10px 0 0; width:29px;} .icon.emailfriend { background:url(/images/icons.gif) no-repeat 0 -789px; float:left; margin:-5px 10px 0 0; width:29px;} .icon.account { background:url(/images/icons.gif) no-repeat 0 -834px; float:left; margin:-5px 10px 0 0; width:29px;} .icon.ordersuccess { background:url(/images/icons.gif) no-repeat -55px -742px; margin:0 10px 0 0;} .icon.orderfail { background:url(/images/icons.gif) no-repeat -55px -704px; margin:0 10px 0 0;} .tick { background:#fff url(/images/icons.gif) no-repeat right -522px !important; border:1px solid #8F8F8F;} .cross { background:#ffeded url(/images/icons.gif) no-repeat right -335px !important; border:1px solid #f89090 !important;} .icon.soffer { background:url(/images/pngs.png) no-repeat 0 0; height:40px; width:40px;} #ie6 .icon.soffer/*dont use pngs in IE6 even with the alphatransparency fix unless absolutely necessary*/{ background:url(/images/pngs.gif) no-repeat 0 0;} .icon.viewlist { background:url(/images/icons.gif) no-repeat -38px -667px; border-color:#4a88c2; height:19px; padding:0; width:19px;} a:hover .icon.viewlist, .lselected .icon.viewlist { background-position:-63px -667px; border-color:#ABCAE9;} .icon.viewgallery { background:url(/images/icons.gif) no-repeat -88px -667px; border-color:#4a88c2; height:19px; padding:0; width:19px;} a:hover .icon.viewgallery, .gselected .icon.viewgallery { background-position:-113px -667px; border-color:#ABCAE9;} .icon.gbp { background:url(/images/logos.gif) no-repeat right -162px; height:13px; width:32px;} .icon.eur { background:url(/images/logos.gif) no-repeat right -146px; height:13px; width:32px;} .icon.usd { background:url(/images/logos.gif) no-repeat right -178px; height:13px; width:32px;} .icon.conditionnew { background:url(/images/icons.gif) no-repeat -432px -805px; height:18px; width:43px;} .icon.conditionused { background:url(/images/icons.gif) no-repeat -432px -835px; height:18px; width:43px;} .icon.conditionrefurbished { background:url(/images/icons.gif) no-repeat -432px -865px; height:18px; width:43px;} /* Star Rating Icons */ .star { float:left; height:14px; width:80px;} .star.star5 { background:url(/images/stars.gif) no-repeat 0 0;} .star.star4 { background:url(/images/stars.gif) no-repeat 0 -14px;} .star.star3 { background:url(/images/stars.gif) no-repeat 0 -28px;} .star.star2 { background:url(/images/stars.gif) no-repeat 0 -41px;} .star.star1 { background:url(/images/stars.gif) no-repeat 0 -55px;} .star.star0 { background:url(/images/stars.gif) no-repeat 0 -68px;} #stars input { float:left;} #stars acronym { float:right;} #stars span { display:block; height:20px; overflow:hidden; width:100%;} /* --------------------------------------------------------------------------------------------------------------------------------- 4) TEMPLATE STRUCTURE /* --------------------------------------------------------------------------------------------------------------------------------- */ /* Header */ #header { background:#5499d8; color:#fff;} #header #innerheader { background:url(/images/xgradients.gif) repeat-x left top; height:58px; padding-top:25px; position:relative; text-align:center; width:100%;} #header h1 { cursor:pointer; left:15px; margin-right:5px; position:absolute; top:7px; z-index:1;} #header a { color:#fff;} #header a:hover { color:#fff;} #header #innerimage { background:url(/images/logos.gif) no-repeat -292px -4px; width:320px; height:64px; position:absolute; top:5px; right:15px;} /* Search box */ #header #search { background:url(/images/xgradients.gif) no-repeat left -161px; height:24px; margin:0 auto; padding:10px; position:relative; top:0px; width:384px; text-align:left;} #ie6 #header #search, #ie7 #header #search { top:0;} #header #search select { width:145px;} #header #search #simpleSearch { background:#fff; border:1px solid #999; height:18px; line-height:18px; padding:0; position:relative; top:-1px; width:165px;} #header #search #searchgobutton { background:url(/images/logos.gif) no-repeat right -108px; border:none; color:#fff; cursor:pointer; font-size:1.2em; font-weight:bold; height:22px; position:absolute; right:10px; top:9px; width:66px;} #header .notice/*searchbox errors*/{ font-size:1.2em; left:37.5%; position:absolute; text-align:center; top:2px; width:25%; z-index:2;} /* Account box */ #header #account { position:absolute; right:15px; top:3px; width:auto;} #header #account a { border-bottom:1px solid #579ddd; padding:0; margin:0 0 0 6px; background:none; font-size:0.9em;} #header #account a:hover { text-decoration:none; border-bottom-color:#fff;} /* Phone number */ #header #contact { color:#99CBFF; font-size:1em; position:absolute; right:15px; display:block; top:25px;} #header #contact h2 span { color:#fff; font-size:1.3em; font-weight:bold;} /* Info pages */ #header #infopages { font-size:0.9em; width:380px; margin:0 auto; height:20px; position:absolute; top:3px; left:47%; margin-left:-150px; } #header #infopages dd { display:inline;} #header #infopages a { border-bottom:1px solid #579ddd; padding:0; margin:0 2px; background:none; white-space:nowrap; position:relative; cursor:pointer;} #header #infopages a:hover { text-decoration:none; border-bottom-color:#fff;} /*EXTRA CSS -> look in css/basket for #minibasket basket styles if set to be in header*/ /*EXTRA CSS -> look in css/nav for header #nav styles*/ /* Page Layout */ /*EXTRA CSS -> look in css/columns for page layout widths*/ #content { border-left:190px solid #fff; border-right:190px solid #fff; display:block; position:relative;} #ie6 #content { border-right-color:#fff;} #inner { display:block; overflow:hidden; padding:5px 0;} #left, #right { position:relative;} #left { float:left; left:0px;} #left .inner { padding:0 0 0 15px; margin-top:20px;} #right { float:right; right:0px;} #right .inner { padding:0 15px 0 0; margin-top:20px;} #centre { display:block; height:1%; padding:0; position:relative;} #centre .inner { overflow:hidden; padding:0 7px;} #centre.homepage { margin-top:20px} #ie7 #centre.homepage { margin-top:25px} /* Footer */ #footer { background:#dfeffe url(/images/xgradients.gif) repeat-x 0 -393px; color:#4a88c2; clear:both; margin-top:10px; max-width:1300px; overflow:hidden; padding-top:15px; position:relative; text-align:left; width:100%;} #footer #superfooter a { color:#4a88c2; background:url(/images/icons.gif) no-repeat -11px -258px; border:none; display:inline; padding:0 0 0 10px;} #footer h3 { font-size:1.4em; margin:0;} #footer dl { margin-bottom:10px;} #footer #directory { background:none; border:none; float:left; width:54%; margin-left:20px;} #footer #directory a { font-size:1.2em; font-weight:normal;} #footer #directory dd { margin-bottom:6px;} #directory dl.sitemaplist { float:left; margin-right:3px; width:48%;} #directory dl.sitemaplist a { background:none; border-bottom:1px solid #ABCAE9; float:left; margin-right:8px; padding:0; white-space:nowrap;} #directory dl.sitemaplist dt { margin-bottom:-2px;} #directory dl.sitemaplist dt a { border:none; float:none; margin-bottom:0;} #directory dl.vlist dd { float:left; margin-right:3px; width:48%;} #directory dl.vlist dd a { border:none; float:none; font-weight:bold; margin-bottom:0;} #footer #services { background:none; border:none; float:right; margin:0 20px 10px 0; width:35%;} #services p { margin:-4px 0 10px 0;} #services a { font-weight:bold;} #footer #subfooter { background:#4a88c2; color:#fff; clear:both; display:block; padding:10px 20px; position:relative;} #subfooter #copyright { left:20px; position:absolute; top:5px;} #subfooter #copyright span { font-size:1.6em; position:relative; top:4px;} #subfooter .vcard { line-height:normal; text-align:center;} #subfooter .vcard p { margin:0;} #subfooter .logo.liquidshop { position:absolute; right:20px; top:-3px;} /* --------------------------------------------------------------------------------------------------------------------------------- 5) CENTRE COLUMN SPECIFIC STYLES /* --------------------------------------------------------------------------------------------------------------------------------- */ /* Box for border on all content sections */ .box, .rtecontent { background:#fff; border:1px solid #abcae9; height:1%; margin-bottom:10px; position:relative;} #ie6 .box { width:99.7%;} .rtecontent { padding:15px 10px 20px 10px;} .box .inner { height:1%; overflow:hidden; padding:10px 10px !important;} .box .hlist { margin:10px 5px;} .box .hlist.collist { margin:0;} .clearer { width:100%; overflow:hidden;} /* Rounded Box borders */ .b { display:block; width:11px; height:11px; background:url(/images/icons.gif) no-repeat 0 -903px; position:absolute; overflow:hidden;} .tl { top:-1px; left:-1px;} .tr { top:-1px; right:-1px; background-position:-11px -903px;} .bl { bottom:-1px; left:-1px; background-position:0 -914px;} .br { bottom:-1px; right:-1px; background-position:-11px -914px;} #ie6 .tr, #ie6 .br { right:-2px;} #ie6 .br, #ie6 .bl { bottom:-2px;} #ie6 .pageheading .b { height:8px;} .pageheading .bl, .pageheading .br { display:none;} .catlist .tl, .catlist .tr { display:none;} /* Columns within centre for login/address etc in checkout */ .col2 { width:49%;} .col2 div { background:none; border:1px solid #dfe9f1; margin:0 0 15px 0; padding:10px;} .col3 { width:32%;} .col3.fleft { margin-right:2%;} .col3 div { background:none; border:1px solid #dfe9f1; margin:0 0 15px 0; padding:10px;} .col3 #delivery_comments, .col3 #order_reference { display:block; width:98%;} .col3 strong { display:block;} /* Breadcrumbs */ #crumbs, #crumbsbasket { font-size:0.9em;} #crumbs { background:none; border:none; margin-bottom:5px; padding:0; overflow:hidden;} #crumbs dt { color:#7d91a3; padding:0; padding-left:4px;} #crumbs dd { margin-right:2px; padding:0;} #crumbs a { background:url(/images/icons.gif) no-repeat -8px -68px; padding:4px 4px 4px 10px; color:#4c7ba4;} #crumbsbasket { margin:0 5px 5px; width:auto; overflow:hidden; border:none;} #crumbsbasket dd { color:#aaa; display:block; float:left; padding:2px 6px; text-align:center; width:22.5%;} #crumbsbasket .complete { background:#fff; color:#4c4f57; font-weight:bold;} #crumbsbasket .selected { text-decoration:underline;} /* Centre Banner */ #banner { display:block; margin:0 0 10px; text-align:center;} /* Imgholder - change the valign to move the image position*/ .imgholder { background:#fff; display:table-cell; height:133px; overflow:hidden; text-align:center; vertical-align:bottom; width:23.5%;} .imgholder span { display:inline-block; height:130px; vertical-align:bottom;} .caption { display:block;} /* Vertical Lists */ .vlist { } .vlist dd a { background:#fff url(/images/icons.gif) no-repeat 0 2px; display:block; padding:4px 10px 4px 23px;} .vlist dd a:hover { background:#f4faff url(/images/arrowanim.gif) no-repeat 10px 8px;} /* Horizontal Lists */ .hlist { } .hlist dd, .hlist dt { float:left; padding:2px 0; margin-right:5px;} .hlist dd a, .hlist dt { background:url(/images/icons.gif) no-repeat -6px -2px; padding-left:15px;} .hlist dt, .hlist dt a { background:none; font-weight:bold;} .hlist dt strong, .hlist dt strong a { display:block; text-transform:uppercase; width:150px;} .hlist img { margin-right:3px;} .hlist dd a:hover { background:url(/images/arrowanim.gif) no-repeat 4px 4px;} .hlist dd.selected a { font-weight:bold; text-decoration:underline;} /* Image Based Lists */ .imglist { padding-bottom:4px;} .imglist a { background:#fff; border:1px solid #fff; text-decoration:underline; cursor:pointer; display:block; float:left; font-weight:bold; overflow:hidden; font-weight:bold; height:150px; margin:4px 0 0 4px; padding:3px 0; text-align:center; width:18.5%;} #ie6 .imglist a { margin-left:3px;} .imglist .imgholder { height:130px;} .imglist a:hover { border:1px solid #4A88C2;} .imglist .selected a { border:1px solid #4A88C2; font-weight:bold; text-decoration:underline;} .imglist .caption { white-space:nowrap;} /* Home Page Lists - recommended brands, cats, specialcats imglists */ #fbrands { background:#cadff2;} #fbrands dt { background:#5893ca; font-weight:bold;} #fbrands dt span { color:#fff;} #fbrands dd a { height:40px; vertical-align:middle;} #fbrands .imgholder, #fbrands .imgholder span { height:35px;} #ie6 #fbrands .imgholder span,#ie7 #fbrands .imgholder span { display:none;} #fcategories { background:#CADFF2;} #fcategories dt { background:#5893ca; font-weight:bold;} #fcategories dt span { color:#fff;} #fcategories dd a { height:135px; color:#2e3032;} #fcategories dd a .caption { white-space:normal;} #fcategories .imgholder, #fcategories .imgholder span { height:103px;} #fspecialcats dt { display:none;} #fspecialcats dd a { height:85px;} #fspecialcats .imgholder, #fspecialcats .imgholder span { height:70px;} #fproducts { border:none; margin:0;} #fproducts .b { display:none;} #fproducts dt { display:none;} #fcontent .rtecontent { border:none; padding:0;} #fcontent .b { display:none;} /* Subcategories */ .catlist { padding:0; margin:5px 0;} .catlist a { border-color:#dfe9f1; height:130px; margin:0 1% 3px 0; padding:3px; width:100px;} #ie6 .catlist a { margin-right:0px;} .catlist .imgholder, .catlist .imgholder span { height:100px;} .catlist a:hover { border-color:#abcae9;} .catlist .caption { white-space:normal;} /* Tabs used on Product page and cat pages */ .tabs { background:#619bd1; font-size:1.2em; position:relative;} .tabs dd { padding:0; margin:0;} .tabs dd a { background:#619BD1; border:none; display:block; border-right:1px solid #ABCAE9; color:#fff; padding:6px 10px; text-decoration:none;} .tabs dd a:hover { background:#4A88C2;} .tabs dd a.selected, .tabs dd a#active { background:#4A88C2; font-weight:bold; text-decoration:none;} .tabs .results { color:#ABCAE9;} .tabs a:hover .results { color:#fff;} /* Page chooser, view mode and sort by lists for pagination */ .sortbar { background:#4A88C2; height:25px; margin-bottom:15px; position:relative; padding:5px 0; width:100%; color:#1e4467;} .sortbar select { float:left; margin:0 2px 0 3px; width:85px;} .sortbar .bl, .sortbar .br { bottom:0;} .sortlist { color:#fff; height:1%; margin:0 6px; width:auto;} .sortlist dd { float:left;} .sortlist dd a, .sortlist dt { border:1px solid #83b6e6; color:#fff; float:left; margin:0 3px 0 0; padding:2px 4px;} .sortlist dt { border:none; font-weight:bold; margin:0; padding:2px 4px 0 0;} .sortlist dd a:hover, .sortlist a.selected, .sortlist a.lselected, .sortlist a.gselected { background-color:#7eb1e1; color:#fff; text-decoration:none;} .sortlist.perpage { float:left;} .sortlist.page { float:right;} .sortlist.page dd a { background:#7eb1e1; color:#fff;} .sortlist.page .selected, .sortlist.page a:hover { background:#3774AC;} .sortlist.page .disabled, .sortlist.page .disabled:hover { display:none;} .sortlist.page .separator, .sortlist.page .separator:hover { background:none; border:none; cursor:default; padding:2px 0;} .sortlist.view { float:left; margin:0 0 0 5px;} .sortlist.view a { padding:0 4px 0 2px;} .sortlist.view strong { float:left; font-weight:normal; padding:2px 0;} .sortlist.view .icon { float:left; margin-right:2px; padding:0;} /* Input Forms for signup etc */ .textlist { clear:both; margin-bottom:20px;} .textlist dd, .textlist dt { overflow:hidden; position:relative; width:100%;} .textlist .subheading { margin-bottom:5px;} .textlist .hr { border-bottom:1px solid #dfe9f1; margin:15px 0;} .textlist .comment { clear:both; display:block; margin-left:180px;} #ie6 .textlist .comment { margin-left:190px;} .textlist .notice { border-width:0px; display:block; font-size:0.9em; margin:0 0 0 5px; max-width:200px; padding:0 1px; width:100%;} .textlist .small + acronym + .notice { width:120px;} .textlist .col { display:block; float:left; padding:3px 0 3px 1%;} .textlist .col#stars { width:110px;} #ie6 .textlist .col { padding:3px 0 3px 3px;} .textlist .col.lcol { margin-right:15px;} .textlist .col.mcol { margin-left:10px; width:62%;} .textlist .col.rcol { float:right; width:100px;} .textlist .col.rcol .button { margin-bottom:3px;} .textlist .col.label { font-weight:bold; margin-left:10px; padding:7px 0 0 0; text-align:right; width:160px;} #ie6 .textlist .col.input { width:320px;} .textlist .col.input input, .textlist .col.input select, .textlist .col.input textarea { border:1px solid #8F8F8F; margin-left:5px; padding:2px 0; width:200px;} .textlist .col.input input.checkbox, .textlist .col.input input.button { border:none; padding:0; width:auto;} .textlist .col.input input.button.returningcustomer { width:183px;} .textlist .col.input .small { width:120px;} .textlist .col.input .large { width:300px;} .textlist.largelist { border-top:1px solid #dfe9f1; margin-bottom:15px;} .textlist.largelist dd { border-bottom:1px solid #dfe9f1; padding:10px 0;} .textlist.largelist strong, .textlist.largelist .price { display:block; font-size:1.2em; font-weight:bold;} .textlist.largelist .price { text-align:right;} .textlist.largelist .rcol .fright { margin-right:10px;} /* --------------------------------------------------------------------------------------------------------------------------------- 6) LEFT / RIGHT COLUMN SPECIFIC STYLES /* --------------------------------------------------------------------------------------------------------------------------------- */ /* Sideboxes */ .column dl { background:#fff; width:165px; margin-bottom:10px;} /*EXTRA CSS -> look in css/sideborder for column list borders*/ .column dt.title { background:#4a88c2; color:#fff; display:block; font-size:1.2em; letter-spacing:-0.03em; padding:0 7px 3px; font-weight:bold;} .column dt.title span { display:block; margin-top:-3px;} /*EXTRA CSS -> look in css/sidetitle for column list titles*/ .column .sub0 a { background:#fff url(/images/icons.gif) no-repeat -6px 2px; padding:2px 2px 2px 15px; color:#494949; font-weight:normal;} .column .sub0 a:hover { background:#fff url(/images/icons.gif) no-repeat -6px 2px; color:#2f2f2f;} .column .sub0.selected a { background:#fff url(/images/icons.gif) no-repeat -6px 2px; color:#2f2f2f; font-weight:bold;} .column .sub1 a { background:#fff url(/images/icons.gif) no-repeat -6px 2px; padding:4px 4px 4px 15px; color:#494949; border-top:1px solid #eee;} .column .sub1 a:hover { background:#f5faff url(/images/icons.gif) no-repeat -6px 2px; color:#2f2f2f;} .column .sub1 a.selected { background:#f5faff url(/images/icons.gif) no-repeat -6px 2px; color:#2f2f2f; text-decoration:underline;} .column .sub1.bottom a {} .column .sub2 a { background:#fff url(/images/icons.gif) no-repeat 6px -134px; padding:4px 4px 4px 25px; color:#494949;} .column .sub2 a:hover { background:#fff url(/images/icons.gif) no-repeat 6px -134px;} .column .sub2 a.selected { font-weight:bold;} .column .sub2.bottom a {} .column select { margin:10px 5px; width:148px;} .column .scrollable .scroller { display:block; max-height:230px; overflow:auto;} .column .imglist dd a { background:#fff; border-width:1px 0 0; font-weight:normal; height:30px; margin:0; padding:0; text-align:left; width:100%;} .column .imglist dd a:hover { background:#f4faff; text-decoration:none;} .column .imglist dd img { margin:1px 0 1px 10px;} .column#right dl { float:right;} #categories dt.title { background:#205385 url(/images/xgradients.gif) no-repeat -0 -358px;} #categories .sub0 a { background:#ddecfb url(/images/xgradients.gif) no-repeat -0 -283px; border-top:1px solid #ddecfb; border-bottom:1px solid #bdcedf; font-weight:bold; color:#174f85; padding:4px 4px 4px 8px;} #categories .sub0 a:hover { background:#ddecfb url(/images/xgradients.gif) no-repeat 0 -283px; text-decoration:underline;} #categories .sub0 a.selected { background:#3775ad url(/images/xgradients.gif) no-repeat 0 -318px; border-top:1px solid #6aaae4; color:#fff;} /* Side Banners*/ .column .banners { background:none; border:none; padding:0; text-align:center; width:165px;} .column .banners dd { border:none; background:none; margin:0; padding:0;} /* Refine Results box */ #refine { z-index:1;} #refine .inner { overflow:visible;} #refine #fbrands { margin-bottom:10px;} #refine #fbrands a { border-color:#E3E7EC; margin:2px 2px 0 0; width:24%;} #refine #fbrands a:hover { border-color:#BCC4CE;} #refine .hlist dd { position:relative; z-index:1;} #refine input { background:#fff url(/images/icons.gif) no-repeat right -741px; border:1px solid #ABADB3; color:#4c4f57; cursor:pointer; padding:2px 18px 2px 5px; width:125px;} #refine input:hover { background:#fff url(/images/icons.gif) no-repeat right -865px;} /*EXTRA CSS -> look in css/filters for #refine filters */ #refine .selectpop { background:#fff; border:1px solid #999; left:0px; margin:-1px 0 0; height:expression( this.scrollHeight > 279 ? "280px" : "auto" );/*sets max-height forIE*/ max-height:280px; overflow:auto; padding:0; position:absolute; z-index:5; width:160px;} #ie6 #refine .selectpop, #ie7 #refine .selectpop { margin-top:21px;} #refine .selectpop dd { float:none; background:#fff; margin:0; padding:0;} #refine .selectpop a { background:none; border:none; color:#000; display:block; margin:0; padding:1px 0;} #refine .selectpop dd a:hover { background:#3399ff; color:#fff; text-decoration:none;} #refine .selectpop em { font-style:normal;} #refine .selectpop a:hover em { color:#fff;} #refine .selectpop dd span { display:block; padding:1px 2px;} #refine .selectpop .sub0 a, #refine .selectpop .sub0 span { border-top:1px solid #E3E6F0; padding-top:3px;} #refine .selectpop .sub1 a, #refine .selectpop .sub1 span { background:url(/images/icons.gif) no-repeat -5px -138px; padding-left:14px;} #refine .selectpop .sub2 a, #refine .selectpop .sub2 span { background:url(/images/icons.gif) no-repeat 9px -138px; padding-left:28px;} /* Shopping Basket */ /*EXTRA CSS -> look in css/basket for #minibasket shopping basket if set to be right_side_nav */ /* Promotion Code box */ #promotions { } #promotions dd { overflow:hidden; padding:10px 5px; width:100%;} #promotions label { display:block; font-size:0.9em; margin-bottom:3px;} #promotions #voucher { margin-right:3px; width:100px;} #promotions input { float:left;} /* --------------------------------------------------------------------------------------------------------------------------------- 7) PRODUCT DISPLAY LISTS /* --------------------------------------------------------------------------------------------------------------------------------- */ /* Elements used in both list views */ .prodlist { padding-bottom:10px;} #centre .prodlist dd { border-bottom:1px solid #ebebeb; overflow:hidden; position:relative;} #ie6 #centre .prodlist dd .imgholder { display:block; height:130px; width:auto;} #ie6 .prodlist .imgholder span { display:none;} .prodlist .product { margin:5px; text-align:center;} .prodlist .soffer { left:5px; position:absolute; top:5px;} .prodlist .desc { text-align:left;} .prodlist .desc h3 a { font-weight:bold; color:#2e3032;} .prodlist .desc p { line-height:normal; margin:0; color:#91959b;} .prodlist .cost { text-align:left;} .prodlist .cost .offertext, .prodlist .cost .offertext a { color:#ff5400; display:block;} .prodlist .cost .offerexpiretext { display:block;} .prodlist .cost .price { font-size:1.4em; font-weight:bold;} .prodlist .cost .pricenow { color:#ff5400;} .prodlist .cost .pricewas { font-size:1.1em; padding:0 5px; text-decoration:line-through;} .prodlist .cost .pricewas .price { font-size:1em; font-weight:normal;} .prodlist .cost .pricevat { display:block; position:relative; top:-3px;} .prodlist .cost .message /*for out of stock/has opts*/{ display:block; margin-bottom:6px; position:relative; top:-3px;} .prodlist .controls { float:right; width:75px;} .prodlist .qty { display:none;} .prodlist .more { white-space:nowrap;} .prodlist .more:hover { border-bottom:none;} /* Gallery View */ .prodlist.galleryview { } .prodlist.galleryview dd { float:left; height:263px; margin:2px 0 0 1%;} #ie6 .prodlist.galleryview dd { margin:2px 0 0 3px;} .prodlist.galleryview .icon { left:5px; position:absolute; top:110px;} .prodlist.galleryview .soffer { top:90px;} .prodlist.galleryview .star { display:inline; position:static;} /*EXTRA CSS -> look in css/prodbox for galleryview % widths */ .prodlist.galleryview .imgholder { text-align:left;} .prodlist.galleryview .desc h3 { font-size:1.1em; margin:2px 0 5px 0;} .prodlist.galleryview .desc p { display:none;} .prodlist.galleryview .cost { background:#fff; bottom:32px; height:59px; left:5px; position:absolute; width:100%;} .prodlist.galleryview .buttons { bottom:6px; left:3px; margin:0; overflow:hidden; position:absolute; width:100%;} .prodlist.galleryview .buttons * { float:left;} .prodlist.galleryview .cost .message { font-size:0.9em;} /* List View */ .prodlist.listview { } .prodlist.listview dd { margin:5px 0; width:98%;} .prodlist.listview .icon { left:56%; position:absolute; top:5px;} .prodlist.listview .star { display:inline; position:static;} .prodlist.listview .soffer { display:none;} .prodlist.listview .imgholder { float:left; height:40px !important; width:40px;} .prodlist.listview .imgholder span { display:none;} .prodlist.listview .desc { float:left; margin:0 4% 5px 10px; width:52%;} .prodlist.listview .desc h3 { margin:0 0 3px 0;} .prodlist.listview .cost { float:left; font-size:0.9em; width:18%;} .prodlist.listview .cost .offertext a, .prodlist.listview .cost .message { font-weight:normal; margin:0;} .prodlist.listview .button { float:right;} /* Modified Gallery view - for Recommended products */ .prodlist.featured { } .prodlist.featured dd { height:300px; border:none;} .prodlist.featured .desc h3 a { font-size:1em;} .prodlist.featured .desc p { display:block; margin:0;} .prodlist.featured .cost { bottom:0; padding-top:2px;} .prodlist.featured .buttons { display:none !important;} /* Modified Gallery view - for related products on product page when in 2cols and set to show related on right */ #psuedowrapper /*wrapper for product/cart*/ { float:left; width:81%;} .prodlist#relatelist /*wrapper for relateds*/ { width:18%; float:right;} .prodlist#relatelist dd { width:100%; overflow:hidden; margin:0 0 3px; height:auto; border:none; border-top:1px solid #dfe9f1;} .prodlist#relatelist .imgholder { text-align:left;} .prodlist#relatelist .text { float:left; width:112px;} .prodlist#relatelist .desc h3 { font-size:1.1em; margin:0; max-width:130px;} .prodlist#relatelist .desc p { display:none;} .prodlist#relatelist .cost { font-size:0.9em; position:static; height:auto; max-width:130px;} .prodlist#relatelist .cost .message { margin:0;} .prodlist#relatelist .buttons { display:none;} .prodlist#relatelist .soffer { display:none;} .prodlist#relatelist .offertext { display:none !important;} .prodlist#relatelist .message { display:none;} .prodlist#relatelist .star { display:none;} #cart .prodlist#relatelist dt /*when on cart page make it smaller*/{ font-size:1em; font-weight:bold;} #cart .prodlist#relatelist dd { margin:0;} #cart .prodlist#relatelist .imgholder { float:left; height:40px; margin-right:5px; width:40px;} #cart .prodlist#relatelist .cost { font-size:0.8em;} #cart .prodlist#relatelist .desc h3 { font-size:1em; max-width:none;} /* Modified List view - used on email a friend, stock reminders */ .prodlist.viewer { margin-bottom:15px;} .prodlist.viewer dd { margin:0 5px;} .prodlist.viewer .cost, .prodlist.viewer .button, .prodlist.viewer .more { display:none;} /* Modified List view - used on product page to show the buy this+this offers */ .prodlist.offerlist { } .prodlist.offerlist dt { background:#3774AC;} .prodlist.offerlist .imgholder { float:left; margin:5px;} .prodlist.offerlist .plus { float:left; font-size:1.3em; margin:15px 0 0;} .prodlist.offerlist .desc { margin:5px 0 0 10px; width:40%;} .prodlist.offerlist .desc h3 { font-size:1.2em;} .prodlist.offerlist .cost { margin:5px;} .prodlist.offerlist .cost .save { display:block; font-size:1.3em; position:relative; top:-3px;} .prodlist.offerlist .cost .price_preword { color:#ff5400; font-size:1.4em; font-weight:bold;} .prodlist.offerlist .button { background:#ff9900 url(/images/buttons.jpg) no-repeat -433px -108px; margin:5px;} /* Left/Right Column Product Lists */ .prodlist.sidelist { padding-bottom:0;} .prodlist.sidelist a { color:#2f2f2f !important; font-weight:normal !important;} .prodlist.sidelist dd { border-top:1px solid #e3e6f0; overflow:hidden; padding:0 0 5px; width:99%;} .prodlist.sidelist .imgholder { float:left; height:40px; margin-right:5px; width:40px;} .prodlist.sidelist .imgholder span { display:none;} .prodlist.sidelist .text /*used to align text next to image*/ { float:left; width:100px;} .prodlist.sidelist .desc h3 { font-size:1em; margin:0;} .prodlist.sidelist .desc p { display:none;} .prodlist.sidelist .cost { font-size:0.8em;} .prodlist.sidelist .cost .message { margin:0;} .prodlist.sidelist .button { display:none;} .prodlist.sidelist .soffer { display:none;} .prodlist.sidelist .offertext { display:none !important;} .prodlist.sidelist .message { display:none;} .prodlist.sidelist .star { display:none;} /* --------------------------------------------------------------------------------------------------------------------------------- 8) PAGE SPECIFIC STYLES /* --------------------------------------------------------------------------------------------------------------------------------- */ /* Product Page */ #product .box#overview { padding:10px 0 25px 0;} #product #brandlogo { float:right;} #product #imagewrapper { float:left; margin:0 5px; text-align:center; width:250px;} #product #imagewrapper #prod_img { margin-bottom:10px; position:relative;} #product #imagewrapper #prod_img span { display:none;} #product #imagewrapper #prod_img a:hover { cursor:pointer; cursor:-moz-zoom-in;} #product #imagewrapper #prod_img a:hover span { background:#fff url(/images/icons.gif) no-repeat -432px -662px; border:1px solid #abcae9; display:block; left:20%; padding:5px 5px 5px 30px; position:absolute; text-align:left; text-decoration:none; top:45%; width:110px;} #product #imagewrapper #poptThumbs dd { display:inline; margin-right:1px;} #product #imagewrapper #poptThumbs img { border:2px solid #fff;} #product #imagewrapper #poptThumbs a:hover img, #product #imagewrapper #poptThumbs .optsel img { border:2px solid #ff5400;} #product #summary { height:1%; margin:0 5px 0 0; overflow:auto; position:relative;} #product #summary #activeAjax { height:32px; position:absolute; right:0; top:0; width:32px;} #product #summary .offertext { color:#ff5400; display:block;} #product #summary .offerexpiretext { color:#ff5400; display:block;} #product #summary .cost dd { display:inline;} #product #summary .cost .pricenow .price { color:#ff5400; font-size:1.8em; font-weight:bold;} #product #summary .cost .pricenow .pre { color:#ff5400; font-size:1.2em; font-weight:bold;} #product #summary .cost .pricenow .post { color:#aaa; font-size:0.7em; font-weight:normal;} #product #summary .cost .pricewas { font-size:1.1em; text-decoration:line-through;} #product #summary .cost .pricewas .pre { text-decoration:none;} #product #summary .cost .pricevat { display:block; position:relative; top:-3px;} #product #summary .message { display:block; margin:-2px 0 10px;} #product #summary #attriblist { margin:0 0 10px;} #product #summary #attriblist dd a { background:none; margin-right:5px; padding:0;} #product #summary #product_options { margin-bottom:10px;} #product #summary #product_options dd { padding-bottom:4px;} #product #summary #product_options select { width:250px;} #product #summary #product_options .arw_holder { margin:0 0 0 5px;} #product #summary #product_options .notice { border-width:0px; display:block; font-size:0.9em; margin:0; max-width:250px; padding:0 1px; width:100%;} #product #summary #qtybox { display:none; font-size:1.4em; vertical-align:middle;} #product #summary #qtybox label { line-height:22px;} #product #summary #qtybox #qty { height:16px; line-height:16px; width:23px;} #product #summary #details { margin-bottom:10px; width:270px;} #product #summary #details dt /* for out of stock notice*/{ border-bottom:1px solid #dfe9f1; float:left; margin-right:5px; padding-top:5px; width:70px;} #product #summary #details dd /* for out of stock notice*/{ margin-bottom:1px; padding-top:5px;} #product #summary #details dt.notice { border:0; font-weight:bold; margin:7px 0 0 4px; padding:0;} #product #summary #details dd.notice { margin:2px 0 0; padding-bottom:5px;} #product #summary #details .icon { text-align:left;} #product #summary #details a { border-bottom:1px solid #abcae9; color:#3b4d5d;} #product #summary #details acronym { font-weight:normal;} #product .hlist.tabs { background:none; bottom:-1px; position:relative; z-index:2;} #product .hlist.tabs dd { margin:0;} #product .hlist.tabs dd a { color:#fff;} #product .hlist.tabs dd a:hover { color:#fff;} #product .hlist.tabs dd a#active { background:#fff; border:1px solid #abcae9; border-bottom:none; color:#4C4F57;} #product .hlist.tabs dd a#active .results, #product .hlist.tabs dd a#active:hover .results { color:#aaa;} #product #reviews { clear:none;} #product #reviews h3 { text-align:center;} #product #reviews h3 a { color:#ff5400;} /* Lightview - used on product page and for RTE created popups on info pages */ #lightbody { background:#fff; font:62.5% Arial, Helvetica, sans-serif; padding:5px; text-align:left;} #lightbody #wrapper { background:#fff;} #lightbody .inner { padding-bottom:0;} #lightbody p { line-height:normal;} #lightbody strong.restrict { background:#fff url(/images/icons.gif) no-repeat -889px -335px; color:#4c4f57; font-size:1.2em; padding-left:10px;} /* Shopping basket - also used on shopping basket confirm and account previous orders */ .textlist.basket dd, .textlist.basket dt { border-bottom:1px solid #dfe9f1; margin-bottom:0;} .textlist.basket dt { padding:0; text-indent:0;} .textlist.basket dd .col { border-left:1px solid #fff; border-right:1px solid #dfe9f1; min-height:125px;} #ie6 .textlist.basket dd .col { height:125px;} .textlist.basket dt .col { border-left:1px solid #fff; border-right:1px solid #B0BBCC; font-weight:normal; min-height:20px;} #ie6 .textlist.basket dt .col { height:20px;} .textlist.basket dd .col.price { border-right:none; text-align:right; width:13%;} .textlist.basket .subheading .col.price { border-right:none; text-align:right; width:13%;} .textlist.basket .blabel, .textlist.basket .total { display:block; float:left; padding:5px 0; text-align:right; width:55%;} .textlist.basket .imgholder { float:left; height:130px; margin-right:10px; width:130px;} .textlist.basket .col.item { text-align:left; width:54.5%;} .textlist.basket .col.item a { color:#333333;} .textlist.basket .subheading .col.item { border-left:none;} .textlist.basket .col.unit { text-align:center; width:12%;} .textlist.basket .col.qty { text-align:center; width:15%;} .textlist.basket .col.qty strong { display:block; margin:0 auto; margin-bottom:4px; width:64px;} .textlist.basket .col .pricewas { display:block; font-weight:normal; text-decoration:line-through;} .textlist.basket .col .pricevat { display:block; font-size:0.8em; font-weight:normal;} .textlist.basket .col input.qty { font-weight:bold; text-align:center; width:25px;} .textlist.basket .totals { background:#f4faff; font-size:1.2em; margin-left:56%; width:44%;} .textlist.basket .total { float:right; padding-right:3px; width:32%;} .textlist.basket .totals#grandtotal { font-weight:bold;} .textlist.basket .col em { display:block; font-style:normal;} .textlist.basket .col b { font-size:1.2em;} .textlist.basket .button { margin:0;} .textlist.basket .col.qty .qtyneg { float:left; margin-top:1px;} .textlist.basket .col.qty .qtypos { float:left; margin-top:1px;} .textlist.basket .col.qty input.qty { float:left; margin:0 1px;} .textlist.basket .col.qty .update { clear:both; left:5px; position:relative; top:3px;} #ie6 .textlist.basket .col.qty .update, #ie7 .textlist.basket .col.qty .update, #ie7 .textlist.basket .col.qty .remove { left:-3px; position:relative;} #ie6 .textlist.basket .col.qty .remove { left:12px; position:relative;} .textlist.basket .extrainfo { border:none; float:right; margin:15px 0 0; width:44%;} .textlist.basket .extrainfo div.notice { border-width:1px; font-size:1em; margin:0; max-width:none; padding:0 2px 5px; width:auto;} .textlist.basket .promotion .col { border:none; height:auto; min-height:20px;} #ie6 .textlist.basket dd.promotion .col { height:30px;} .textlist.basket .promotion .col.desc { width:68%;} .textlist.basket .promotion h3 { margin:0;} .textlist.basket .promotion .icon.scissors { margin:0 25px 0 0; position:relative; top:-20px;} .textlist.basket .promotion .icon.soffer { float:left; margin:0 45px;} .textlist.basket .promotion.voucher { border:3px dotted #ccc; border-width:3px 0; margin:3px 0;} .textlist.basket .promotion.offer .col.desc { width:84.5%;} /* Login Page */ #signin form { position:relative;} #signin .col { margin-top:4px; padding:0;} #signin .textlist .col.label { margin:0; max-width:100px; padding:7px 0 0; width:35%;} #signin .textlist .col.input { width:60%;} #signin .textlist .col.input input { height:18px; max-width:170px; width:100%;} #signin .textlist .notice { max-width:170px;} #signin .button { bottom:10px; position:absolute; right:10px;} #signin .col2 div { min-height:150px; padding:5px 10px 25px; position:relative;} #ie6 #signin .col2 div { height:160px;} /* Orders section of Account pages */ #orders.textlist .col.mcol { width:50%;} #orders.textlist .col.rcol { width:100px;} #orders.textlist .col .row { background:url(/images/icons.gif) no-repeat -10px -2px; display:block; padding-left:14px;} #orders .textlist.basket .col.qty { width:20%;} #orders .textlist.basket .col.price { width:21%;} #orders .textlist.basket .promotion .col.desc { width:76.5%;} /* Sitemap */ .sitemaplist { margin:0 0 10px 0;} .sitemaplist a { background:url(/images/icons.gif) no-repeat -6px -2px; display:inline; margin-bottom:2px; padding-left:15px;} .sitemaplist dt { clear:both; font-weight:bold;} .sitemaplist dt a { background:none; font-weight:bold; padding:0;} .sitemaplist .sub1 a { background:#fff url(/images/icons.gif) no-repeat 5px -139px; padding-left:25px;} .sitemaplist .sub2 a { background:#fff url(/images/icons.gif) no-repeat 15px -139px; padding-left:35px;} .sitemaplist .sub3 a { background:#fff url(/images/icons.gif) no-repeat 25px -139px; padding-left:45px;} /* slideshow for homepage */ #slideshow_wrapper, #slideshow_wrapper .slide { width:600px; height:200px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px;} #ie6 #slideshow_wrapper, #ie6 #slideshow_wrapper .slide { width:600px;} #slideshow_wrapper { display:block; margin:0 auto 10px auto; text-align:center; overflow:hidden; position:relative; border:1px solid #87B1DA;} #slideshow_wrapper .slide { float:left;} .slideshow_controls { position:absolute; top:7px; right:7px;} .slideshow_controls dd { float:left; margin-left:2px;} .slideshow_controls a { background:#fff; background:rgba(255,255,255,0.7); color:#555; text-shadow:1px 1px 0 #fff; display:block; padding:2px 6px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;} .slideshow_controls a:hover { background:#aaa; background:rgba(255,255,255,1); text-decoration:none;} .slideshow_controls a.selected { background:#333; background:rgba(0,0,0,0.7); color:#fff; text-shadow:1px 1px 0 #000; cursor:default; text-decoration:none;} /* main nav style */ #nav { background:#0f3d69 url(/images/xgradients.gif) repeat-x left -103px; height:40px; text-align:center;} #lists { margin:0 auto; display:inline; position:relative; z-index:5;} #lists li { display:inline; position:relative;} #lists li a.tl { font-weight:bold; background:#3b75af url(/images/nav.gif) no-repeat left top; padding-left:15px; margin:0 1px 0 0; display:-moz-inline-box; display:inline-block; white-space:nowrap; cursor:pointer;} #lists li a.tl span { display:block; padding:13px 15px 12px 0;} #ie6 #lists li a.tl span { padding:10px 15px 10px 0;} #lists li#cat370 a.tl { background:#14395f url(/images/nav.gif) no-repeat left -100px;} #lists li#cat370 a.tl span { background:#14395f url(/images/nav.gif) no-repeat left -100px;} #lists li a:hover, #lists li.selected a.tl { background-color:#FF9900; background-position:left -50px; text-decoration:none;} #lists li:hover > a { background-color:#FF9900; background-position:left -50px;} #lists li a:hover span, #lists li.selected a.tl span { background:url(/images/nav.gif) no-repeat right -50px;} #lists li:hover > a span { background:url(/images/nav.gif) no-repeat right -50px;} #lists li#cat370 a:hover, #lists li.selected#cat370 a.tl { background-color:#FF9900; background-position:left -150px; text-decoration:none;} #lists li#cat370:hover > a { background-color:#FF9900; background-position:left -150px;} #lists li#cat370 a:hover span, #lists li.selected#cat370 a.tl span { background:url(/images/nav.gif) no-repeat right -150px; color:#103559;} #lists li#cat370:hover > a span { background:url(/images/nav.gif) no-repeat right -150px; color:#103559;} /* actual flyout style */ #lists div { display:none;} #lists :hover div { display:block; background:#fff; width:170px; position:absolute; z-index:6; left:0; top:22px; border:2px solid #FF7B00; text-align:left;} #lists #cat370:hover div { border-color:#3678b9; width:150px;} #ie6 #lists :hover div { top:38px;} #ie7 #lists :hover div { top:38px;} #lists :hover div, x:-moz-any-link { top:23px;} /* hack for Firefox2 */ #lists :hover div, x:-moz-any-link, x:default { top:22px;} /* restore for Firefox3 */ #lists :hover div dl {} #lists :hover div dl dt {} #lists :hover div dl dd {} #lists :hover div a { display:block; border-bottom:1px solid #eee; color:#1d5a92; font-weight:bold; padding:3px 5px;} #lists :hover div a:hover { text-decoration:underline; background:#e1f1ff; color:#1d5a92;} #lists #cat370:hover div a:hover { text-decoration:underline; background:#e1f1ff; color:#1d5a92;} #lists .clear { clear:both;} /* 3 column layout */ #content { border-left-width:190px; border-right-width:190px;} #inner { margin-left:-190px; margin-right:-190px;} #left, #right { width:190px;} #centre { margin-left:190px; margin-right:190px;} /* Shopping basket */ #minibasket {} #minibasket dd { border-top:1px solid #e3e6f0; overflow:hidden; padding:7px 10px;} #minibasket dd a { color:#2f2f2f;} #minibasket .name { display:block;} #minibasket .qty, .column #minibasket .remove, .column #minibasket fieldset { display:block; float:left;} #minibasket .cost { float:right;} #minibasket .cost .pricewas { color:#aaa; text-decoration:line-through;} #minibasket .smaller { display:block;} #minibasket dd.totals { font-weight:bold;} #minibasket .label { float:left;} #minibasket #empty {} #minibasket #checkout { padding:0 10px;} #minibasket #checkout, #minibasket #currency { border-top:none; border-bottom:none;} #minibasket #currency span { float:left; font-size:0.9em;} #minibasket #currency .icon { float:left;} /* Refine Results box */ /* #refine .inner { padding-top:5px;} #refine .inner h3 { padding-bottom:3px; margin:0;} #refine #fbrands { margin:0; background:#fff;} #refining { padding:6px 0; margin:0 0 10px 0;} #refining dt { margin:0; padding:0; color:#333; font-weight:normal;} #refining dd { margin:0; padding:0; background:none;} #refining a { color:#333; border:1px solid #ddd; font-weight:normal; margin:0 0 0 3px; padding:0 4px 0 16px; background:#fff url(/images/icons.gif) no-repeat -885px -335px;} #refining a:hover { text-decoration:underline; background-color:#ffeded; border-color:#f89090; color:#b30000;} #refine #orefines { margin:0;} */ /* List for your currently active filters */ #refine .subheading { background:#619BD1;} #refine .sortlist { padding:0; margin:0 10px; font-size:0.9em;} #refine .sortlist a { border:none; font-size:0.9em; background-image:url(/images/icons.gif); background-repeat:no-repeat; background-position:-885px -895px; padding:1px 5px 0 17px; margin:0;} #refine .sortlist a:hover { background-position:-885px -979px; background-color:#fff; color:#70727a;} #refine .sortlist dd { margin-bottom:2px;} /* List for the refine select boxes */ #refine #orefines { margin:0; background:#619BD1;} #refine #orefines dl { margin:0 10px 10px; padding-top:3px;} #refine #orefines dd.ref { position:relative; z-index:1; width:20%; margin:0; padding:0;} #refine #orefines input { width:78%;} #refine #orefines .selectpop { left:-10px; min-width:140px; width:93%;} /* Shown when Filter Highlight Brands is used*/ #refine .inner { padding-top:5px; padding-bottom:5px;} #refine #fbrands { margin:0; background:#fff;} #refine #fbrands a { border-color:#E3E7EC; margin:2px 2px 0 0; width:24%;} #refine #fbrands a:hover { border-color:#BCC4CE;} /************************************* * LiquidShop RTE PAGES CSS Stylesheet *************************************/ .rte_wrapper { width:100%; overflow:hidden;} .rte_twoeqcol_left, .rte_twoeqcol_right, .rte_twocol_small_left, .rte_twocol_big_right, .rte_twocol_big_left, .rte_twocol_small_right, .rte_threecol { float:left;} .rte_twoeqcol_left {width: 48%; } .rte_twoeqcol_right {width: 48%;} .rte_twocol_small_left {width: 38%;} .rte_twocol_big_right {width: 58%;} .rte_twocol_big_left {width: 58%;} .rte_twocol_small_right {width: 38%;} .rte_threecol {width: 31%;} /* Text Based Side Headings */ .column dt.title {} /* Image/CSS Styled Borders */ .column dl { width:165px; padding:0;} .column dd { border:1px solid #87b1da; border-width:0 1px;} .column dt.head { background:#fff url(/images/ygradients.gif) no-repeat left 0px; height:8px;} .column dt.foot { background:#fff url(/images/ygradients.gif) no-repeat left -8px; height:8px; clear:both;} /* 3 products per row */ .prodlist.galleryview dd { width:31.5%;}