/* Core Styles for PCWorldBusiness.co.uk This originally included (consolidated August 2011 - Tristram Smith): base.css layout.css typography.css iconize.css forms.css tabs.css Core z-indices, August 2011, Tristram Smith // 0-50 fair game // 70+ drop-down nav // 90+ pop-up overlays -------------------------------------------------- */ * { text-decoration: none !important; outline: none; } #product-nav * { font-size: 11px !important; } body { z-index: 99; } .ac_results { z-index: 80; } /* See AUTOCOMPLETE.js below */ div#header { z-index: 75; background: #fff; } #product-nav { z-index: 74; clear: both; width: 974px; clear: both; } #product-nav ul.level0 { z-index: 73; } #product-nav li.level0 { z-index: 72; } #product-nav .level1-outer-transparent { z-index: 71; } #body-wrap { z-index: 50; margin-bottom: 15px; } /* SHADOWBOX */ #shadowbox_overlay{visibility:hidden;position:absolute;display:block;margin:0;padding:0;top:0;left:0;z-index:96;} #shadowbox_container{position:fixed;height:0;width:100%;margin:0;padding:0;top:0;left:0;z-index:97;text-align:center;}#shadowbox{display:none;visibility:hidden;margin:0 auto;position:relative;font-family:'Lucida Grande',Tahoma,sans-serif;text-align:left;}#shadowbox_title{height:25px;padding:0;overflow:hidden;}#shadowbox_title_inner{height:16px;font-size:16px;line-height:16px;white-space:nowrap;padding:5px 0 4px 8px;color:#fff;}#shadowbox_body{position:relative;overflow:hidden;margin:0;padding:0;border:2px solid #fff;background-color:#000;}#shadowbox_body_inner{position:relative;overflow:hidden;}#shadowbox_loading{position:absolute;top:0;left:0;height:10000px;width:100%;background-color:#222;}#shadowbox_loading img{float:left;margin:10px 10px 0 10px;}#shadowbox_loading span{float:left;margin-top:16px;font-size:10px;}#shadowbox_loading span a,#shadowbox_loading span a:link,#shadowbox_loading span a:visited{color:#fff;}#shadowbox_content.html{height:100%;width:100%;overflow:auto;}#shadowbox_toolbar{margin:0;padding:0;height:20px;overflow:hidden;}#shadowbox_toolbar_inner{height:20px;color:#fff;}#shadowbox_toolbar_inner div{padding-top:4px;padding-bottom:2px;font-size:10px;height:10px;line-height:10px;}#shadowbox_toolbar_inner div span.shortcut{text-decoration:underline;font-weight:bold;}#shadowbox_toolbar_inner div a{text-decoration:none;color:#fff;}#shadowbox_nav_close,#shadowbox_nav_previous,#shadowbox_nav_next{float:right;padding-right:10px;}#shadowbox_counter{float:left;padding-left:10px;}#shadowbox_counter a{padding:0 4px 0 0;}#shadowbox_counter a.shadowbox_counter_current{text-decoration:underline;font-weight:bold;}div.shadowbox_message{text-align:center;padding:10px;}div.shadowbox_message a:link,div.shadowbox_message a:visited{text-decoration:none;color:#bed333;}div.shadowbox_message a:hover,div.shadowbox_message a:focus{text-decoration:underline;} /* WAS base.css - Moved/consolidated August 2011 */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; } /* Body -------------------------------------------------- */ * { font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: normal; } body { background: url("/ui/body-bg.png") fixed repeat-x top center; color: #333; } /* Links -------------------------------------------------- */ a, a:link { color: #1E7EC8;} a:visited { color: navy; } a:hover, a:focus, a:active { color:#721E6D; } #header a, #header a:link, #footer a, #footer a:link { color: #333;} #header a:visited, #footer a:visited { color: #333; } #header a:hover, #header a:focus, #header a:active, #footer a:hover, #footer a:focus, #footer a:active { color:#721E6D; } /* Basic Styles -------------------------------------------------- */ hr {color: #fff; background-color: #fff; border: 1px solid #ddd; border-style: none none solid;} hr.fancy { width: 695px; margin: 0;} body.no-sidebar hr.fancy, body.home hr.fancy {float: left; width: 930px; color: #fff; background-color: #fff; border: 1px solid #ddd; border-style: none none solid; margin:0 0 15px 0; } /* Site-Wide Classes -------------------------------------------------- */ #clearing-div:after { content: "."; clear: both; height: 0; visibility: hidden; display: block; } .clr { clear: both; } div.clr { height: 1px; line-height: 0; font-size: 1px; margin: 0; padding: 0; } .clr-special { clear: both; float: none; height: 15px; margin: 1em 0; background: transparent url("/ui/clr-special.gif") no-repeat center top; } .clr-right { clear: right; } .clr-left { clear: left; } .block { display: block; } .inline { display: inline; } .noshow, .no-show { position: absolute; top: -9999px; left: -9999px; } .hide { display: none; } .no-border { border: none !important; } .no-background { background-color: transparent; background-image: none; } #content .box-out { background: #E8F9E8; border: 1px solid #393; padding: 1.5em; } .text-left { text-align: left; } .text-centre { text-align: center; } .text-right { text-align: right; } .text-justify { text-align: justify; } .image-left { float: left; margin: 0 0.75em 0.25em 0; } .image-right { float: right; margin: 0 0 0.25em 0.75em; } small { font-size: 11px; } .white { color: #FFF; } .black { color: #252525; } .gray { color: #666; } .gray-light { color: #999; } .mid-gray { color: #999; } .light-gray { color: #F1F1F1; } .dark-blue { color: #069; } .blue { color: #069; } .yellow { color: #FC3; } .orange { color: #F60; } .green { color: #6BA839; } .red { color: #F02; } .highlight { color: #F60; font-weight: bold; text-decoration: underline; } .underline { text-decoration: underline; } .strikeout { text-decoration: line-through; } .total { font-weight: bold; color: #094796; } .price { color: #721E6D; font-weight: bold; } .price-inc-vat { font-weight: bold; color: #094796; } .price-ex-vat { } .info-help { font-weight: bold; padding-left: 18px; background: transparent url("/ui/icons/help-support.gif") no-repeat left center; } .subdued { color: #999; } .caption { color: #999; font-size: 11px; } .date { color: #BBB; display: block; letter-spacing: 1px; } .product-code { color: #000; } .information { color: #369; background: transparent url("/ui/icons/information.gif") no-repeat left center; padding-left: 30px; } .big { font-weight: bold; } .part-number { } .secure { padding-left: 22px; background: transparent url("/ui/icons/lock.png") no-repeat left center; } a.more { padding-right: 11px; background: transparent url("/ui/icons/more-arrow.png") no-repeat right center; } /* Tables - still need 'cellspacing="0"' in the markup -------------------------------------------------- */ table { border-collapse: collapse; border-spacing: 0; clear: both; } td, th { padding: 4px; text-align: left; } tr { /*background: transparent url("/ui/dotted-line.gif") repeat-x left bottom;*/ } tr.section th, tr.heading th { border-top: 1px solid #000; background: #FFF; } tr.odd th, tr.odd td { background-color: #EDF3FE/*#EFEFEF*/; } .centre { text-align: center; } /* List Types -------------------------------------------------- */ div.content li, div.content-pad li { margin: 6px 0px 6px 20px; } div.content-pad ol, div.content ol { list-style: inside; list-style: decimal; margin: 1em 0; padding-left: 3em; } ol li { } div.content-pad ul, div.content ul { list-style: none; } div.content-pad ul li, div.content ul li { list-style-type: square; /*display: block;*/ } /* WAS typography.css - Moved/consolidated August 2011 */ /* Typography -------------------------------------------------- */ h1, h2, h3, h4, h5, h6 { color: #772A72; padding: 8px 0 7px 0; margin: 0; font-weight: normal; } h1, h1 * { font-size: 24px; } h2 { font-size: 15px; } h2.folder { color: #333333; } h3, h4, h5, h6 { font-size: 12px; } h1 span {color: #F02; font-weight:bold;} p { margin: 0; color: #666; padding: 6px 0px 7px 0px; } strong, b { font-weight: bold; } dfn { font-weight: bold; font-style: normal; } em, i { font-style: italic; font-weight: normal; } big { 12pt; } small { font-size: 8pt; font-weight: normal; } sub, sup { font-size: 10px; font-weight: normal; } kbd, code, tt { } acronym, abbr { cursor: help; } /* WAS forms.css - Moved/consolidated August 2011 */ /* Forms -------------------------------------------------- */ p.important { margin-bottom: 2em; font-weight: bold; } p.important em { color: #C00; } form h6, form legend { } form h6 small { display: block; } form p { /*margin: 0;*/ } form p.note { margin: 0; padding: 4px; float: right; color: #333; } form fieldset { margin: 1em 0; padding: 1em; border: 1px #BBB solid; border-color: #BBB #666 #666 #BBB; } form fieldset.no-border { border: none; } form fieldset.left, form fieldset div.form-left { float: left; width: 45%; } form fieldset.right { float: right; width: 45%; } form fieldset div.form-right { float: left; width: 50%; } form fieldset.clr { float: none; clear: both; } form fieldset.confirm-order, form fieldset.important { border: 2px solid #6DB457; border: none; padding: 0; margin: 0 0 1em; } form fieldset.confirm-order h6, form fieldset.important h6 { color: #6DB457; display: none; } form fieldset.account-signup { border: 2px solid #6DB457; background: #F9FCF8/*#EFF4FA*/; } form fieldset.account-signup h6 { border-bottom-color: #CCE3C4; } form legend, form fieldset div { padding: 11px 0; } form fieldset.confirm-order div.controlset { padding: 0.3em 0; } form div input { margin-bottom: 0; } form div { } /* IE6 seems to need this -- */ form legend, form fieldset div { padding: 0 !important; } form div input { vertical-align: top !important; margin-bottom: 0 !important; } form label, form span.label { display: block; } form label.inline { display: inline; } form span.label-wide { } form label.error, form span.error { color: #C00; } form span.error {display: block; margin: 3px 0 0 0; padding: 2px; width: auto; font-weight: bold; } form label em, form span.label em { color: #C00; } form input, form textarea, form select { font-weight: bold; } form textarea { } form input.small, form textarea.small, form select.small { font-weight: normal; } form input.error { border-color: #C00; background-color: #FEF; } form input:focus, form input.error:focus, form textarea:focus { background-color: #FFC; border-color: #FC6; } form div.controlset { clear: both; margin: 0.5em 0; } form fieldset.confirm-order div.controlset { margin: 0; } form div.controlset label, form div.controlset input { display: inline; float: none; text-align: left; } form div.controlset div { margin-left: 140px/*170px*/; clear: none; } form div.controlset div * { vertical-align: middle; } form div.buttonrow { margin-left: 140px; } form div.buttonrow input { height: 30px; min-height: 30px; position: relative; } p#copyright { margin: 20px 10px; color: #999; } form p.caveat { margin: 0 0 1em; } p.caveat { color: #666; } p.caveat span { /*border-bottom: 2px solid #CCC; padding-bottom: 2px;*/ } p.caveat em { font-weight: bold; color: #C00; } span.notes { } form dl.delivery-details { margin-left: 140px/*170px*/; } /* Form (Excuse from standard styles) ----------------------------------------------*/ form.excuse { } form.excuse label, form.excuse span.label { margin: auto; padding: inherit/*auto*/; width: auto; display: inline; float: none; } form div input { vertical-align: inherit; } /* WAS tabs.css - Moved/consolidated August 2011 */ /* jQuery Tabs -------------------------------------------------- */ /* Caution! Ensure accessibility in print and other media types... */ @media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */ .ui-tabs-hide { display: none; } } /* Hide useless elements in print layouts... */ @media print { .ui-tabs-nav { display: none; } } /* Skin */ ul.tabs li.tab, ul.ui-tabs li.tab { list-style: none; margin: 0; padding: 0; } ul.tabs, ul.tabs li { background-image: none; padding: 0; margin-left: 0; } ul.tabs { font-weight: bold; margin-bottom: 0em; height: 30px; } ul.tabs li {float: left; margin: 0 2px 0 0; white-space: nowrap; list-style-type: none !important; } ul.tabs li a, ul.tabs li a span { float: left; height: 30px; margin: 0 1px 0 0; display: block; text-decoration: none; -moz-border-radius-topright: 6px; border-top-right-radius: 6px; -moz-border-radius-topleft: 6px; border-top-left-radius: 6px; } ul.tabs li a { padding: 0; color: #fff; background-image: url("/images/tab-on.png"); } ul.tabs li span { padding:4px 10px 0 10px;} ul.tabs .ui-tabs-selected a { background: url("/images/tab-off.png"); color: #fff; } .ui-tabs-selected span { background: none;} .ui-tabs-loading em { padding: 0 0 0 20px; background: url("/ui/loading.gif") no-repeat 0 50%; } li.tabs a {color: #fff;} /* WAS layout.css - Moved/consolidated August 2011 */ #head-spacer { height: 146px; margin: 0 auto; } /* Container/Content Layout -------------------------------------------------- */ #body-wrap { clear: both; margin: 0 auto 0 auto; background: #ffffff; width: 972px; border-left: 1px solid #DFDFDF; border-right: 1px solid #DFDFDF; } .content-pad { padding: 20px; background: transparent url("/ui/vertical-dashed-line.png") repeat-y 228px 0; } #container { float: right; width: 100%; margin: 0 0 0 -240px; } #content { margin: 0 0 0 232px; } #left-column { float: left; width: 175px; margin: 0 0 0 15px; } /* Layout (Single Column, Sidebar Dynamically Turned Off) -------------------------------------------------- */ body.no-sidebar #container, body.home #container, body.item-new #container { float: none; margin: 0; } body.no-sidebar #content, body.home #content, body.item-new #content { margin: 0; } body.no-sidebar .content-pad, body.home .content-pad , body.item-new .content-pad { background: transparent; } body.item-new .content-pad { padding: 6px 0 0 0; } /* Breadcrumbs -------------------------------------------------- */ .breadcrumbs { clear: both; } .breadcrumbs.upper { margin: 0 1em; padding: 5px 0 8px 0; } .breadcrumbs.lower { margin: 20px 8px 8px 8px; background-color: #EFEFEF; border-top: 1px solid #DDD; padding: 6px 0 0 4px; } .breadcrumbs p { margin: 0; padding: 0; } .breadcrumbs a { padding-left: 5px; padding-right: 12px; background: transparent url("/ui/icons/breadcrumb-lower-link.png") no-repeat right center; } .breadcrumbs a:last-child { background: transparent; } .breadcrumbs strong { padding-left: 5px; } /* Messages -------------------------------------------------- */ .message.good { border: 1px solid #229322; background: #86D958; padding: 10px; margin: 0 0 1.5em 0; } .message.bad { border: 1px solid #D29C34; background: #F5DC63; padding: 10px; margin: 0 0 1.5em 0; } .message div.inner { padding: 1em 1.5em; color: #000; text-align: left; min-height: 30px; background: #FFF; } .message div.inner h3 { font-weight: bold; margin: 5px 0; display: block; padding: 0 0 0 25px; border: none; } .message.good div.inner h3 { background: transparent url("/ui/icons/tick.png") no-repeat left center; } .message.bad div.inner h3 { background: transparent url("/ui/icons/error.png") no-repeat left center; } .message div.inner p { margin: 1em 2em 1.5em 0; } .message div.inner ul { margin-left: 20px; } .message div.inner ul li { } .message div.inner a.large { font-weight: bold; } .message div.inner a { font-weight: bold; } .message.no-explanation div.inner { font-weight: bold; min-height: 35px; } .banner { clear: both; display: block; width: 468px; height: 60px; margin: 1.2em auto; } .banner a { display: block; } /* Footer -------------------------------------------------- */ #footer * { font-size: 11px; } #footer div.sections div.section { float: left; border-right: 1px solid #E5E5E5; width: 242px; } #footer div.sections div.section ul, #footer div.sections div.section li { list-style: none; margin: 0; padding: 0; } #footer div.sections div.section ul li { padding: 3px 0 0 14px; } #footer div.sections div.section.last { border-right: none; width: 243px; height: 150px;} #footer div.sections div.section.last * { text-align: center; color: #999; } #footer div.sections div.section.last { background: #E4E4E4; } #footer h2 { font-weight: bold; color: #fff; margin: 0; background: #721E6D; padding: 4px 0 4px 17px; border-bottom: 1px solid #BBBBBB; border-top: 1px solid #BBBBBB; } #footer h2.grey { color: #333; background: #D8D8D8; padding: 4px 0 4px 0px; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; } #footer .small {font-size: 10px; color: #333; } /* Navigation (Replaces "subnav") April 2011, Tristram Smith -------------------------------------------------- */ #product-nav ul { list-style: none !important; } #product-nav ul, #product-nav li { padding: 0px; margin: 0; list-style: none !important; } #product-nav li.level0 { display: block; float: left;} #product-nav li.level0 { display: block; float: left;} #product-nav a.level0 { display: block; height: 38px; cursor: pointer; background: #721E6D; border-right: 1px solid #999; } #product-nav a.level0 { width: 80px; } #product-nav a#idlevel0-1 { width: 63px; } #product-nav a#idlevel0-2 { width: 75px; } /* Desktops */ #product-nav a#idlevel0-3 { width: 50px; } /* Tablets */ #product-nav a#idlevel0-4 { width: 110px; } #product-nav a#idlevel0-5 { width: 80px; } /* Components & Upgrades */ #product-nav a#idlevel0-6 { width: 85px; } #product-nav a#idlevel0-7 { width: 80px; } /* Accessories & Office */ #product-nav a#idlevel0-8 { width: 60px; } /* Software */ #product-nav a#idlevel0-9 { width: 65px; } /* TV, etc. */ #product-nav a#idlevel0-10 { width: 60px; } /* Phones & Faxes */ #product-nav a#idlevel0-12 { width: 70px; } /* Clearance */ /* 11 not in use (it's the "Miscellaneous" category, which is hidden */ #product-nav a#idlevel0-services { width: 70px; } /* Services */ #product-nav a#idlevel0-home { width: 45px; } #product-nav a#idlevel0-apple { width: 45px; } #product-nav a.level0:hover {background: #333;} #product-nav span.level0 { display: block; color: white; padding: 4px 5px 4px 6px; } #product-nav li.level0:hover a.level0 { background: #666666;} #product-nav ul.level0 li.level0 div.level1-outer-transparent { float: left; position: absolute; left: -999em; } #product-nav ul.level0 li.level0:hover { width: auto; } /* IE6-7 seem to need something here defining */ #product-nav ul.level0 li.level0:hover div.level1-outer-transparent { left: 0em; } #product-nav div.level1-inner-inner { min-height: 200px; min-width: 280px; } #product-nav div.level1-inner-rounded { padding: 10px 10px 10px 10px; margin: 0; float: left; background: white !important; border-bottom: 1px solid #999; border-left:1px solid #999; border-right:1px solid #999; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft: 7px; -moz-box-shadow: 2px 2px 2px #666; -webkit-box-shadow: 2px 2px 2px #666; box-shadow: 2px 2px 2px #666; } #product-nav li.level1, #product-nav li.level2 { width: 160px; } #product-nav a.level1, #product-nav a.level2 { display: block; padding: 2px 6px; } #product-nav a.level1 { font-weight: bold; margin-top: 4px; color: #721E6D; } #product-nav a.level1:hover {color: #333; } #product-nav a.level2 {color: #666; } #product-nav a.level2:hover { text-decoration: underline; color: #000;} #product-nav span.level2 { display: block; padding-left: 6px; } #product-nav ul.level1 { float: left; } .level1-outer-transparent { margin: 0; } #idlevel1-outer-transparent1 { margin-left: 45px; width: 550px; } /* 2, now 3 */ #idlevel1-outer-transparent2 { margin-left: 110px; width: 550px; } /* 2, now 3 */ #idlevel1-outer-transparent3 { margin-left: 230px; width: 400px; } /* 1, now 2 */ #idlevel1-outer-transparent4 { margin-left: 220px; width: 730px; } /* 3, now 4 */ #idlevel1-outer-transparent5 { margin-left: 350px; width: 550px; } /* 2, now 3 */ #idlevel1-outer-transparent6 { margin-left: 230px; width: 720px; } /* 3, now 4 */ #idlevel1-outer-transparent7 { margin-left: 350px; width: 510px; } /* 3 */ #idlevel1-outer-transparent8 { margin-left: 180px; width: 730px; } /* 3, now 4 */ #idlevel1-outer-transparent9 { margin-left: 450px; width: 510px; } /* 3 */ #idlevel1-outer-transparent10 { margin-left: 580px; width: 350px; } /* 2 */ #idlevel1-outer-transparentservices { margin-left: 630px; width: 350px; } /* 2 */ #idlevel1-outer-transparentapple { margin-left: 185px; width: 350px; } /* 1 */ #product-nav div.has-features { background: white url('/ui/nav-features-bg.png') right repeat-y !important; } #product-nav ul.features { width: 200px; } #product-nav ul.features li.non-anchor, #product-nav ul.features li a { padding: 4px 0px 4px 16px; } #product-nav ul.features li.non-anchor { padding-top: 8px; } #product-nav ul.features li a { display: block; } #product-nav ul.features li a:hover { color: #CC0000; } #idlevel1-inner-roundedservices { border-top-left-radius: 7px; -moz-border-radius-topleft: 7px; } #idlevel1-inner-rounded1, #idlevel1-inner-rounded2, #idlevel1-inner-rounded3 { border-top-right-radius: 7px; -moz-border-radius-topright: 7px; } #idlevel1-inner-rounded4, #idlevel1-inner-rounded5, #idlevel1-inner-rounded6, #idlevel1-inner-rounded7, #idlevel1-inner-rounded8, #idlevel1-inner-rounded9, #idlevel1-inner-rounded10 { border-top-right-radius: 7px; border-top-left-radius: 7px; -moz-border-radius-topright: 7px; -moz-border-radius-topleft: 7px; } #idlevel1-inner-rounded11 { border-top-left-radius: 7px; -moz-border-radius-topleft: 7px; } /* Buttons -----------------------------------*/ .button { background: url("/ui/buttons/yellow-105px.jpg") no-repeat; width: 105px; height: 24px; text-align: center; text-transform: uppercase; font-size: 7.5pt!important; font-weight: bold; color: #333; padding:6px 0 2px 0;} .button a { color: #333!important; text-decoration: none; display: block; font-size: 7.5pt!important; } .button a:hover { color: #751F7A;!important; text-decoration: none; display: block; } .button.narrow { background: url("/ui/buttons/purple-70px.jpg") no-repeat; width: 70px; color: #fae33b!important; padding: 2px 0 2px 0; cursor:pointer; font-size: 7.5pt!important;} .button.narrow a { color: #fae33b!important; padding-top: 4px;} .button.wide { background: url("/ui/buttons/yellow-135px.jpg") no-repeat; width: 135px; text-align: center; font-size: 7pt; padding-top: 4px; } .button.semi-wide { background: url("/ui/buttons/purple-124px.jpg") no-repeat; width: 124px; color: #ffcc00!important; } .button.semi-wide a { color: #fae33b!important; font-size: 7.5pt; padding-top: 0px; } .button.compact-text { font-size: 7pt!important; } input.button { border: none; } /* Business Account -----------------------------------*/ .business-account { margin: 2em; padding: 1em; border: 1px solid #DDD; background-color: #FCFCFC; } .business-account h4 { margin: 0 0 0.5em; } /* Item Page Features -----------------------------------*/ dl.features-special { margin: 0 0 1em 1em; width: 35%; float: right; border: 1px solid #cccccc; padding: 1em;} dl.features-special dt { margin: 0.7em 0 0.2em; padding: 0 0 0.25em; font-weight: bold; color: #000; } dl.features-special dd { margin: 0.2em 0 0.2em; background: transparent url(/ui/feature-bullet.png) no-repeat 5px 50%; padding: 0.1em 0 0.1em 20px; font-weight: normal; color: #000; } /* Item Description (Item) -------------------------------------------------- */ #item-description p { margin: 0 0 1.5em; color: #555; } /* Product listings -------------------------------------------------- */ #product-listing { margin:0; } #product-listing .product .image-compare { float: left; width: 170px; padding: 20px; clear: none; } #product-listing .product .image-compare img { width: 170px; } #product-listing .product .image-compare label { color: #721E6D; } #product-listing .product .description { float: left; width: 325px; padding-right: 20px; clear: none; } #product-listing .product .description h3 { } #product-listing .product .description h3 a { text-decoration: none; color: #721E6D; } #product-listing .product .description p { color: #333333; margin: 1em 0; font-size: 11pt; } #product-listing .product .description p.part-numbers { font-size: 8pt; } #product-listing .product .description p.more a { color: #721E6D; text-decoration: none; } #product-listing .product .price-stock { float: left; width: 135px; clear: none; } #product-listing .product .price-stock p { margin: 1em 0; } #product-listing .product .price-stock .price { color: #721E6D; font-size: 14pt; } #product-listing .per-page { padding-bottom: 10px; border-bottom: 1px dotted #666; margin:0 0 0 20px;} #product-listing .compare { margin: 10px 1.5em; } #product-listing .sort { float: right; font-size: 9pt; } #product-listing .pagination { margin: 0; float: right; margin-right: 1.2em; } #product-listing .pagination .next-page, #product-listing .pagination .previous-page, #product-listing .pagination .pagelinks a { padding: 0; border: none; } /* Compare Table -------------------------------------------------- */ #compare { background: transparent; color: #555; } #compare thead th { background: #FFF/*#EEE*/; border-bottom: 2px solid #CCC; } #compare th { color: #000; } #compare tr { background: transparent; } #compare tr.no-background { background-image: none; } #compare tr.special { background-color: #D8EEF3; } #compare a.add { display: block; padding: 0; margin: 0 auto; width: 130px; height: 30px; background: transparent url("/ui/buttons/add-to-basket-sprite.gif") no-repeat left top; } #compare a.add:hover { background-position: 0 -30px; } #content #compare label { display: inline; padding-left: 0; margin-left: 0; white-space: nowrap; } #compare th a.sort { padding-right: 12px; } a.sort-ascending { background: transparent url("/ui/icons/arrow-up.png") no-repeat right center; } a.sort-ascending:hover { background-image: url("/ui/icons/arrow-down-black.png"); } a.sort-descending { background: transparent url("/ui/icons/arrow-down.png") no-repeat right center; } a.sort-descending:hover { background-image: url("/ui/icons/arrow-up-black.png"); } a.sort-none { background: transparent url("/ui/icons/arrow-up.png") no-repeat right center; } a.sort-none:hover { background-image: url("/ui/icons/arrow-down-black.png"); } /* Unavailable Table -------------------------------------------------- */ table#unavailable { background: transparent; margin: 1.5em 0; color: #666; } table#unavailable tr { background: transparent; } table#unavailable td, table#unavailable th { color: #999; } table#unvailable a { color: #777; } table#unavailable .desc a, table#unavailable .desc h3 a { color: #777; } /* Pagination --------------------------------------------------*/ .pagination { color: #666; margin: 1.5em 0; text-align: center; } .pagination a { font-weight: bold; } .pagination .pagelinks a { padding: 0.3em 0.5em 0.3em 0.3em; border: 1px solid #CCC; border-width: 0 1px 0 0; } .pagination .pagelinks a.current { font-weight: normal; text-decoration: none; cursor: default; color: #000; font-weight: bold; } .pagination .pagelinks a.last { border: none; } .pagination .previous-page, .pagination .next-page { border: 1px solid #CCC; } .pagination .previous-page { padding: 0.3em 0.5em 0.3em 1.4em; margin: 0 0 0; background: transparent url("/ui/pagination_left_arrow.gif") no-repeat 5% 50%; } .pagination .next-page { padding: 0.3em 1.4em 0.3em 0.5em; margin: 0; background: transparent url("/ui/pagination_right_arrow.gif") no-repeat 95% 50%; } /* Banner -------------------------------------------------- */ .banner { text-align: center; margin: 1em 0 0 0; width: 680px; height: 60px; } /* Refine Search -------------------------------------------------- */ #refine-search { margin: 0 0 20px 0; } #refine-search div { margin: 0.5em 20px; } #refine-search h3 { color: #000; border: none; font-weight: bold; background: transparent url("/ui/expand.gif") no-repeat left center; padding: 7px 7px 7px 20px; margin: 0; } #refine-search h3:hover { text-decoration: underline; } #refine-search h3.active { background: transparent url("/ui/collapse.gif") no-repeat left center; text-decoration: underline; } #refine-search ul { margin: 0 1em; } #refine-search li { color: #888; list-style: none; font-size: 9pt; } #refine-search li strong { color: #000; } #refine-keywords { width: 100%; font-weight: normal; } /* Catalogue Folders -------------------------------------------------- */ .catalogue-folder { width: 190px; /* min-height: 320px; Tristram Smith, April 2011 */ margin: 2em 18px 2em 0; float: left; color: #666666; padding: 0 18px 0 0; background: transparent url("/ui/vertical-dashed-line.png") no-repeat right 20px; } .catalogue-folder.last { background: transparent; margin-right: 0; } .catalogue-folder .image { text-align: center; } .catalogue-folder h2, .catalogue-folder h3 { margin: 0; } .catalogue-folder h2 a { color: #333333; text-decoration: none; } .catalogue-folder h3 a { color: #666666; text-decoration: none; } .catalogue-folder h3 { font-size: 10pt; font-weight: bold; margin: 0.5em 0; } .catalogue-folder p { margin: 1em 0; font-size: 10pt; } .catalogue-folder .sub-folder { margin: 0.25em 0; } .catalogue-folder .sub-folder a { text-decoration: none; color: #721E6D; } .catalogue-folder .sub-folder a:hover{ text-decoration: underline; color: #666; } .small-catalogue-folder { background: #FFF; width: 220px; height: 8em; border: 1px solid #DDD; border-color: #DDD #999 #999 #DDD; margin: 0.5em 1em 0.5em 0; float: left; } .small-catalogue-folder h3 { margin: 0 0 0.5em; font-weight: bold; } .small-catalogue-folder h3 a { display: block; padding: 0.25em; background-color: #EEE; color: #777; } .small-catalogue-folder h3 a:hover { color: #FFF; background: #09C url("/ui/folder-arrow.gif") no-repeat right center; text-decoration: underline; } .small-catalogue-folder a.image { margin: 0; width: 60px; height: 100%; float: left; text-align: center; } .small-catalogue-folder .folder-details { width: 140px; height: 100%; float: right; margin-right: 15px; } .small-catalogue-folder .folder-details p { margin: 0 0 0.75em; font-size: 0.9em; } /* Special form label resets for item page -------------------------------------------------- */ form #accessory label, form .acc label { margin-right: 0; padding-left: 5px; width: auto; display: inline; float: none; text-align: left; position: relative; } /* Order History ---------------------------------------------------*/ div.order-history { margin: 1em 0 2em; border: 1px solid #CCC; border-color: #CCC #999 #999 #CCC; } .order-history h3 { margin: 1em 0 0.4em; padding-left: 5px; } dl.order { padding-top: 0.6em; padding-left: 5px; width: 100%; } dl.order dt { display: inline; width: 20%; vertical-align: top; text-align: right; } dl.order dd { display: inline; margin: 0 2%; font-weight: bold; width: 25%; vertical-align: top; } dl.order dd.singleline { width: 75%; } dl.order dt.nodd { display: block; } dl.order dt.space { margin-left: 2em; } .order { margin: 0 0 4em; } .order h2 { text-transform: uppercase; padding: 0.25em; border-bottom: 2px solid #CCC; } .order h2 em { font-weight: normal; font-style: normal; color: #F60; } .order table { width: 100%; } .order table th, .order table td strong { color: #000; } .order table thead td { border: 1px solid #CCC; } /* Order Status - Capitalized because of :translations, do NOT alter case ---------------------------------------------------*/ .order a.Cancelled, .order a.Processing, .order a.Dispatched, .order a.Received { padding-left: 20px; background-color: transparent; background-repeat: no-repeat; background-position: left center; } .order a.Cancelled { color: #F02; background-image: url("/ui/icons/order-cancelled.gif") } .order a.Processing { background-image: url("/ui/icons/order-processing.gif") } .order a.Dispatched { color: #093; background-image: url("/ui/icons/order-dispatched.gif") } .order a.Received { color: #666; background-image: url("/ui/icons/order-received.gif") } table.order { margin: 2em 0; } table.order th { vertical-align: middle; padding: 0.5em; color: #333; } table.order td { padding: 0.5em; } table.order td.desc { width: 50%; } table.order .prod_name { width: 25%; } /* Address Scroller (Add, Edit, Delete Delivery Address) -------------------------------------------------- */ ul#options { clear: both; height: 16em; max-height: 16em; overflow: scroll; background: #F5F5F5; border: 1px solid #CCC; padding: 0; margin: 0; } ul#options li { list-style: none; margin: 0; padding: 0; background-image: none; border-bottom: 1px solid #CCC; } ul#options a { display: block; background: #FFF; margin: 0; padding: 0.35em; text-decoration: none; } ul#options a:hover, ul#options a:focus, ul#options a:active { background: #0088B5; color: #FFF; text-decoration: underline; } /* Favourites ---------------------------------------------------*/ table.favourites {border: 1px solid #888; border-collapse: collapse; clear: both; margin: 1em 0 0;} table.favourites td, table.favourites th {border: 1px solid #CCC; text-align: center;} table.favourites .odd td {background: #EEE;} table.favourites strong {display: block;} table.favourites .desc {text-align: left;} table.favourites .text {text-align: right; width: 6em;} table.favourites td {padding: 0.5em;} table.favourites td input {display: block; text-align: center;} table.favourites button {background: transparent; border: 0; display: block;} .savfavs {float: left;} .addfavstobasket {float: right; background: #FFF url(/ui/btnblank.gif) top left no-repeat; border: 0; font-weight: bold; height: 34px; width: 140px;} .addfavstobasket * {vertical-align: middle;} /* Requisition Details ---------------------------------------------------*/ #requsition-details { margin: 2em 0 1em; } /* Basket Options ---------------------------------------------------*/ dl.basketopt { margin: 1em 0 0; padding: 0 0 1em; background: transparent url("/ui/dotted-line.gif") repeat-x left bottom; } dl.basketopt a { text-decoration: none !important; border: 0; color: #666; } dl.basketopt dt, dl.basketopt dd { margin: 0 0 0.5em; } dl.basketopt dd.price { color: #F60/*#C00*/; } dl.basketopt dd.add { height: 30px; margin-top: 7px; background: #FFF url("/ui/add-item.gif") no-repeat left center; } dl.basketopt dd.add a { display: block; height: 100%; margin: 0; padding: 0; } /* Basket Checkout and Delivery -------------------------------------------------- */ #content .basket-shipping, #content .basket-checkout { width: 25em; margin: 0 0 0.5em ; } .basket-shipping { float: left; } .basket-shipping h3 { margin-top: 0; } form#shipping-method { font-weight: bold; text-align: left; } form#shipping-method { display: block; margin: 0.3em 0; } form#shipping-method label { padding: 1.5em 0; width: auto; display: inline; } form#shipping-method input.update { display: block; } form#shipping-method { margin: 0; } form#shipping-method .controlset div { margin: 0; } .basket-checkout { float: right; /*border: 1px solid #B9E19D; background: #F2FAEF; padding: 0;*/ } .basket-checkout ul { font-weight: bold; } .basket-checkout .pay { margin: 0.5em; float: left; } #payment-options { text-align: left; margin: 0.5em 0; } #payment-options .pay { float: left; margin: 0.5em; } .basket-checkout h3 { margin-top: 0; } .basket-continue { border: none; border-top: 2px solid #B9E19D; background: #FFF; } .basket-continue h3 { background: transparent; margin-top: 0; } /* Search Categories ---------------------------------------------------------------------------*/ #search-categories { margin: 1em 0; padding: 2px; list-style: none; border: 1px solid #CCC; } #search-categories li { display: inline } #search-categories li * { vertical-align: middle } /* Testimonials -----------------------------------*/ table.testimonials { width: 100%; } table.testimonials tr td { border-bottom: 1px dotted #ccc; } table.testimonials td { padding: 0; } table.testimonials td.author { width: 25%; } table.testimonials td h4 { color: #069;} table.testimonials td h3 { font-weight: bold; } /* Sidebar -----------------------------------*/ .sidebar h2 { margin: 0 0 15px 0; padding: 3px 5px 0 10px; font-weight: bold; background: #E4E4E4; color: #721E6D; min-height: 20px; border:1px dotted #E4E4E4;border-bottom-left-radius:10px; border-bottom-right-radius:10px; -moz-border-radius-bottomleft:10px; -moz-border-radius-bottomright:10px; border-top-left-radius:10px; border-top-right-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; } .sidebar ul { margin-top: 0; margin-left: 20px; margin-right: 20px; margin-bottom: 20px; list-style: none; padding: 0; } .sidebar ul li { margin: 0.4em 0; padding: 0; list-style: none; font-size: 10pt; } .sidebar ul li a { text-decoration: none; color: #721E6D; } .sidebar ul.categories li a { color: #333333; } .sidebar p, .sidebar div { margin: 0px 20px 15px 20px; font-size: 10pt; } /* Jargon Buster (Button) -----------------------------------*/ .jargon-buster { padding: 1em 0; } .jargon-buster a { border: 1px solid #CCC; background: #FFF; padding: 5px; text-decoration: none; font-weight: bold; } .jargon-buster a:hover, .jargon-buster a:focus, .jargon-buster a:active { background: #003D8C; color: #FFF; } /* Glossary (Jargon Buster Text Link and Hover/Floating Panel) -----------------------------------*/ a.jargonbuster { /*background: transparent url("/ui/glossary-comment.gif") no-repeat right center; padding-right: 15px;*/ cursor: help; } div#ajaxNode { position: absolute; width: 200px; padding-bottom: 10px; background: transparent url("/ui/jargon-tail.gif") no-repeat bottom left; z-index: 95; /*filter: alpha(opacity:90); KHTMLOpacity: 0.9; MozOpacity: 0.9; opacity: 0.9;*/ } div#ajaxNode div { padding: 3px 5px; } div#ajaxNodeTitle { background: #31A0CB; margin: 0px; } div#ajaxNodeText { background: #FFF; border: 2px solid #31A0CB; } div#ajaxNodeTitle h3 { margin: 0px 0px 1px 0px; color: #FFF; } /* Product Offers e.g. PPC etc. -----------------------------------*/ .vertical-offer { float: left; width: 32%; padding: 1em 0; background: #EEE url("/ui/product-offer-bg.gif") repeat-x left top; border: 1px solid #CCC; border-color: #CCC #999 #999 #CCC; text-align: center; margin: 1px; overflow: hidden; } .vertical-offer div { margin: 0.8em; height: auto !important; height: 28em; min-height: 28em; } .vertical-offer h2 { } .vertical-offer ul.features { text-align: left; background-color: transparent; } .vertical-offer ul.features li { font-weight: bold; background-color: transparent; } .vertical-offer .image img { border: 2px solid #DDD; height: 150px; } .vertical-offer .price { } div.offerlinks-box { margin: 1.5em 0; padding: 0; width: 100%; } .offerlinks-box div { margin: 5px 5px 0px 0px; padding: 0.3em; float: left; border: 1px solid #DDD; } .offerlinks-box div a { font-weight: bold; color: #69C; text-decoration: none; white-space: nowrap; } .offerlinks-box div a:hover { text-decoration: underline; } ul.offer-links { list-style: none; margin: 1.5em 0; padding: 0; width: 100%; } ul.offer-links li { margin: 5px 5px 0px 0px; padding: 0.45em; float: left; border: 1px solid #DDD; padding: 0; } ul.offer-links a { /*display: block;*/ margin: 0.3em; font-weight: bold; color: #69C; text-decoration: none; white-space: nowrap; } ul.offer-links a:hover { text-decoration: underline; } /* Misc -----------------------------------*/ iframe#parcel-tracking { width: 100%; height: 500px; overflow: scroll; } .lead-log { color: #e00000 } /* Social -----------------------------------*/ #social { margin:0; padding:0; float:right;} #social li { display:inline; list-style-type: none; } /* Product Banner (test) -----------------------------------*/ #product-banner { border: 1px solid #DDD; } #product-banner .inner { } /* Product image gallery lightbox -----------------------------------*/ #jquery-overlay { position: absolute; top: 0; left: 0; z-index: 92; width: 100%; height: 500px; } #jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 93; text-align: center; line-height: 0; } #jquery-lightbox a img { border: none; } #lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #lightbox-container-image { padding: 10px; } #lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 94; } #lightbox-container-image-box > #lightbox-nav { left: 0; } #lightbox-nav a { outline: none;} #lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; } #lightbox-nav-btnPrev { left: 0; float: left; } #lightbox-nav-btnNext { right: 0; float: right; } #lightbox-container-image-data-box { font: 10px; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; } #lightbox-container-image-data {padding: 0 10px; color: #666; } #lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; } #lightbox-image-details-caption { font-weight: bold; } #lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; } #lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; } /* product range */ div.product_list form div {clear:none;} div.product_list { width: 710px; } div.product_list .product_list_container{ width: 680px; } div.product_list .product_list_comparison{ width: 18px; height: 78px; float: left; margin: 6px 0 0 0; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; background-color: #E0E0E0; padding:2px 0 0 0; } div.product_list .compare_img {margin: 5px 0 0 2px;} div.product_list .product_list_input {float: left; width: 5px; margin: 5px 2px 10px 0;} div.product_list .product_list_img {margin: -2px 0 3px 5px; float: left; border: 4px solid #ccc; padding: 0px; width: 114px; position:relative;} div.product_list .product_list_content{ margin-bottom: 6px; width: 680px; float: left; border: 1px solid #ccc; background:url(/images/price-box-bg.jpg) repeat-y right #EAEAEA; } div.product_list .product_list_middle { float: left; width: 405px; margin: 0 0 0 15px;} div.product_list h3.product_list{ font-size: 15px; float: left; margin: 5px 0 0 0; font-weight: bold; } div.product_list h3.product_list a{ color: #721E6D;} div.product_list h3.product_list a:hover{color: black;} div.product_list span.product_list {float: left; color: #333; font-size: 11px; margin: 8px 0 0 0; font-weight: bold; } div.product_list span.product_list_desc { width: 100%; float: left; font-size: 12px; margin: 2px 0 8px 0; } div.product_list span.product_list_desc a { font-weight: bold; display: block; color: #721E6D;} div.product_list span.product_list_desc a:hover { color: black; } div.product_list span.product_list_desc_more { width: 340px; float: left; font-size: 12px; margin: 2px 0 8px 0; } div.product_list span.product_list_desc_more a { font-weight: bold; display: block; color: #721E6D; } div.product_list span.product_list_desc_more a:hover { color: black; } div.product_list span.product_list_part_number { font-size: 10px; font-style:italic; color: #666; float: left; width: 100%; margin: 0 0 0 16px; } div.product_list .product_list_right_container {float: right; width: 120px; height: auto; } div.product_list .product_list_price_box{ float: right; width: 120px; height: 100%; text-align: right; margin:0 0 10px 0; } div.product_list span.price_text_big{ font-size: 18px; color: #FFCC00; font-weight: bold; margin: 6px 4px 0 0; display:block; text-align:right;} div.product_list span.price_text_grey{ font-size: 10px; color: #CCCCCC; margin: 0 4px 0 0; display:block; text-align:right;} div.product_list span.price_text_ex_vat{ font-size: 10px; color: #CCCCCC; margin: 0 4px 0 0; display:block; text-align:right;} div.product_list a.product_list_button {margin: 5px 5px 0 5px; width: auto; padding: 2px 0; background:#FFCC00; text-align:center; -moz-border-radius: 5px; border-radius: 5px; font-size: 11px; display:block;} div.product_list a.product_list_button {color: #000;; } div.product_list a.product_list_button:hover {color: #541556;} div.product_list span.product_list_smartplan { display: block; float: right; width: 120px; background: #AB2BAE; height: 16px; font-size: 11px; color: #FFFFFF; text-align:center; } div.product_list_middle .promoted_attributes { margin: 0; padding: 0; border: 0; } div.product_list_middle .promoted_attributes th { color: #999999; padding: 0 4px 0 0; text-align: right; border: 0; font-weight: normal; font-style: italic; } div.product_list_middle .promoted_attributes td { border: 0; padding: 0; } /* hot offers */ div.product_list div.hot .product_list_content { width: 680px; float: left; border: 1px solid #FFC166; margin:0 0 10px 20px; } div.product_list div.hot .product_list_comparison {width: 18px; height: 80px; float: left; margin: 6px 0 0 0; border-left: 1px solid #FFC166; border-bottom: 1px solid #FFC166; border-top: 1px solid #FFC166; background-color: #E0E0E0; padding: 2px 0 0 0; } div.product_list div.hot .product_list_img {margin: -2px 0 3px 5px; float: left; height: 86px; padding: 0px; width: 114px;border: 4px solid #FFC166; } div.product_list div.hot .hot_offers_icon { display: block; float: left; margin: 6px 0 0 78px; position: absolute; z-index: 1;} /*icon if IE6 */ * html div.product_list div.hot .hot_offers_icon {margin: 0 0 0 -50px;} /* WAS services.css */ body.cms h1 {font-size: 18px; color: #721E6D;} body.cms h2 {font-size: 16px; color: #721E6D; font-weight: bold; margin-top: 10px;} body.cms p.bold {font-weight: bold;} body.cms ul#idmenuservices, ul#idmenuservices li { list-style: none; padding: 0; margin: 0; display: block; } body.cms ul#idmenuservices ul li a { padding: 4px 0 4px 20px; display: block; } body.cms ul#idmenuservices ul li ul li a { padding: 2px 0 2px 30px; display: block; font-style: italic; } body.cms ul#idmenuservices li.toplevel a.toplevel { font-weight: bold; background: url(/ui/header-images/dropdown-list-arrow.png) no-repeat left; padding: 4px 0 4px 10px; display: block; } /* WAS SmartPlan.css */ #smartplan-outer #calc { float: right; } #smartplan-outer #smartplan-header { padding: 0px; width: 700px; overflow: hidden; } #smartplan-outer #smartplan-left-column { margin-top: 10px; float: left; padding: 0px; width: 470px; } #smartplan-outer #smartplan-right-column { margin-top: 10px; margin-right: 18px; float: right; padding: 0px; width: 180px; margin-left: 10px; } #smartplan-outer #calc { width: 440px; margin-bottom: 10px; background-color: #e7e7e8; padding: 10px 15px; } #smartplan-outer #calc div.column { width: 50%; float: left; margin: 0; padding: 0; } #smartplan-outer #calc h2 { font-size: 22px; height: 25px; line-height: 25px; margin: 0; color: #666666; font-weight: bold; } #smartplan-outer ul { margin: 0 0 1em 0.7em; padding-left: 0.7em; list-style-image: url(/ui/smartplan/bullet1.gif); font-size: 12px; color: #666666; font-weight: bold; } #smartplan-outer ul li { margin: 0; padding: 3px; } #smartplan-outer ul.features { list-style-image: url(/ui/smartplan/bullet2.gif); } #smartplan-outer ul.features li { font-size: 13px; } #smartplan-outer p strong em { font-style: normal; font-weight: bold; color: #ff0000; font-size: 11px; } #smartplan-outer .more-info { font-size: 0.9em; } #smartplan-outer table { font-weight: bold; border: none; width: 100%; } #smartplan-outer table th { color: #ffffff; border-bottom: 1px solid #e7e7e8; background: #8c99a1; } #smartplan-outer table td { border-bottom: 1px solid #e7e7e8; background: #ffffff; font-size: 18px; } #smartplan-outer table td.amount { width: 100%; } #smartplan-outer table#total-payments th { background: #63717a; } #smartplan-outer table .more-info { font-weight: normal; } #smartplan-outer table td.more-info, table tbody th { white-space: nowrap; } #smartplan-outer #order-value { background-color: #ffffff; border: 1px solid #ffffff; width: 140px; } #smartplan-outer p.order-value { font-size: 18px; color: #000000; background-color: #ffffff; width: 160px; margin: 0; border: 2px solid #999999; padding: 8px; } #outer-header { position: absolute; top: 0; z-index: 80; width: 972px; left: 50%; margin-left: -486px; } #header { /* border-right: 1px solid #DFDFDF; border-left: 1px solid #DFDFDF; */ } /* logo */ #header #headerLogo {width: 170px; float: left; margin: 5px 40px 0 15px;} /* centre column */ #header #headerCentrecolumn {width: 565px; height: 76px; float: left; background: url(/ui/header-images/centre-column-bg.png) repeat-x; margin:0 30px 10px 0; border-left: 1px dotted #CCCCCC; border-bottom: 1px dotted #CCCCCC; border-right: 1px dotted #CCCCCC; border-bottom-left-radius:6px; border-bottom-right-radius:6px; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; } #header #headerCentrecolumn.checkout { background: #666 !important; height: 26px !important; border:1px dotted #CCCCCC !important; border-bottom-left-radius:6px !important; border-bottom-right-radius:6px !important; -moz-border-radius-bottomleft:6px !important; -moz-border-radius-bottomright:6px !important;} #header #headerCentrecolumn #headerCentrecolumn-top { height: 26px; } #header #headerCentrecolumn #headerCentrecolumn-top-inner { text-align: right; list-style: none; margin: 0; padding: 5px 4px 0 0; } #header #headerCentrecolumn #headerCentrecolumn-top-inner * { font-size: 11px; } #header #headerCentrecolumn #headerCentrecolumn-top li { margin: 0; padding: 0; list-style: none; display: inline; } #header #headerCentrecolumn #headerCentrecolumn-top li a.storefinder { height: 18px; background: url('/ui/header-images/find-a-store-icon.png') no-repeat; padding: 0px 4px 0px 18px; color: white; } #header #headerCentrecolumn #headerCentrecolumn-top li a.call { height: 18px; background: url('/ui/header-images/phone-icon.png') 6px 0px no-repeat; border-left: 1px solid #999; padding: 0px 4px 0px 24px; color: white; } #header #headerCentrecolumn #headerCentrecolumn-top li a.checkout-topnavlink { border-left: 1px solid #999; padding: 0px 4px 0px 4px; color: white; } #header #headerCentrecolumn #headerCentrecolumn-search { width: 210px; float: left; } #header #headerCentrecolumn #headerCentrecolumn-search div.headerCentrecolumn-search-inner { padding: 16px 0 15px 10px; vertical-align: middle; } #header #headerCentrecolumn #headerCentrecolumn-search div.headerCentrecolumn-search-inner .search-keywords { height: 20px; width: 160px; border: solid 1px #999; margin-bottom: 4px; } #header #headerCentrecolumn #headerCentrecolumn-search div.headerCentrecolumn-search-inner .search-go { height: 24px; width: 26px; background: url('/ui/header-images/search-go-but.png') no-repeat; border: 0; color:#fff; text-transform: uppercase; font-weight: bold; cursor: pointer; } #header #basketContainer, #header #basketContainer-active { float: left; width: 130px; } #header #basketContainer-active span.buttonTop { background:#FF9900; height:12px; } #header #basketContainer { display: block; float: left; background: url(/ui/header-images/basket-button-bg.jpg) repeat-x #EBEBEB; width: 128px; height: 77px;border:1px dotted #CCCCCC; border-bottom-left-radius:6px; border-bottom-right-radius:6px; -moz-border-radius-bottomleft: 6px; -moz-border-radius-bottomright: 6px; cursor: pointer;} #header #basketContainer span {font-size:12px; font-weight:bold; display:block;} #header #basketContainer span.buttonTop{color:#fff; padding:5px 0 9px 0;} #header #basketContainer span.buttonItems{color:#721E6D; padding:5px 0 2px 10px; font-size: 11px; font-weight: normal;} #header #basketContainer span.right{float: right; font-size: 11px; font-weight: bold; padding: 0 8px 0 0;} #header #basketContainer span.viewBasket{color: #666; padding:2px 0 2px 10px; float:left;} #header #basketContainer .icon {float: left; padding:5px 45px 3px 10px; border: 0px;} #header #basketContainer .arrow{float: left; padding:9px 10px 3px 8px; border: 0px;} /* basket Dropdown */ #header #basketDropdown { position: absolute; display: none; margin-top: 0; margin-left: -165px; z-index: 79; background-color: #fff; width: 280px; padding: 0 10px 10px 10px; border: 1px solid #ccc; border-radius: 5px; -moz-border-radius:5px;} #header #basketContainer span.close{ padding:7px 0 7px 0; cursor:pointer; display: block; text-align: right; font-size: 8px; color: #666;} #header #basketContainer span.dropdownItems{color:#721E6D; padding:8px 0 0 0; display: block; font-weight: bold;} #header #basketContainer span.right{float: right;} #header #basketContainer span.dropdownDesc{color:#000; padding:2px 0 0 0; display: block; font-size: 10px;} #header #basketContainer span.basketTotal{ color:#721E6D; padding:2px 0 0 0; display: block; margin-bottom: 8px;} #header #basketDropdown thead th { border: none; background: #CCC; font-size: 11px;} #header #basketDropdown th.txt-right {font-weight: normal;} #header #basketDropdown th.txt-right-bold {font-weight:bold; color: #721E6D;} #header #basketDropdown .but_orange{ display: block; width:158px; height:20px; color:#000; text-transform: uppercase; background:url("/ui/buttons/pcwb_but_orange.png") no-repeat 0 0; text-align: center; padding: 5px 0 0 0; margin-top: 15px; } #header #basketDropdown .but_orange:hover { color:#333; background:url("/ui/buttons/pcwb_but_orange.png") no-repeat 0 -27px; } #header #basketDropdown .centre{ margin-left: 60px; } #header #headerCentrecolumn-dropdowns { float: right; margin:0; padding: 12px 20px 0 0; } #header #headerCentrecolumn-dropdowns ul, #headerCentrecolumn-dropdowns ul li { list-style: none;} #headerCentrecolumn-dropdowns li { margin-bottom: 5px;} #header #id-ul-headerCentrecolumn-dropdowns, #header #id-ul-headerCentrecolumn-dropdowns, #header #id-ul-headerCentrecolumn-dropdowns li.dropdown-trigger, #header #id-ul-headerCentrecolumn-dropdowns li.dropdown {display: block; float: left; } #header li.dropdown a.dropdown-inner, #header li.dropdown-trigger a.dropdown-trigger-inner { float: left; height:30px; margin:0; padding: 0 20px 0 20px; border-right: 1px solid #CCC; } #header li.dropdown a.dropdown-inner { } #header li.dropdown-trigger a.dropdown-trigger-inner { background: url("/ui/header-images/arrow-down.png") no-repeat scroll 85px 20px transparent; } #header li.dropdown a.dropdown-inner.last, #header li.dropdown-trigger a.dropdown-trigger-inner.last { border-right: 0; } #header li.dropdown a.dropdown-inner span.inner, #header li.dropdown-trigger a.dropdown-trigger-inner span.inner { display: block; text-align: center; } #header .dropdown-trigger .dropdown-inner { position: absolute; left: -999em; margin-top:30px !important; display: block; -moz-box-shadow: 2px 1px 2px #999; -webkit-box-shadow: 2px 1px 2px #999; box-shadow: 2px 1px 2px #999; padding: 5px 20px 5px 10px; display: block; background: white; border-right: 1px dotted #CCCCCC; border-left:1px dotted #CCCCCC; border-bottom:1px dotted #CCCCCC; border-bottom-left-radius:4px; border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px;-moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px; } #header .dropdown-trigger:hover .dropdown-inner { left: 0; } #header .dropdown-trigger:hover { width: auto; } /* IE6-7 seem to need something here defining */ #header ul#dropdown-inner1 { margin-left: 560px !important; text-align: left; display: inline; width: 120px; padding:10px 30px 10px 10px;} #header ul#dropdown-inner2 { margin-left: 600px !important; padding:10px 30px 10px 10px; text-align: left; display: inline; width: 170px; } #header .dropdown-list a{font-size: 11px; background: url(/ui/header-images/dropdown-list-arrow.png) no-repeat left; padding-left: 10px;} #header .dropdown-list a:hover{color:#721E6D; text-decoration: underline; } #header .dropShadow {-moz-box-shadow: 3px 3px 4px #999; -webkit-box-shadow: 3px 3px 4px #999; box-shadow: 3px 3px 4px #999; /* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#999999')"; /* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#999999');} /* WAS PCWB_product_page.css */ #product_page_container form label { margin: 0; padding: 0; width: auto; display: inline; float: none; text-align: left; position: relative; } #product_page_container form * { font-weight: nomal; font-size: default; line-height: normal; } #product_page_container form input, #product_page_container li { padding: 0 !important; } #product_page_container { padding: 5px 13px 0px 13px; } #product_page_container form div { clear: none; } #product_page_container #product_page_left {position: relative; float: left; width: 750px; border: 1px solid #ccc; margin-bottom: 10px; background:url(/images/product-bg.jpg) repeat-y #fff; } .span-tab { color: white !important; } /*Product image and description*/ #product_page_container #product { width: 490px; float: left; padding: 15px 0px 0px 0px; } #product_page_container .product_img { width: 200px; border: 1px solid #ccc; float: left; margin-left:15px; background-color:#fff; } #product_page_container div.product_desc { float: right; width: 240px; padding: 0 7px 0 0; } #product_page_container ul.product_desc { margin: 0 0 0 14px; padding: 0 0 10px 0px; list-style-type: disc; } #product_page_container ul.product_desc li { font-size: 11px; line-height: 11px; } #product_page_container h1.product_name { font-size: 19px; color: #4B164B; margin: 0; padding: 6px 0px 2px 0px } #product_page_container div.review-subhead { padding: 0px 0px 6px 0px } #product_page_container div.review-subhead a, #product_page_container div.review-subhead img { display: block; } #product_page_container h6.product_medium_text { font-size: 12px; color: #541556; font-weight: bold; border-bottom: 1px solid #ccc; } #product_page_container div.product_medium_text_wh { font-size: 12px; font-weight: bold; margin: 5px 0 10px 0; padding-bottom: 10px; color: #fff; } #product_page_container div.pagebody { width: 725px; float: left; } /*Product logos*/ #product_page_container #product_extras { width: 202px; clear: left; float: left; margin-left: 15px;} #product_page_container .product_vid { background: #fff; border: 1px solid #ccc; margin: 7px 0 5px 0; padding: 5px 0 3px 3px; } #product_page_container .product_logos { background: #fff; border: 1px solid #ccc; margin: 10px 0 10px 0; padding: 5px 3px 3px 3px; } #product_page_container .product_logos ul { margin: 0; padding: 0; list-style: none; text-align: center; } #product_page_container .product_logos ul li { padding: 0; display: inline; list-style: none; margin: 0 5px 5px 0; } #product_page_container .product_logos ul li img { height: 30px; } #product_page_container .product_logos ul li.brand img { height: auto; max-height: 30px; } /*Product hero bundle*/ #product_page_container .hero_bundle { position:absolute; bottom: 0px; display: block; clear:left; color: #333333; font-size: 14px; background: #fff; width:488px; height: 90px; border: 1px solid #4B164B;margin: 5px 0 0 0;} #product_page_container div.hero_bundle_left_container {float: left; width:300px; } #product_page_container div.hero_bundle_left_container_inner { padding: 10px 10px 0 10px; } #product_page_container div.hero_bundle_right_container {float: right; width: 175px; height: 90px;; background:url(/images/bundle-arrow-bg.jpg) #E2E2E2 left no-repeat;} #product_page_container div.hero_bundle_right_container_inner { padding: 0 20px 0 0; } #product_page_container .hero_bundle_heading_container {display: block; padding:0; margin: 0px -1px 0px -1px; height: 18px; padding: 0 0 5px 0; color:#4B164B; font-size:13px; font-weight:bold; margin: 0 2px 0 5px; } #product_page_container span.hero_bundle_save_msg { color: #CC0000; font-size: 13px; font-weight: bold; } #product_page_container span.hero_bundle_img { display: block; float: left; margin: 0; } #product_page_container span.hero_bundle_price { display: block; margin: 5px 0 0 50px; color: #4B164B; font-size: 13px; font-weight: bold; } #product_page_container span.hero_bundle_price_ex_vat { color: #4B164B; font-size: 10px; } #product_page_container a.hero_bundle_more {display: block; float: right; font-size: 11px; font-weight: bold; background:url(/images/purple-120px.jpg) no-repeat; width: 120px; height: 20px; text-align: center; padding-top: 2px; margin: 10px 0 0 0;} #product_page_container a.hero_bundle_more {color: #FFC930; } #product_page_container a.hero_bundle_more:hover {color: #CCCCCC;} #product_page_container a.hero_bundle_show {display: block; float: right; font-size: 11px; font-weight: bold; background:url(/images/black-120px.jpg) no-repeat; width: 112px; height: 20px; text-align: left; padding: 2px 0 0 8px; margin: 6px 0 0 0} #product_page_container a.hero_bundle_show {color: #fff; } #product_page_container a.hero_bundle_show:hover {color:#FFC930;} /*Product accessories*/ #product_page_container #accessories_outer_container { float: right; background-color: #fff; } #product_page_container #accessories_container { float: right; width: 234px; padding: 15px 10px 24px 10px; background: #fff; height: 100%;} #product_page_container #accessories_container .accessories { padding: 4px 0px;} #product_page_container #accessories_container .accessories .accessories-rightmargin { width: 50px; float: right; } #product_page_container #accessories_container .accessories .accessories-rightmargin * { text-align: right; } #product_page_container #accessories_container .accessories a { display: block; } #product_page_container #accessories_container span.accessories_sml_img { display: block; margin: 0; } #product_page_container #accessories_container span.accessories_sml_img img { width: 65px; display: block; } #product_page_container #accessories_container span.accessories_sml_desc { display: block; color: #666666; font-size: 11px; margin: 4px 0 0px 5px; font-weight: bold; } #product_page_container #accessories_container span.accessories_sml_price { display: block; margin: 4px 0 3px 8px; color: #4B164B; font-size: 11px; font-weight: bold; } #product_page_container #accessories_container .checkbox { display: block; color: #4B164B; font-size: 10px; margin: 0; } #product_page_container div.accessories_more { display: block; float: right; background: url(/images/black-255px.jpg) no-repeat #1E1E1E; position: absolute; bottom:0; left: 490px;} #product_page_container a.accessories_more { display: block; width: 260px; height: 19px; } #product_page_container a.accessories_more span.accessories_more { display: block; color: #fff; padding: 3px 0 0 10px; font-size: 11px; font-weight: bold; } #product_page_container a.accessories_more:hover span.accessories_more {color:#FFC930; } /*Product price and rental box*/ #product_page_container #product_page_side_bar { width: 180px; float: right; margin: 0; } #product_page_container .price_box { background-color: #541556; height: 160px; padding: 10px 15px 22px 15px; margin: 0; border: 1px solid #ccc; } #product_page_container .smart_plan_box { background-color: #9A269D; padding: 15px 15px 10px 15px; margin: 0; border: 1px solid #ccc; } #product_page_container span.price_text_big { font-size: 22px; color: #FFCC00; font-weight: bold; } #product_page_container span.sub_text_grey { font-size: 11px; color: #CCCCCC; } #product_page_container span.sub_text_ex_vat { font-size: 11px; color: #CCCCCC; } #product_page_container input { background-color: #fff; font-size:11px; font-weight: normal } #product_page_container .product_page_input { float: left; margin: 10px 0 10px 15px; } #product_page_container .product_page_button { display: block; margin: 0; width: 100%; height: 33px; } #product_page_container .product_page_button img { display: block; } #product_page_container span.smart_plan_text { display: block; padding-bottom: 10px; } #product_page_container span.smart_plan_text, #product_page_container span.smart_plan_text * { color: #fff; } /*Product upsells*/ #product_page_container #product_upsell_main_holder {height: auto; padding:0; margin: 10px 0 0 0; border: 1px solid #ccc;} #product_page_container .product_upsell_title { background: #541556; margin: 0 0 0 0; padding: 4px 0 4px 10px; font-size: 12px; color: #fff; font-weight: bold; } #product_page_container .product_upsell_container { background: #fff; border-top: 0; margin: 0; padding: 8px 0 8px 7px; font-size: 12px; color: #541556; font-weight: bold; } #product_page_container .product_upsell_sml { width: 72px; float: left; margin-right: 6px; } #product_page_container span.product_sml_img { display: block; float: left; margin: 0; } #product_page_container span.product_sml_desc { display: block; width: 100%; float: left; color: #666666; font-size: 11px; margin: 4px 0 0 5px; } #product_page_container span.product_sml_price { display: block; width: 100%; float: left; margin: 5px 0 0 5px; color: #4B164B; font-size: 12px; font-weight: bold; } /*Product social*/ #product_page_container p.social_sml_desc { float: right; color: #666666; font-size: 11px; margin: 0 0 10px 0; font-weight: bold; width: 120px; } #product_page_container p.social_sml_img { float: left; margin: 0; width: 25px; } #product_page_container div.social_box { height: 160px; background-color:#e2e2e2; padding:0; margin: 10px 0 0 0; border: 1px solid #ccc; color: #666; } #product_page_container ul.social_box { margin: 10px 5px 15px 15px; padding: 0; float: left; list-style-type: none; width: 160px; font-size: 11px; } #product_page_container ul.social_box li { padding: 0 0 0 10px;; float: left; list-style-type: none; margin: 0; width: 155px; height: 30px; } /*Product advice*/ #product_page_container div.advice_box { height: 180px; background: #FF9900 url(/images/advice_bg.jpg) repeat; padding:5px 0 0 10px; margin: 10px 0 0 0; border: 1px solid #ccc; color: #666; } #product_page_container .advice_box_text { float: left; font-size: 13px; font-weight: bold; margin: 5px 0 10px 0; color: #333333; width: 100%; text-transform: capitalize; } #product_page_container ul.advice_box { margin: 10px 5px 5px 5px; padding: 0; float: left; list-style-type: none; width: 160px; font-size: 11px; } #product_page_container ul.advice_box li { padding: 0; float: left; list-style-type: none; margin: 0 5px 10px 0; width: 150px; height: 30px; } #product_page_container #tabs_desc_main_container { width: 700px; height: 300px; float: left; padding: 0; margin: 0 0 15px 15px; } #product_page_container hr { width: 100%; margin-top: 25px; background-color: #CCCCCC; height: 1px; border: none; } /*Product image style*/ #product_page_container .productimagesbuttonsWrap .buttons, #product_page_container .productimagesbuttonsWrap .control { float: left; display: block; padding: 1px 5px; font-size: 10px; margin: 0px 1px 0px 0px; color: white !important; background: #541556 !important; } #product_page_container .productimagesbuttonsWrap .active { color: #FFCC00 !important; background: #9A269D !important; } #product_page_container .productimagesbuttonsWrap .buttons:hover, #product_page_container .productimagesbuttonsWrap .control:hover { color: #FFCC00 !important; background: #9A269D !important; } #product_page_container .productimagesWrap { width: 200px; height: 150px; overflow: hidden; list-style: none; margin: 0; padding: 0; border-bottom: solid 1px #541556; } #product_page_container .productimagesWrap li { margin: 0; padding: 0; list-style: none !important; } #product_page_container .productimagesWrap * img { display: block; } #product_page_container .productimagesWrap .content a { display: block; height: 150px; width: 100%; } #product_page_container .productimagesWrap .content a span { display: block; height: 150px; width: 900px; } /*Conditional padding to help the hero bundle appear low enough on the screen*/ #product_page_container div.hasherobundle#product div.product_desc { padding-bottom: 90px; } #product_page_container div.hasherobundle#product div#product_extras { margin-bottom: 90px; } /* Login + Register */ #login-register-lightboxwrapper { border: solid 2px purple; } #tabcontainer-registerandlogin { width: 100%; margin-bottom: 20px; } #tabcontainer-registerandlogin h1 {font-size: 18px; background: #721E6D; border:1px solid #721E6D; border-top-left-radius:6px; border-top-right-radius:6px; -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px; color: #fff; margin:0; padding: 10px; } #tabcontainer-registerandlogin p.purple{font-size: 12px; color:#721E6D; font-weight:bold; } #tabcontainer-registerandlogin .lightbox-close{position:relative; top:25px; left: 545px;} #tabcontainer-registerandlogin #register-top { background: #fff; border:1px solid #D8D6CB; border-bottom-left-radius:6px; border-bottom-right-radius:6px; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; margin: 0; padding: 20px;} #tabcontainer-registerandlogin #register-tabs h2{font-size: 12px; font-weight:bold; color: #333; margin:0 0 20px 0;} #tabcontainer-registerandlogin .spacer { height: 60px;} #tabcontainer-registerandlogin #login-showextrafields { display: block; float: left; } #tabcontainer-registerandlogin span.small, #tabcontainer-registerandlogin span.small * { font-size: 9px; } #tabcontainer-registerandlogin .block { display: block; } #tabcontainer-registerandlogin #tab-registerandlogin-login form label, form span.label {clear: left;} #tabcontainer-registerandlogin div.left {width: 40%; float: left; margin:0 15px 10px 10px } #tabcontainer-registerandlogin div.right {width: 30%; float: left; border-left: 1px solid #B9B9B9; padding-left:15px; } #tabcontainer-registerandlogin div.far-right {float: left; width: 40%; border-left: 1px solid #B9B9B9; padding:0 0 0 15px; } #tabcontainer-registerandlogin div.bottom-align {padding-top: 0px; } #tabcontainer-registerandlogin div.bottom-align p { padding: 3px 0; } /* Tooltip */ #tabcontainer-registerandlogin .tooltip_img { border:none; margin: 0 0 0 8px;} #tabcontainer-registerandlogin .tooltip span {display:none; padding:10px; width:150px; cursor: pointer; } #tabcontainer-registerandlogin .tooltip:hover span{display:inline; position:absolute; border:1px dotted #999999; background:#fff; color:#333; margin-left:5px; font-weight: normal;} /* Buttons */ #tabcontainer-registerandlogin .but_purple, #tabcontainer-registerandlogin .but_sml, #tabcontainer-registerandlogin .but_purple_med, #tabcontainer-registerandlogin .but_purple_long { color:white; padding: 2px 6px; background: #721E6D; font-weight: bold; min-width: 150px; cursor: pointer; -moz-box-shadow: 2px 2px 3px #999; -webkit-box-shadow: 2px 2px 3px #999; box-shadow: 2px 2px 3px #999; border:1px solid #631D5D; border-bottom-left-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; border-top-left-radius:4px; border-top-right-radius:4px; -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px; } #tabcontainer-registerandlogin .but_purple:hover, #tabcontainer-registerandlogin .but_sml:hover, #tabcontainer-registerandlogin .but_purple_med:hover, #tabcontainer-registerandlogin .but_purple_long:hover { background: black; } #tabcontainer-registerandlogin div.but {margin:0 0 0 10px;} #tabcontroller-registerandlogin li a { width: 150px; background: #CCCCCC; font-size: 18px; color: black; margin-right:5px; border:1px solid #D8D6CB; border-bottom:none; border-top-left-radius:6px; border-top-right-radius:6px; -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px; } #tabcontainer-registerandlogin #tabcontroller-registerandlogin li.ui-tabs-selected a { background: #721E6D; color: white; border:1px solid #721E6D; border-bottom:none; } #tabcontainer-registerandlogin #tabcontroller-registerandlogin li a:hover { background: black; color: white; } #tabcontroller-registerandlogin, #tabcontroller-registerandlogin li, #tabcontroller-register, #tabcontroller-register li { margin: 0; padding: 0; list-style: none; display: block; float: left; } #tabcontroller-registerandlogin li a, #tabcontroller-register li a { display: block; padding: 8px 16px; float: left; } #tabcontroller-register li a { width: 200px; color: #000; border-left: 1px solid #BEBEBE; border-top: 1px solid #BEBEBE; border-right: 1px solid #BEBEBE; border-top-left-radius:6px; border-top-right-radius:6px; -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px; margin-right: 3px; } #tabcontroller-register #tabcontroller-register-btn-express {background:#DFDFDF; } #tabcontroller-register #tabcontroller-register-btn-link {background: #CACACA; } #tabcontroller-register #tabcontroller-register-btn-upgrade {background:#B9B9B9; } #tabcontroller-register li a:hover { background: #D8D6CB; color: #58155B;} #tabcontroller-login #tabcontroller-login li { margin: 0; padding: 0; list-style: none; display: block; float: left; } #tab-registerandlogin-login, #login-extrafields, #login-extrafields-alt, #tab-registerandlogin-register, #tab-register-express, #tab-register-link, #tab-register-upgrade { clear: left; } #tab-registerandlogin-login { background: #E9E8E0; padding: 20px; border:1px solid #D8D6CB; border-top: solid 4px #721E6D; border-bottom-left-radius:6px; border-bottom-right-radius:6px; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; } #tab-registerandlogin-register { background: #E9E8E0; border:1px solid #D8D6CB; border-top: solid 4px #721E6D; border-bottom-left-radius:6px; border-bottom-right-radius:6px; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; padding:20px 20px 28px 25px; } #tab-registerandlogin-register .tab-register-sub { border: 1px solid #BEBEBE; border-top: none; border-top-right-radius: 8px; -moz-border-radius-topright: 8px; border-bottom-left-radius:6px; border-bottom-right-radius:6px; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; padding: 20px; margin:0; } #tab-register-express {background: #DFDFDF; padding-top: 10px !important; } #tab-register-link {background: #CACACA; } #tab-register-upgrade {background: #B9B9B9; } #login-extrafields {background: #fff; padding: 10px 15px 15px 15px; border:1px solid #969270; border-bottom-left-radius:6px; border-bottom-right-radius:6px; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; border-top-left-radius:6px; border-top-right-radius:6px; -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px;} #tabcontainer-registerandlogin form fieldset {background: #fff; border-color: #BBBBBB #666666 #666666 #BBBBBB; border-style: solid; border-width: 1px; margin: 15px 0; padding: 15px; } #tabcontainer-registerandlogin form p.note {color: #333333; float: left; margin: 0; padding: 4px; } /* BILLING AND DELIVERY */ #billing_and_delivery fieldset.billing_and_delivery { border: solid 1px #C6C3B2; padding: 0px 15px 8px 15px; } #billing_and_delivery fieldset.billing_and_delivery legend { font-weight: bold; } #billing_and_delivery .basket_summary_content_item, #billing_and_delivery .basket_summary_content_subtotal, #billing_and_delivery .basket_summary_content_vat, #billing_and_delivery .basket_summary_content_total, #billing_and_delivery .basket_summary_content_view { float: left; margin: 0px 70px 0px 0px; } #billing_and_delivery .basket_summary_content_item { font-weight: bold; margin: 0 50px 0 40px; } #billing_and_delivery .basket_summary_content_total { font-weight: bold; } #billing_and_delivery #billing_and_delivery_table{margin: 4px 0 0 0; text-align: left; float: left;} #billing_and_delivery th{padding: 4px 10px 4px 10px; font-weight:bold; color: #000; background: #C6C3B2;} #billing_and_delivery .billing{ background: #EDEDED; border: 1px solid #fff; color: #000; padding: 15px;} #billing_and_delivery .delivery{ background: #E9E8E2; border: 1px solid #fff; color: #000; padding: 15px;} #billing_and_delivery .payment{ background: #DEDDD3; border: 1px solid #fff; padding: 15px;} #billing_and_delivery td.blank{ background: none;} #billing_and_delivery #billing_address_table{ margin:10px 0 0 0; width:240px; text-align: left; float: left;} #billing_and_delivery #delivery_address_table{ margin:10px 0 0 0; width:400px; text-align: left; float: left;} #billing_and_delivery #delivery_address_table2{ margin: 0; width:360px; text-align: left; float: left;} #billing_and_delivery #payment{ margin:10px 0 0 0; width:170px; text-align: left; float: left;} #billing_and_delivery .form_label{font-size: 11px; float: left; color:#721E6D;} #billing_and_delivery .form_label_blk{font-size: 11px; float: left; color:#000;} #billing_and_delivery .form_label_big{font-size: 13px; float: left; color:#721E6D; margin: 0px;} #billing_and_delivery .form_field{padding:0 0 15px 0;} #billing_and_delivery .form_std{color: #000; padding-bottom: 15px;} #billing_and_delivery .form_sml{font-size: 10px; color: #000; padding-bottom: 15px; text-decoration: underline;} #billing_and_delivery .form_method{ background:#C6C3B2; padding:10px; margin: 0px;} #billing_and_delivery .but_sml { font-size:8px; padding:2px; margin: 1px 0 0 5px; border: 1px dotted #333333; background:#D5D2C6; color: #333; text-transform:uppercase; cursor: pointer; font-weight:bold;} #billing_and_delivery .help_tool_tip_form{margin-top: 3px;} #billing_and_delivery .but_orange{ margin: 7px 0; border:0; color: black; padding: 2px 8px; -moz-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 2px 2px 2px #666; -webkit-box-shadow: 2px 2px 2px #666; box-shadow: 2px 2px 2px #666; text-transform: uppercase; background: #ff9900; text-align: center; font-weight: normal; cursor: pointer; } #billing_and_delivery .but_orange:hover { color: white; background: black;} #billing_and_delivery #type {display:none;} #billing_and_delivery a.btn { display: block; padding: 4px; text-align: center; background: red; color: white; } ul#idaccordiondelivery, ul#idaccordiondelivery li { list-style: none; padding: 0; margin: 0; display: block; } ul#idaccordiondelivery li { padding: 4px 0px; } ul#idaccordiondelivery li div.accordion-sub { padding: 4px 0px 6px 28px; } ul#idaccordiondelivery li label { font-weight: bold; } /* BASKET */ #basket h4.basket_tools {font-size: 12px; color:#721E6D; margin:0 0 10px 10px;; } #basket h5{font-size: 14px; padding-top: 10px; color:#333; } #basket .but_orange { border:0; width:158px; height:20px; color:#000; font-size:0.85em; padding-top: 6px; text-transform: uppercase; background:url("/ui/buttons/pcwb_but_orange.png") no-repeat 0 0; text-align: center; cursor: pointer; font-weight: bold;} #basket .but_orange:hover { color:#333; background:url("/ui/buttons/pcwb_but_orange.png") no-repeat 0 -27px ;} #basket .but_grey {border:0; width:158px; height:20px; color:#fff; font-size:0.85em; padding-top: 6px; text-transform: uppercase; background:url("/ui/buttons/pcwb_but_grey.png") no-repeat 0 0; text-align: center; cursor: pointer; font-weight: bold;} #basket .but_grey:hover { background:url("/ui/buttons/pcwb_but_grey.png") no-repeat 0 -27px ;} #basket .basket_nav_top_right { float: right; margin: 0 0 0 300px; text-align: left;} #basket .basket_nav_top_right ul{margin: 0;} #basket .basket_nav_top_right li{display: block; margin: 0 0 5px 0; } #basket #right_column{width: 200px; height:auto; float: right;} #basket .add_ons{width: 200px; height:auto; background-color: #E2E2E2; float: right; margin: 1px 0 10px 0; } #basket .add_ons_top{height:20px; background-color: #721E6D; padding: 7px 4px 4px 4px; color: #fff; font-weight: bold;} #basket .add_ons_content{height:auto; background-color: #EDEDED; padding: 10px 4px 4px 4px; color: #000; font-weight: bold; border: 1px solid #ccc;} #basket .add_ons_footer{height:20px; background-color: #9D9D9D; padding: 4px; color: #fff; font-weight: bold;} #basket .quote_but_container {width: 200px; float: left;} #basket .edit_quote{float:left;} #basket .save_quote{float:left; } #basket .quote_input {font-size:12px; vertical-align: top; float: left;} #basket .quote_but{font-size:8px; padding:3px 2px 2px 2px; margin: 1px 0 0 5px; width: auto; float: left; border: 1px dotted #333333; background:#D5D2C6; color: #333; text-transform:uppercase; cursor: pointer;} #basket .note{margin-top: 10px;} #basket .basket_tools_container {float: right; background:#E2E2E2; border: 1px dotted #666666; padding: 0 5px 5px 5px; margin:0 0 10px 0;} #basket .basket_tools {width: 188px; height: auto; } #basket ul.basket_tools{ margin: 5px 0 5px 0; font-size:10px; list-style-type:none;} #basket li.basket_tools{ color: #333; float: left; display: block;} #basket a.basket_tools{ color: #333;} #basket #display_basket{ border: 1px solid #fff; width: 100%; } #basket #display_basket th{padding: 2px 10px 2px 10px; font-weight:bold; font-size: 12px; color: #000; background: #C6C3B2; border: 1px solid #fff;} #basket #display_basket tr {background: #EDEDED;} #basket #display_basket tr:hover td{ background: #E0E0E0;} #basket #display_basket .blank { background: transparent; border: none;} #basket #display_basket .basket-foot { background: transparent; border: none; text-align: right; } #basket #display_basket tr:hover td.blank{ background: #fff;} #basket #display_basket .center{text-align: center;} #basket #display_basket .delivery{ background: #D6D6D6; border: 1px solid #fff; text-align: right;} #basket #display_basket tr:hover td.delivery{ background: #D6D6D6;} #basket #display_basket .subtotal{ background: #C6C3B2; border: 1px solid #fff; color: #000; font-weight:bold; text-align: right;} #basket #display_basket tr:hover td.subtotal{ background: #C6C3B2;} #basket #display_basket .vat{ background: #DBDBDB; border: 1px solid #fff; text-align: right;} #basket #display_basket tr:hover td.vat{ background: #DBDBDB;} #basket #display_basket .total{ background: #A9A58B;border: 1px solid #fff; color:#5F0559; font-weight: bold; text-align: right;} #basket #display_basket tr:hover td.total{ background: #A9A58B;} #basket #display_basket .delivery-options { float:left; } #basket #display_basket .controlset { margin:0px; float: left; text-align: left; margin: 0 0 5px 0;} #basket #display_basket .but_sml {font-size:8px; padding:2px; margin: 1px 0 0 5px; width: auto; float: left; border: 1px dotted #333333; background:#D5D2C6; color: #333; text-transform:uppercase; cursor: pointer; font-weight:bold;} #basket #payment-options { float: right; width: 180px; padding: 10px 0 0 0; } #basket #payment-options .pay {font-weight: normal; padding: 0; margin: 0 0 5px 0;} #basket #payment-options .but_orange{border:0; width:158px; height:26px; color:#000; font-size:0.85em; padding-top: 0px; text-transform: uppercase; background:url("/ui/buttons/pcwb_but_orange.png") no-repeat 0 0; text-align: center; font-weight: normal; cursor: pointer; font-weight: bold;} #basket #payment-options .but_orange:hover { color:#333; background:url("/ui/buttons/pcwb_but_orange.png") no-repeat 0 -27px ;} #basket #payment-options .but_grey {border:0; width:158px; height:24px; color:#fff; font-size:0.85em; padding-top: 3px; text-transform: uppercase; background:url("/ui/buttons/pcwb_but_grey.png") no-repeat 0 0; text-align: center; font-weight: bold;} #basket #payment-options .but_grey:hover { background:url("/ui/buttons/pcwb_but_grey.png") no-repeat 0 -27px ;} #basket #main_page_left { float: left; width: 720px; } #basket .basket-item-subcomment, #basket .basket-item-subcomment * { font-size: 10px; } #basket .remove * { font-size: 10px; } #basket .update, #basket .update_input { text-align: center; } #basket dl.basketoptions {height: auto; margin-bottom: 10px;} #basket dl.basketoptions .add_ons_img_container{ border: 1px solid #C6C3B2; float: left;} #basket dl.basketoptions .desc{ margin:0 0 10px 10px; width: 110px; float: right; } #basket dl.basketoptions .price{ float:left; margin-left: 10px; font-size: 12px; } #basket dl.basketoptions .vat{ margin: 3px 0 0 5px; float:left; font-size: 10px; color: #666; font-style: italic; } #basket dl.basketoptions .add{ margin: 3px 0 0 5px; float:left; font-size: 12px; text-transform: uppercase; padding-bottom:20px; display:block;} #basket dl.basketoptions .add a{ color: #721E6D; } #basket .product_img_container {width: 70px; vertical-align:top; border: 1px solid #fff; } #basket .basket_product_img {width: 67px; height: 50px; background: #fff; border: 1px solid #C6C3B2; text-align:center; margin:8px 0 0 5px; } #basket td.desc {width: 300px; border: 1px solid #fff; margin:0;} #basket td.update{margin-left: 10px; border: 1px solid #fff;} #basket .input { border: solid 1px #A9A58B; background: #D5D2C6; margin: 0 0 0 4px; color: #333; cursor: pointer; } #basket td.price{margin-left: 10px; border: 1px solid #fff; text-align: right;} /* AUTOCOMPLETE.js */ .ac_results { padding: 0px; border: 1px solid black; background: white; overflow: hidden; } .ac_results ul { width: 100%; list-style-position: outside; list-style: none; padding: 0; margin: 0; } .ac_results li { margin: 0px; padding: 2px 5px; cursor: pointer; display: block; line-height: 16px; overflow: hidden; } .ac_odd { background-color: #eee; } .ac_over { background-color: #0A246A; color: white; } .ac_results span.x { display: block; } .ac_results span.x, .ac_results span.x strong { color: #BBBBBB !important; font-size: 10px !important; }