/* ----------------------------------------------------------------------------------- This CSS file is split into 3 areas to enable web developers and designers of different abilities to make edits and alterations to the default design. Reset: This removes all default browser styling. The advantage is closer agreement between different browsers so there are fewer hacks to do Layout: This is where the main layout is put together. By this we mean the columns boxes, header and footer sections. The more fine-grained layouts of each individual section are handled separately in section 2. Boxes: Element and section styles can be handled here, for example .sidebar ul enables you to style all menus in a sidebar. Backgroud images are applied where appropriate to avoid duplication, also background images and padding, margins on boxes etc.. should be kept together as they are not necessarily mutually exclusive when it comes to creating certain effects You can search through the file using crtl+F and search for specific sections via the id eg. #top-search, #basket etc... or use the section flag eg. =box, =search, =top, =links, =nav Basics: Basic element styles. Notes: 1/ There are some extra CSS hooks available to you to make the template as customisable as possible. Firstly the tag has an id similar to the sites hostname eg. #www-example-quickorder-uk-com, which is useful if you need to over-ride downstream styles (ids over-ride styles applied via classes and single elements. 2/ =nav - any section that is the default navigation, eg. page list and category list =links - any section that pulls its data from the links table. =basket - shopping and enquiry baskets =top - any section that appears at the top eg. inside the header =bottom - bottom section =box - any section that relates to the styling of the .box construct surrounding each section of the site. =sidebar - anything that appears in the 3/ Take a look at the information regarding the .body class in the bottom section of the file. */ /* Reset */ body { } * { /* normalise margin, padding, typography */ margin: 0; padding: 0; font-family: Helvetica,Verdana,Arial,sans-serif; font-size: 100%; } ol, ul { list-style: none outside; } /* remove bullets by default, only desirable under the .body-text class */ table.nc { border-collapse: collapse; border-spacing: 0; } /* collapse space between table cells by default. 'nc' is a special class for tables written out by the template and not by the wysiwyg editor */ fieldset, img { border: 0; } q:before, q:after { content: ''; } /* bring good browsers in line with IE <= 6 (!?) */ button { width: auto; overflow: visible; } /* Layout ------------------------------------------------------------------------------------*/ html, body { text-align: center; } #wrapper { /* this wraps everything inside the tag */ text-align: left; width: 960px; min-width: 760px; margin: 0 auto; min-height: 620px; padding-bottom: 16px; overflow: hidden; } body.home { background: #CC005B; } body.home #wrapper { background: #CC005B; } body.home #header { background: url(/static/images/homelogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.home #header { background: url(/static/images/union-jack-pink.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.home #header h1 { text-indent: -9999px; } body.page.contact-outstanding-branding { background: #800F63; } body.page.contact-outstanding-branding #wrapper { background: #800F63; } body.page.contact-outstanding-branding #header { background: url(/static/images/contactlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.contact-outstanding-branding #header { background: url(/static/images/union-jack-purple.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.contact-outstanding-branding #header h1 { text-indent: -9999px; } body.page.contact-outstanding-branding #primary h2 { display: none; } body.page.contact-outstanding-branding .primary form li label { width: 140px; background:none repeat scroll 0 0 #CC005B; color:#F5D6ED;height: 20px;} body.page.contact-outstanding-branding .primary fieldset li { padding: 0 0 4px 0; } body.page.contact-outstanding-branding .primary form li input { background:none repeat scroll 0 0 transparent; border:1px solid #C8C8C8; color:#F5D6ED; width:265px; height: 20px;} body.page.contact-outstanding-branding .primary form li textarea { background:none repeat scroll 0 0 transparent; border:1px solid #C8C8C8; color:#F5D6ED; width:263px; height: 100px; padding-right:0;} body.page.contact-outstanding-branding fieldset.submit { padding:0; text-align:left; } body.page.contact-outstanding-branding fieldset.submit input { margin-left: 152px; background:none repeat scroll 0 0 #CC005B; border:0 none; color:#F5D6ED; display:block; font-size:12px; padding:5px 4px 3px; text-align:center; text-decoration:none; width:102px; } body.page.four-hour-guarantee fieldset { padding-top:0; } body.page.four-hour-guarantee input.submit { cursor: pointer; padding: 5px;border:none; color:#fff; background: #2696E5; } body.page.four-hour-guarantee .primary form li label { padding-left: 10px; width: 140px; background:none repeat scroll 0 0 #2696E5; color:#fff; height: 20px;} body.page.four-hour-guarantee .primary form li label.checkbox { background:none; margin-left:0 !important; } body.page.four-hour-guarantee .primary form li label.checkbox input { width: 20px; } body.page.four-hour-guarantee .primary form li input { background:none repeat scroll 0 0 transparent; border:1px solid #fff; color:#fff; width:265px; height: 20px;} body.page.four-hour-guarantee fieldset.submit { text-align:left; } body.page.four-hour-guarantee fieldset.group legend { display:none; } body.page.contact-outstanding-branding fieldset.submit input:hover { background: #c380b2; color: #942477; cursor: pointer; } body.page.contact-outstanding-branding .primary fieldset ol { margin-bottom: 0; } body.page.search { background: #2696E5; } body.page.search #wrapper { background: #2696E5; } body.page.search #header { background: url(/static/images/searchlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.search #header { background: url(/static/images/union-jack-blue.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.search #header h1 { text-indent: -9999px; } body.page.search #primary h2 { display: none; } body.page.search #top-links a { color: #76CAF2; } body.page.search #top-links a:hover { color: #fff; } body.page.search #footer #bottom-links a { color: #76CAF2; } body.page.search #footer #bottom-links a:hover { color: #fff; } body.page.search .primary fieldset label { display: none; } body.page.search #footer #bottom-links { margin-top: 20px; } body.category { background: #2696E5; } body.category #wrapper { background: #2696E5; } body.category #header { background: url(/static/images/searchlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.search #header { background: url(/static/images/union-jack-blue.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.category #header h1 { text-indent: -9999px; } body.category #primary h2 { display: none; } body.category #top-links a { color: #76CAF2; } body.category #top-links a:hover { color: #fff; } body.category #footer #bottom-links a { color: #76CAF2; } body.category #footer #bottom-links a:hover { color: #fff; } body.category .primary fieldset label { display: none; } body.category #footer #bottom-links { margin-top: 20px; } /** * Search Box */ div#search { width: 520px; position: relative; clear:both; overflow:hidden; zoom:1; padding-top:17px;} div#search legend { display:none; } div#search label { display:none; } div#search ol { list-style:none; margin:0; width:400px; padding:0; height:30px; } div#search fieldset { float:left; } .info { color:#C7EDF9; margin:10px 0 5px 0; font-size:13px; } div#search select { position: absolute; width: 183px; padding: 2px 0; border: 1px solid #C7EDF9; background: #2696E5; color: #C7EDF9; font-size: 11px; margin: 0; } div#search input#keywords-t { position: absolute; margin-left: 193px; width: 171px; padding: 5px 5px 3px 5px; border: 1px solid #C7EDF9; background: #2696E5; color: #C7EDF9; font-size: 11px; } div#search fieldset.submit { position: absolute; left:400px; top:32px; } div#search-results { background: #fff; } #search fieldset li { padding-bottom: 0; } div#search-results ol { float: left; margin: 0; padding: 0; width: 960px; list-style: none; margin-left: 30px; } div#search-results ol li { display: block; float: left; width: 183px; height: 355px; margin:0 20px 10px; background: #FFF url(http://outstandingbranding.com/promoserve/images/no-product.gif) 0 44px no-repeat; font-size: 12px; _font-size: 11px; overflow: hidden; padding: 0; border: 1px solid #ccc; } div#search-results h3 { position: absolute; width: 173px; height: 35px; color: #2696E5; padding: 5px 5px 0 5px; border-bottom: 5px solid #2696E5; font-size: 12px; } div#search-results a { color:#2696E5; font-weight:bold; } div#search-results .pagination a { color: #666666 } div#search-results a:hover { color:#AbB816; } div#search-results img.image { position:absolute; width:100px; height:100px; margin-top:44px; padding:32px 41px 33px 42px; background:#FFF; top:0; left:0; border: none; } div#search-results div.body { position:relative; top:209px; left:0; padding:5px; height:70px; line-height:14px; color:#808080; overflow:hidden; zoom:1; } div#search-results p.price-box { position:relative; top:209px; padding:5px; width:173px; height:37px; color:#808080; margin:0; text-transform:lowercase; } div#search-results div.options { display:none; } div#search-results p.price-box div { margin-top:5px } div#search-results span.right { display:block; float:right; text-align:right; } div#search-results span.left { display:block; float:left; } div#search-results span.pid { display:none; } div#search-results span.price{ color:#2696E5; } /** * Paging */ div.pagination { } div.pagination a { color:#FFFFFF; } div#paging{ font-size:12px; margin: 0; } div#paging a{ display:inline; text-decoration:none; color:#FFFFFF; } div#paging a.pageBtn { border:#FFFFFF 1px solid; padding: 2px 6px; margin: 0 5px 0 0; display:block; float:left; } div#paging a.pageBtn_on, div#paging a:hover { text-decoration:none; background:#AbB816; border:#AbB816 1px solid; padding: 2px 6px; margin: 0 5px 0 0; display:block; float:left; } body.page.outstanding-branding-offers { background: #542F09; } body.page.outstanding-branding-offers #wrapper { background: #542F09; } body.page.outstanding-branding-offers #header { background: url(/static/images/offerlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.outstanding-branding-offers #header { background: url(/static/images/union-jack-brown.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.outstanding-branding-offers #header h1 { text-indent: -9999px; } body.page.outstanding-branding-offers #primary h2 { display: none; } body.page.outstanding-branding-offers #top-links a { color: #A48E6E; } body.page.outstanding-branding-offers #top-links a:hover { color: #fff; } body.page.outstanding-branding-offers #footer #bottom-links a { color: #A48E6E; } body.page.outstanding-branding-offers #footer #bottom-links a:hover { color: #fff; } body.page.four-hour-guarantee { background: #542F09; } body.page.four-hour-guarantee #wrapper { background: #542F09; } body.page.four-hour-guarantee #header { background: url(/static/images/offerlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.four-hour-guarantee #header { background: url(/static/images/union-jack-brown.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.four-hour-guarantee #header h1 { text-indent: -9999px; } body.page.four-hour-guarantee #primary h2 { display: none; } body.page.four-hour-guarantee #top-links a { color: #A48E6E; } body.page.four-hour-guarantee #top-links a:hover { color: #fff; } body.page.four-hour-guarantee #footer #bottom-links a { color: #A48E6E; } body.page.four-hour-guarantee #footer #bottom-links a:hover { color: #fff; } body.page.testimonials { background: #ABB816; } body.page.testimonials #wrapper { background: #ABB816; } body.page.testimonials #header { background: url(/static/images/testimonialslogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.testimonials #header { background: url(/static/images/union-jack-green.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.testimonials #header h1 { text-indent: -9999px; } body.page.testimonials #primary h2 { display: none; } body.page.testimonials #top-links a { color: #E9EEB3; } body.page.testimonials #top-links a:hover { color: #fff; } body.page.testimonials #footer #bottom-links a { color: #E9EEB3; } body.page.testimonials #footer #bottom-links a:hover { color: #fff; } body.page.latest-news { background: #ABB816; } body.page.latest-news #wrapper { background: #ABB816; } body.page.latest-news #header { background: url(/static/images/testimonialslogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.latest-news #header { background: url(/static/images/union-jack-green.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.latest-news #header h1 { text-indent: -9999px; } body.page.latest-news #primary h2 { display: none; } body.page.latest-news #top-links a { color: #E9EEB3; } body.page.latest-news #top-links a:hover { color: #fff; } body.page.latest-news #footer #bottom-links a { color: #E9EEB3; } body.page.latest-news #footer #bottom-links a:hover { color: #fff; } body.news { background: #ABB816; } body.news #wrapper { background: #ABB816; } body.news #header { background: url(/static/images/testimonialslogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.news #header { background: url(/static/images/union-jack-green.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.news #header h1 { text-indent: -9999px; } body.news #primary h2 { display: none; } body.news #top-links a { color: #E9EEB3; } body.news #top-links a:hover { color: #fff; } body.news #footer #bottom-links a { color: #E9EEB3; } body.news #footer #bottom-links a:hover { color: #fff; } body.news div.body { color: #fff; clear: left;} body.news #kirzenchatvisitordiv2 { display: none; } body.news a { color: #2696E5; } body.news #primary { background: url(/static/Image/newsbg.png) no-repeat; } body.news div.date { font-weight: bold; font-style: normal; color: #fff; font-size: 12px; float:left; width:80px; } body.news p.strapline { font-weight: bold; font-style: normal; color: #fff; font-size: 12px; float:left; } body.news .back { text-align: left; } body.news .back a { color: #2696E5; } body.page.about-us { background: #542F09; } body.page.about-us #wrapper { background: #542F09; } body.page.about-us #header { background: url(/static/images/offerlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.about-us #header { background: url(/static/images/union-jack-brown.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.about-us #header h1 { text-indent: -9999px; } body.page.about-us #primary h2 { display: none; } body.page.about-us #top-links a { color: #A48E6E; } body.page.about-us #top-links a:hover { color: #fff; } body.page.about-us #footer #bottom-links a { color: #A48E6E; } body.page.about-us #footer #bottom-links a:hover { color: #fff; } body.page.the-outstanding-promo-show { background: #542F09; } body.page.the-outstanding-promo-show #wrapper { background: #542F09; } body.page.the-outstanding-promo-show #header { background: url(/static/images/offerlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.the-outstanding-promo-show #header { background: url(/static/images/union-jack-brown.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.the-outstanding-promo-show #header h1 { text-indent: -9999px; } body.page.the-outstanding-promo-show #primary h2 { display: none; } body.page.the-outstanding-promo-show #top-links a { color: #A48E6E; } body.page.the-outstanding-promo-show #top-links a:hover { color: #fff; } body.page.the-outstanding-promo-show #footer #bottom-links a { color: #A48E6E; } body.page.the-outstanding-promo-show #footer #bottom-links a:hover { color: #fff; } body.page.enquiry-basket { background: #2696E5; } body.page.enquiry-basket #wrapper { background: #2696E5; } body.page.enquiry-basket #header { background: url(/static/images/searchlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.enquiry-basket #header { background: url(/static/images/union-jack-blue.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.enquiry-basket #header h1 { text-indent: -9999px; } body.page.enquiry-basket #primary h2 { display: none; } body.page.enquiry-basket #top-links a { color: #76CAF2; } body.page.enquiry-basket #top-links a:hover { color: #fff; } body.page.enquiry-basket #footer #bottom-links a { color: #76CAF2; } body.page.enquiry-basket #footer #bottom-links a:hover { color: #fff; } body.product { background: #2696E5; } body.product #wrapper { background: #2696E5; } body.product #header { background: url(/static/images/searchlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.product #header { background: url(/static/images/union-jack-blue.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.product #header h1 { text-indent: -9999px; } body.product #primary h2 { } body.product #top-links a { color: #76CAF2; } body.product #top-links a:hover { color: #fff; } body.product #footer #bottom-links a { color: #76CAF2; } body.product #footer #bottom-links a:hover { color: #fff; } body.page.faq-s { background: #ABB816; } body.page.faq-s #wrapper { background: #ABB816; } body.page.faq-s #header { background: url(/static/images/testimonialslogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.faq-s #header { background: url(/static/images/union-jack-green.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.faq-s #header h1 { text-indent: -9999px; } body.page.faq-s #primary h2 { display: none; } body.page.faq-s #top-links a { color: #E9EEB3; } body.page.faq-s #top-links a:hover { color: #fff; } body.page.faq-s #footer #bottom-links a { color: #E9EEB3; } body.page.faq-s #footer #bottom-links a:hover { color: #fff; } body.page.how-to-find-us { background: #800F63; } body.page.how-to-find-us #wrapper { background: #800F63; } body.page.how-to-find-us #header { background: url(/static/images/contactlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.how-to-find-us #header { background: url(/static/images/union-jack-purple.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.how-to-find-us #header h1 { text-indent: -9999px; } body.page.how-to-find-us #primary h2 { display: none; } body.page.terms-conditions { background: #2696E5; } body.page.terms-conditions #wrapper { background: #2696E5; } body.page.terms-conditions #header { background: url(/static/images/searchlogo.png) no-repeat; height: 300px; margin:40px 0 0;} /*body.page.terms-conditions #header { background: url(/static/images/union-jack-blue.jpg) no-repeat; height: 300px; margin:40px 0 0;}*/ body.page.terms-conditions #header h1 { text-indent: -9999px; } body.page.terms-conditions #primary h2 { display: none; } body.page.terms-conditions #top-links a { color: #76CAF2; } body.page.terms-conditions #top-links a:hover { color: #fff; } body.page.terms-conditions #footer #bottom-links a { color: #76CAF2; } body.page.terms-conditions #footer #bottom-links a:hover { color: #fff; } /** * Product View */ div#product { background: #fff; } div#product h2 { width: 415px; display:block; background:#FFFFFF; color:#2696E5; padding:5px; margin:0px 0 5px 0; font-size:14px; font-weight:bold; padding-left: 347px; border: none; padding-top: 20px;} div#product h2 span { } div#product div.image { float:left; width:310px; height:356px; background:#FFFFFF; margin: 0 5px 5px 20px; border: none; padding-bottom: 200px;} div#product div.image img { margin:53px 0 0 30px; } div#product div.body{ display:block; float:left; line-height:16px; width:415px; background:#FFFFFF; color:#808080; padding: 10px 45px 10px 5px; margin: 0 0 5px 0;font-size:12px; } div#product table.nc{ float:left; width:465px; margin:0 0 5px; padding:10px 45px 10px 5px; border-spacing:0; } div#product table.nc thead th { font-weight: bold; color: #ABB816; } div#product table.nc tbody th { font-weight: bold; color: #ABB816; } div#product p.price-box{ display:none; } div#product table.nc tr{ background:#FFFFFF; color:#808080; margin: 0 0 5px 0; } div#product table.nc td{ background:#FFFFFF; color:#808080; margin: 5px 0 0 0; padding:10px 5px; border-bottom:#2696E5 5px solid; font-size:12px;} div#product table.nc th{ background:#FFFFFF; color:#2696E5; margin: 5px 0 0 0; padding:10px 5px; border-bottom:#2696E5 5px solid; text-align:left; font-weight:normal; font-size:12px; } div#product table.nc tr.commodity-code { display: none; } div#product form.basket { } #restrictions { display:none; } div#product div.back { display:none; float:left; width:770px; padding:5px; color:#FFFFFF; font-size:12px; } div#product div.back a { text-align:center; border:#FFFFFF 1px solid; color:#FFFFFF; background:#2696E5; padding: 4px 20px 3px 20px; margin: 0 10px 5px 0; font-size:11px; text-decoration:none; } div#product div.back a:hover { text-decoration:none; background:#AbB816; border:#AbB816 1px solid; } div#product form.enquiry{ padding:5px; } div#product label { float:left; margin: 0 5px 0 0; } div#product input.submit { float:left; border:#FFFFFF 1px solid; color:#FFFFFF; background:#2696E5; padding: 2px 0; width:105px; margin: 0 5px 5px 0; font-size:11px; } div#product input.submit:hover { text-decoration:none; background:#AbB816; border:#AbB816 1px solid; } div#product form.favourites { display:none; } div#product div.options { display:block; width:465px; float:left; background:#FFFFFF; color:#808080; font-size:12px; } div#product div.options a{ display:block; margin: 10px 5px; } input.qty { font-size:12px; } div.global-body { display:none; } div#content { margin-top:10px; overflow:hidden; width:960px; } div.contentFloat { margin-left:-320px; position:absolute; top:355px; } div#copy { float:left; margin:5px 0 0; overflow:hidden; width:445px; } div#image { float:right; margin:5px 0 0; overflow:hidden; width:497px; } #kirzenchatvisitordiv2 { position:absolute; top: 250px; right: 30px; } /*body.home #kirzenchatvisitordiv2 { display: none; } body.page.contact #kirzenchatvisitordiv2 { display: none; } body.page.outstanding-branding-offers #kirzenchatvisitordiv2 { display: none; } body.page.testimonials #kirzenchatvisitordiv2 { display: none; } body.page.how-to-find-us #kirzenchatvisitordiv2 { display: none; } body.page.terms-conditions #kirzenchatvisitordiv2 { display: none; } body.page.faq-s #kirzenchatvisitordiv2 { display: none; } body.page.about-us #kirzenchatvisitordiv2 { display: none; } body.page.latest-news #kirzenchatvisitordiv2 { display: none; } body.page.search #kirzenchatvisitordiv2 { display: none; }*/ body.page.enquiry-basket #kirzenchatvisitordiv2 { position: absolute; top: 525px; left: 480px; } #kirzenchatvisitordiv3 { position: absolute; left: 550px; top: 260px; width: 173px; height: 72px; } #kirzenchatvisitordiv3 img { padding:0; } /** * Enquiry Basket */ div#enquiry { width:652px; margin-left:4px; } div#enquiry span.basket-step { color:#fff; font-size:12px; } div#enquiry a.form-step{ display:none; } div#enquiry table{ border-spacing:5px; width:652px; margin: 0 0 0 -5px; _margin: 5px 0 0 0;} div#enquiry thead th { border-spacing:5px; background:#FFFFFF; color:#2696E5; font-weight:normal; text-align:left; padding:5px; font-size:12px; } div#enquiry tbody td { border-spacing:5px; background:#FFFFFF; color:#2696E5; font-weight:normal; text-align:left; padding:5px; font-size:12px; vertical-align:middle; } div#enquiry th#qt { width:55px; } div#enquiry th#rm { width:55px; } div#enquiry td.img{ width:55px; } div#enquiry a { color:#2696E5; } div#enquiry input.quantity { width:40px; border:#2696E5 1px solid; color:#2696E5; font-size:11px; } div#enquiry input.submit { float:left; display:block; border:#FFFFFF 1px solid; color:#FFFFFF; background:#2696E5; padding: 2px 0; width:65px; margin: 0 5px 5px 0; font-size:11px; } div#enquiry a.submit { float:right; display:block; text-align:center; border:#FFFFFF 1px solid; color:#FFFFFF; background:#2696E5; padding: 4px 0 3px 0; width:63px; margin: 0 10px 5px 0; font-size:11px; text-decoration:none; } div#enquiry a.submit:hover { text-decoration:none; background:#AbB816; border:#AbB816 1px solid; } div#enquiry input.submit:hover { text-decoration:none; background:#AbB816; border:#AbB816 1px solid; } div#enquiry a.continue-link { } /* Empty basket message */ div.info { width:480px; margin:0; padding: 0; } div.info h3{ width:480px; padding:5px font-weight:normal; margin:0; padding: 0; height:17px; } div.info p { display:none; } /** * Enquiry Form */ span.form-step{ display:none; } div#enquiry li { font-size:12px; display:block; width:500px; margin-bottom:5px; float: left; } div#enquiry label { float:left; background:#FFFFFF; color:#2696E5; width:102px; padding:5px 4px 3px 4px; margin: 0 4px 4px 0; display:block; } div#enquiry input { font-family: Helvetica, Verdana, Arial, sans-serif;font-size:11px; border:#C7EDF9 1px solid; width:372px; padding:3px 4px 3px 4px; margin:0; color:#C7EDF9; background:transparent; } div#enquiry textarea { font-family: Helvetica, Verdana, Arial, sans-serif;font-size:11px; border:#C7EDF9 1px solid; width:372px; height:100px; padding:3px 4px 3px 4px; margin:0 0 10px 0; color:#C7EDF9; background:transparent; } div#enquiry input.submit { float:left; display:block; border:#FFFFFF 1px solid; color:#FFFFFF; background:#2696E5; padding: 2px 0; width:65px; margin: 0 5px 5px 0; font-size:11px; } div#enquiry input.submit:hover { text-decoration:none; background:#AbB816; border:#AbB816 1px solid; } div#enquiry a.back-to-basket { float:left; display:block; width:150px; text-align:center; border:#C7EDF9 1px solid; color:#FFFFFF; background:#2696E5; padding: 0px 0 4px 0; height:16px; margin: 0 10px 0px 114px; font-size:11px; text-decoration:none; } div#enquiry a.back-to-basket:hover { text-decoration:none; background:#AbB816; border:#AbB816 1px solid; } p.success { color:#abb816; margin-bottom:5px; margin-top:18px; display:block; font-weight: bold; font-size: 16px; } p.success a { color:#76CAF2; text-decoration:underline; } div.body h3 { font-size:12px; _font-size:11px; font-weight:normal; margin-bottom:10px; color:#C7EDF9;} div.back a { color:#76CAF2; text-decoration:underline; } div.error { color:#FFFFFF; margin:3px; } #header { position: relative; } #header h1 { margin: 16px 0; float: left; } #header { padding-bottom: 16px; } #inner-wrapper { /* this wraps the main content blocks, useful with float clearing methods for background images etc */ overflow: hidden; padding: 0; } #primary { float: left; width: 100%; margin: 0; padding: 0; } #primary .content { margin: 0 /*22%*/; min-height: 600px; padding: 0; overflow: visible; position: relative; } #primary .inner-content { padding: 1px 0px 3000px; margin: -1px 0 -3000px; } #secondary { float: left; width: 22%; margin: 0 0 -16px -22%; display: none;} #tertiary { float: left; width: 22%; margin: 0 0 -16px -100%; display: none;} #footer { margin: 0; clear: both; font-size: small; position: relative; } #footer .content { } .content { overflow: hidden; } .inner-content { /* a generic helper wrapper inside each main content block, best used in the context of its parent eg. #primary .content {} */ margin: 0 ; /* using margin means we can apply 100% width to boxes inside without layout breaking */ } /* Boxes - specific section styling ------------------------------------------------------------------------------------*/ /* =box */ .box { /* set basic styles for all .box sections, then over-ride as necessary */ } #sub-pages, #footer .content { } #top-search { } .box .tl, .box .tr, .box .bl, .box .br { } #footer .ctl, #footer .ctr, #footer .cbl, #footer .cbr, #sub-pages .tl, #sub-pages .tr, #sub-pages .bl, #sub-pages .br { } #top-search .tl, #top-search .tr, #top-search .bl, #top-search .br { } #sub-pages .tl, #sub-pages .tr, #sub-pages .bl, #sub-pages .br, #footer .ctl, #footer .ctr, #footer .cbl, #footer .cbr, #top-search .tl, #top-search .tr, #top-search .bl, #top-search .br { background-repeat: no-repeat; position: relative; z-index: 4; } .box, #sub-pages { /* this is a set of classes for easiest possible creation of fluid content boxes around the various site elements. Can be made specific to the area of the site eg. #header .box1, #primary .box1 */ padding: 0; margin: 0 0 16px 0; } .tl, #sub-pages .tl, #footer .ctl, .ltl { background-position: left top; } .tr, #sub-pages .tr, #footer .ctr, .ltr { background-position: right top; } .bl, #sub-pages .bl, #footer .cbl, .lbl { clear: both; background-position: left bottom; } .br, #sub-pages .br, #footer .cbr, .lbr { background-position: right bottom; } .inner-box, #footer .inner-content { } #footer .content { overflow: visible; } #top-search .inner-box { margin: -8px 0; } #top-search form { position: relative; z-index: 8; } #sub-pages .inner-box { margin: -6px 0; } #footer .inner-content { } #footer .inner-content .box, #sub-pages ul { position: relative; z-index: 12; } /* stop p covering the list */ /* =links =box */ .ltl, .ltr, .lbl, .lbr { /* link border css */ background-repeat: no-repeat; background-image: url(/templates/blank/lib/white-border.png); position: relative; z-index: 6; } /* =links =sidebar =box */ .sidebar .link-box { position: relative; z-index: 4; } .ltl { position: absolute; top: 0; left: 0; width: 100%; } .lbl { position: absolute; bottom: 0; left: 0; width: 100%; } /* =primary =box */ .primary .box, .primary .inner-box { background: none; padding: 0; margin: 0; border: 0; } .primary .tl, .primary .tr, .primary .bl, .primary .br { background: none; padding: 0; margin: 0; } .primary .box { margin: 0.81em 0; } #footer .box, #footer .inner-box, #footer .box .tr, #footer .box .tl, #footer .box .bl, #footer .box .br { background: none; padding: 0; margin: 0; } /* =table (tables that ARE NOT user submitted content via FCKin editor */ .nc { border: 1px solid #aaa; border-width: 0; width: 99.8%; margin: 0.81em 0; font-size: small; } .nc td, .nc th { font-size: small; padding: 2px 3px; margin: 0; line-height: 1.205em; vertical-align: middle; } .nc th { font-weight: bold; text-align: left; } .nc thead th { color: #393a3d; font-size: 1.1em; font-weight: bold; border-bottom: 1px dotted #aaa; } .nc tfoot th, .nc tfoot td { border-top: 1px solid #aaa; font-size: 1.1em; font-weight: bold; line-height: 1.62em; } .nc tfoot td { border-top-style: dotted; } .nc tbody td { padding: 8px 3px; } .nc .tac { text-align: center; } .nc .tar { text-align: right; padding-right: 6px; } .nc .tal { text-align: left; } .nc .odd { background: #eee; } .nc .even { background: #f9f9f9; } /* =basket =steps */ .steps { padding: 0.81em 0; text-align: center; } .steps * { display: inline; margin: 0 8px; background: none; border: 0; padding: 0; } .steps input, .steps span, .steps a:link, .steps a:visited, .steps a:hover, .steps a:active { color: #393a3d; text-decoration: none; border-bottom: 1px solid #343833; } .steps a, .steps span { padding: 1px 3px; } .steps input { cursor: pointer; } .steps input:hover, .steps a:hover { border-color: #999; } .steps .current, div#enquiry div.steps a { border: 1px solid #999; background: #2696e5; padding: 3px; color: #C7EDF9;} form.datamate #backtoproducts { display: none; } /* =basket */ #primary .basket fieldset { margin: 0; padding: 0; position: relative; } .basket .nc { margin: 1.62em 0; } .basket #pd { width: 50%; } .basket #rm { width: 12%; } .basket td.pd p { margin: 2px 0; } #primary .basket td.img { width: 54px; padding: 3px; } .basket input.submit { margin: 0; } #primary .basket fieldset.submit { position: relative; padding: 16px 0; } .basket fieldset.submit a, .basket fieldset.submit input { margin: 0 8px; } .basket table img { border: 1px solid #aaa; margin: 0; padding: 2px; background: #fff; } .tac input { text-align: center; } .quantity { width: 2.8em; text-align: center; } #tt { color: #000; } .tot { color: #36f; border-bottom: 1px solid #000; } /* =.extras (additional cost info) */ #wrapper #primary .extras { color: #555; font-size: x-small; } #wrapper #primary .extras li { list-style: disc outside; margin-left: 14px; padding: 0; border: 0; overflow: visible; display:none; } /* =nav =back */ .back, fieldset.submit { clear: both; line-height: 1.62em; padding: 0.81em 0; font-size: small; text-align: center; margin-bottom: 1.82em; } .back { color: #fff; } /* =news */ #news { background: none; font-size: small; } #news * { background: none; color: #fff; } #news .inner-box { padding: 0; } #news li { padding: 0.5em 0; overflow: hidden; } #news h3 a { padding: 0 0 0.2em; font-weight: bold; font-size: 12px; display: block; } #news img { float: left; margin: .81em 12px 0.2em 0; } #news p.more { margin-bottom: 0; } #news p.more a { color: #2696E5; padding-left: 20px; } #news p.strapline { display: none; } #news .pagination p { width: 200px; float: left; } #news div.date { font-weight: bold; font-size: 12px; font-style: normal; width: 80px; float: left; } #news div.pagination { padding: 0; } #news div.pagination p strong { color: #2696E5; } #news .pagination .next { padding: 0; } #news .pagination .next a { font-weight: bold; } #news .pagination .prev { padding: 0; } #news .pagination .prev a { font-weight: bold; } #news .body { display: none; } #news h3 { margin: 0; float: left; } #newsimage { position: absolute; left: 450px;} body.page.latest-news #breadcrumbs { display: none; } body.page #breadcrumbs { display: none; } body.page.latest-news #primary { min-height: 300px; } /* =links =top */ #top-links { position: absolute; top: 275px; left: 0; text-align: right; background: none; } #top-links * { background: none; } #top-links .tr { padding: 0 0 12px; } #top-links li { display: inline; } #top-links a { font-size: 12px; color: #E368A7; padding-right:35px; } /* leave room for background image */ #top-links a:hover { color:#FFFFFF; text-decoration: none; } /* =links =tabs */ #tab-links div { background: none; padding: 0; margin: 0; } #tab-links { background: none; clear: both; padding: 0 0 0.81em 0; margin: 0; } #tab-links li { display: inline; line-height: 1.62em; } #tab-links a { padding: 0.81em 16px; white-space: nowrap; } /* =nav =breadcrumbs */ #breadcrumbs { display: none; } #primary #breadcrumbs a { color: #76CAF2; font-size: 12px; text-transform: lowercase;} #primary #breadcrumbs { background: none; margin-top: 0; color: #76CAF2; } #backlink a { font-size: 12px; color:#fff; } /* =nav =subcats */ #sub-categories { font-size: small; } /* these may have an associated image */ #sub-categories li { width: 150px; min-height: 150px; display: -moz-inline-stack; display: inline-block; vertical-align: top; margin: 5px; zoom: 1; *display: inline; _height: 150px; } #sub-categories a img { padding: 4px; border: 1px solid #999; background: #fff; vertical-align: middle; width: 100px; height: 100px; margin-left: 20px;} #sub-categories li span { display:block; font-size:14px; font-weight:600; height:40px; overflow:hidden; padding:5px 0 2px; white-space:normal; text-align: center; color: #fff;} /* =nav =subpages */ #sub-pages { font-size: small; text-align: center; } #sub-pages ul { padding: 0; margin: 0; } #sub-pages li { display: inline; padding: 0; margin: 0 8px; line-height: 1.41em; } #sub-pages li li { display: none; } #sub-pages a { padding: 0.2em; white-space: nowrap; } /* =sidebar =nav */ .sidebar ul, #login ul { list-style: disc outside; } .sidebar li, #login ul li { margin-left: 14px; font-size: small; clear: both; color: #343833; padding: 0.1em 0; } .sidebar a, #login ul a { padding: 0; display: block; width: 100%; } /* =links */ .links { background: none; } .links .tl, .links .bl, .links .tr, .links .br { background: none; margin: 0; padding: 0; } .links .inner-box { margin: 0; padding: 0; background: none; } .links ul { list-style: none; margin: 0; padding: 0px 0; } .links li { margin: 0; padding: 0; width: 100%; position: relative; } .links img { display: block; margin: 0; width: 100%; } .links a.link { /* use the .link class if just image and text. HTML box has .body styling */ font-size: small; text-align: center; display: block; line-height: 1.2em; overflow: hidden; } .links .description { background: #e8e7ed; color: #000; padding: 0.6em 8px; display: block; margin: 0; } /* =links =bestsellers */ #primary .links { text-align: center; } #primary .links li { float: left; width: 30%; } /* 3 column list */ #primary .links li.a { clear: both; display: block; cursor: pointer; margin-right: 5%; } #primary .links li.c { float: right; margin-right: 0; } #primary .links img { width: 100%; } #primary .links .image { display: block; width: 100%; height: 14em; overflow: hidden; } /* =nav =site-map */ #site-map { background: none; } #site-map * { background: none; } #site-map ul ul { list-style: disc outside; } #site-map li { margin-left: 14px; font-weight: bold; clear: both; color: #ccc; padding: 0.25em 0; } #site-map a { font-weight: bold; } #site-map li li { font-weight: normal; font-size: small; } #site-map li li a { padding: 0; font-weight: normal; width: 100%; line-height: 1.2em; } /* =gallery */ #user-gallery { width: 100%; } #user-gallery form { clear: both; } #user-gallery form label { display: block; padding: 0.2em 0; } #user-gallery form label span.desc { float: left; width: 10em; padding: 0.35em 0; line-height: 1.2em; } #user-gallery ul.galleries { overflow: hidden; list-style: none; margin: 0; padding: 16px 0; clear: both; } #user-gallery ul.galleries li { overflow: hidden; } #user-gallery ul.galleries .image { display: block; float: left; width: 30.8%; min-width: ; text-align: center; font-size: small; padding: 6px 0; margin: 0 1% 12px; border: 1px solid #ccc; } #user-gallery ul.galleries .image-link { display: block; height: 140px; max-width: 140px; width: 140px; margin: 0 auto 6px; } #user-gallery ul.galleries .image img { display: block; width: 95%; margin: auto; } #user-gallery .single-image { width: 100%; overflow: hidden; } #user-gallery .single-image img { width: auto; max-width: 100%; } #user-gallery .a { clear: left; } /* =meta */ #footer #meta { float: left; position: relative; z-index: 20; display: none; } #meta p { margin: 0; padding: 0; line-height: 1.2em; } /* =links =bottom */ #footer #bottom-links { text-align: left; float: left; margin: 0; overflow: visible; z-index: 20; width:100%; } #footer #bottom-links li { display: inline; } #footer #bottom-links a { padding-right:40px; line-height: 1.2em; color: #E368A7; font-size: 12px; } #footer #bottom-links a:hover { color: #FFFFFF; text-decoration:none; } /* =nav =back-to-top */ #back-to-top { position: absolute; height: 12px; width: 32px; top: -14px; left: 50%; margin-left: -16px; font-size: x-small; text-align: center; z-index: 10; display: none; } #back-to-top a { display: block; background: url(/templates/blank/lib/back-to-top.png) no-repeat center; height: 12px; width: 32px; overflow: hidden; text-indent: -9999px; } /* =location - this class is applied to the containing

around any link that matches the current location */ .location a, .location .location a { font-weight: bold; } .location ul a { font-weight: normal; } /* =basket =mini */ .mini-basket { font-size: small; } .mini-basket li { list-style: none; margin-left: 0; color: #000; } .mini-basket .checkout-link { display: block; text-align: center; } /* =sidebar =news */ #latest-news { font-size: small; } /* news box on home page, contains a list of the most recent 6 articles */ #latest-news h4 a { line-height: 1.21em; font-weight: bold; font-variant: small-caps; margin-bottom: 0.4em; } #latest-news ol { margin: 0; padding: 0; } #latest-news li { margin: 0.81em 0 0.6em; padding: 0 0 0.6em; border-bottom: 1px dotted #393a3d; overflow: hidden; } #latest-news p { color: #000; line-height: 1.4em; margin: 0.2em 0; color: #000; } #latest-news img { margin: 0 6px 0 0; } /* =form */ form { font-size: small; } .primary fieldset { padding: 0.81em 0; } .primary legend { font-weight: bold; font-size: normal; padding: 0.4em 0.4em 0.4em 0; color: #36f;display: none; } .primary form h3 { font-weight: bold; font-size: normal; padding: 0.4em 0.3em; } .primary fieldset p { margin-top: 0; } .primary fieldset ol { margin: 0 0 2em; } .primary fieldset li { float:left; width: 100%; padding-bottom: 5px; } .primary form li label { float: left; width: 10em; padding: 0.2em 0 0; line-height: 1.2em; } .primary fieldset p { margin: 0.4em; } .primary form li.required em { color: #c00; position: absolute; left: 10.2em; top: 1em; } .primary form li input, .primary form li select, .primary form li textarea { margin-left: 1em; vertical-align: bottom; } .primary form li textarea { width: 23em; line-height: 1.4em; padding: 0.2em 2px; } #wrapper .currency input { width: 6em; margin-right: 4px; vertical-align: middle; padding-top: 2px; } /* use #id overrides */ #wrapper .currency select { margin-left: 0; vertical-align: middle; } form .text input, form .Text input, form .number input, form .Number input, form .URL input, form .Postcode input, form .Email input, form .email input, form.email-address, form .readonly input, form .password input, form .select input { } form .readonly input { background: #fff; border: 1px solid #fff; color: #393a3d; } form li.checkbox input, form li.Checkbox input { margin: 0.35em 0 0.35em 1em; } /* capital letters because of the datamate form write out */ form li.nolabel select { margin-left: 0; width: 70%; } .amount input, input.qty { width: 2.4em; } li.checkbox input { vertical-align: middle; } option { padding: 0em 0.2em 0em 0.4em; } li.file fieldset { padding: 0 0 0.6em 0; margin: 0; border: 0; } li.file fieldset legend { padding: 0; margin-bottom: 0.6em; } li.file fieldset img { float: left; margin-right: 10px; border: 1px solid #ccc; } li.file fieldset label { width: auto; display: block; overflow: hidden; padding: 0 0; } li.file fieldset span.desc { float: left; width: 9em; padding: 0; line-height: 1.2em; } .sidebar form .text input, .sidebar form .password input, .sidebar form .email input { padding-left: 0; padding-right: 0; } #wrapper .small { vertical-align: middle; } #wrapper .small, #wrapper .small fieldset { display: inline; padding: 0; margin: 0; border: 0; } fieldset.submit { text-align: center; } fieldset.submit input, fieldset.submit a { vertical-align: middle; } #wrapper form li.active { background: #ffc; } #technologo-image fieldset { border: 0; margin: 0; padding: 0 0 10px; } fieldset.group { border: 0; } fieldset.group legend { display: block; color: #333; font-weight: normal; } #wrapper fieldset.group label { display: block; float: none; width: auto; margin-left: 11em; } #wrapper fieldset.group input { margin: 0; } /* =product */ #product .image { float: right; border: 1px solid #ccc; padding: 4px; background: #fff; width: 250px; height: 250px; position: relative; margin-left: 16px; } #product .image img { position: absolute; width: 250px; height: 250px; top: 4px; left: 4px; } #product .item-info { width: 100%; margin: 0.81em 0; } #product .item-info th { border-bottom: 1px solid #c8dbbf; padding: 3px 6px 3px 0; } #product .item-info td { border-bottom: 1px dotted #c8dbbf; padding: 3px 0 3px 6px; } #product .discounts { } #product .small { display: block; clear: both; margin: 0.81em 0; } #product .small fieldset { display: block; } #product .favourites { margin-left: 4px; } #product .basket .submit { clear: left; } .product-variations { text-align: left; } #product .basket { float: left; clear:none;} #product .basket h3 { margin: 0; padding-left: 0; display: none; } #product .basket label {float:left; display: block; padding: 4px 0; clear: both; overflow: visible; } #product .basket span.desc { display: block; width: 3em; float: left; } #product .basket label span.info-link { display: none; } #product .basket label span.info-link acronym { display: none; } #product .basket label span.info-link span { display: block; background: #ffc; border: 1px solid #ccc; padding: 6px; } #product .basket label input { width: 5em; text-align: left; } #product .basket label select { width: 15.4em; } #product .results { float:left; padding: 0px 4px; line-height: 1.2em; } #product .results .calculate, #product .results table { float: left; margin-right: 16px; } #product .results table th, #product .results table td { padding-right: 16px; } #product .results strong { color: #c00; } #upsell { border: 1px solid #ccc; border-width: 3px 0; clear: both; margin: 10px 0 16px; } .pdv-body { margin-top: 20px !important; } .colour-swatches { overflow: hidden; margin: 10px 0; } .colour-swatches .swatch { float: left; display: block; margin: 0 4px 4px 0; } .colour-swatches .swatch-colour { float: left; display: block; width: 30px; height: 30px; margin: 0 4px 0 0; -moz-border-radius: 6px; -webkit-border-radius: 6px; } .colour-swatches .swatch-name { display: block; line-height: 30px; } #product #decorations { clear: both; } #product #decorations h4 { padding: 5px 0; margin: 0; } #product #decorations .dec-box { border: 1px solid #ccc; margin: 10px 0; clear: both; } #product #decorations .dec-box h5 { background: #eee; padding: 5px; } #product #decorations .dec-box .dec-controls { padding: 5px; text-align: right; background: #f9f9f9; } #product #decorations legend { } #product #decorations input { width: auto; display: inline; } #product #decorations li li { margin: 0; padding: 0; } #product #decorations fieldset { font-size: 1em; margin: 0; padding: 0 5px 5px; border: 1px dotted #ccc; border-width: 0 0 1px 0; clear: both; } #product #decorations fieldset legend { font-weight: normal; } #product #decorations fieldset fieldset { background: #f7f7ff; margin-bottom: 5px; border-width: 1px; } #product #decorations ul { border-top: 1px dotted #ccc; margin: 0; padding: 0; list-style: none; } #product #decorations ul ul { border-top: 0; } #product #decorations .radios { overflow: hidden; padding: 0; } #product #decorations .radios li { float: left; border: 0; padding: 0 0 5px; white-space: nowrap; } #product #decorations li input { margin-left: 0; vertical-align: text-bottom; } #product #decorations .radios li label { float: none; width: auto; display: inline; padding: 0 16px 0 0; margin: 0; cursor: pointer; } #product #decorations li.selected { background: #f3f3ff; } #product #decorations li.selected .selected { background: none; } /* =addresses */ #addresses .address-list { border-top: 1px dotted #ccc; } #addresses .address-list li { float: left; width: 100%; padding: 0.4em 0; border-bottom: 1px dotted #ccc; } #addresses .address-list .options { float: right; clear: right; width: 30%; padding: 4px; border-left: 1px solid #eee; margin: 0; height: 3.6em; } #addresses .address-list .options fieldset { border: 0; padding: 0 0 6px 4px; margin: 0 0 4px; border-bottom: 1px dotted #ccc; } #addresses .address-list .options label { padding: 0; display: inline; float: none; margin-right: 8px; } #addresses .address-list .options input { margin: 0; vertical-align: top; } #addresses .address-list .options a { margin: 0 8px 0 4px; } #addresses .address-list .adr { font-size: small; line-height: 1.21em; text-align: left; float: left; width: 60%; padding: 0.4em 16px 0.4em 16px; } /* =orders */ #my-orders fieldset { border: 0; text-align: center; } #my-orders label { margin: 0 2px; } #past-order-filter label { margin-right: 16px; } #past-order-filter .submit { vertical-align: middle; } /* =logos */ #logos { text-align: center;background: none; } #logos div { background: none; } /* =users */ #my-users form h3 { padding-left: 0; padding-right: 0; } #my-users form input.submit { padding: 0; width: auto; } /* =sidebar =form */ .sidebar fieldset ol { margin: 0.4em 0; padding: 0; } .sidebar fieldset li { margin: 0; padding: 0.2em 0; } .sidebar li.text input { width: 98%; margin-top: 4px; } .sidebar li label { color: #000; } .sidebar fieldset.submit { text-align: center; margin-bottom: 0.4em; } .sidebar input.submit { margin: 0 auto; } /* =sidebar =login */ .sidebar #login fieldset.submit { float: right; width: auto; margin-top: -2.35em; padding: 0; border: 0; } .sidebar #login ul { clear: both; } .sidebar #login #pwd { margin-bottom: 0.3em; } .sidebar #login .checkbox input { margin-left: 0; margin-top: 0.18em; } /* =msg */ .msg { } .primary p.msg { margin: 0.4em 0; } .msg h3 { margin: 0 0 0.2em 0; } .msg p { margin: 0.2em 0 0; } .info { color:#C7EDF9; font-size:13px; margin:10px 0 5px; } .error { } .success { } .warning { } /* =top =search */ #top-search { clear: both; margin: 0; } #top-search .inner-box { margin: -8px 4px; } #top-search form fieldset { text-align: center; margin: 0; padding: 0; } #top-search form * { font-size: small; } #top-search form input { vertical-align: bottom; } #top-search form select { vertical-align: baseline; } #top-search form input.submit { margin-left: 0; vertical-align: baseline; } /* =product-list */ .product-list { width: 100%; } .product-list ol { list-style: none outside; clear: both; } .product-list ol li { position: relative; padding: 16px 16px 16px 140px; font-size:small; min-height: 109px; background: #eee; } .product-list ol li.even { background: #f6f6f6; } .product-list ol h3 a { font-weight: bold; text-decoration: none; } .product-list ol .pid { font-weight: normal; color: #aaa; font-size: small; } .product-list ol li img { position: absolute; top: 16px; left: 16px; margin: 0 16px 0.4em 0; border: 1px solid #ccc; padding: 4px; background: #fff; } .product-list ol .options { overflow: hidden; padding-top: 0.81em; } .product-list ol .options input { margin-right: 8px; } .product-list ol .small { float: left; margin: 0; padding: 0; } .product-list ol .item-info { clear: both; border: 1px dotted #aaa; margin: 0; } .product-list ol .item-info th { width: 20%; } .product-list ol .item-info th, .product-list ol .item-info td { padding: 0.1em; } /* Actual product list .product-list h3 { padding: 8px 5px 4px; height: 35px; overflow: hidden; border-bottom: 1px solid #eee; font-weight: 600; font-size: 12px; color: #fff; } .product-list h3 a { display: block; color: #abb816; } .product-list h3 .pid { display: none; } .product-list ol { display: block; float: left; clear: both; width: 100%; } .product-list li { background: #fff; padding: 0; margin: 0 5px; margin-bottom: 10px; width: 172px; height: 305px; float: left; overflow: hidden; text-align: center; border: 1px solid #ccc; } .product-list li.odd { } .product-list li.even { } .product-list li .image { padding: 10px; } .product-list li .body { padding: 0 8px; width: auto; height: 65px; overflow: hidden; }*/ .product-list ol { float: left; margin: 0; padding: 0; width: 960px; list-style: none; margin-left: 30px; } .product-list ol li { display: block; float: left; width: 183px; height: 355px; margin: 0 20px 10px 20px; background: #FFF url(http://outstandingbranding.com/promoserve/images/no-product.gif) 0 44px no-repeat; font-size: 12px; _font-size: 11px; overflow: hidden; padding: 0; border: 1px solid #ccc; } div#product-list.box { background: #fff; } .product-list h3 { position: absolute; width: 173px; height: 35px; color: #2696E5; padding: 5px 5px 0 5px; border-bottom: 5px solid #2696E5; font-size: 12px; text-align: center; } .product-list a { color:#2696E5; text-decoration:underline; font-weight:normal; } .product-list .pagination a { color: #666666; } .product-list a:hover { color:#AbB816; } .product-list img.image { position:absolute; width:100px; height:100px; margin-top:44px; padding:32px 41px 33px 42px; background:#FFF; top:0; left:0; border: none; } .product-list div.body { position:relative; top:209px; left:0; padding:5px; height:70px; line-height:14px; color:#808080; overflow:hidden; zoom:1; text-align: center; } .product-list p.price-box { position:relative; top:209px; padding:5px; width:173px; height:37px; color:#808080; margin:0; text-transform:lowercase; text-align: center; } .product-list div.options { display:none; } .product-list p.price-box div { margin-top:5px; display: none; } .product-list span.right { display:block; float:right; text-align:right; } .product-list span.left { display:block; float:left; } .product-list span.pid { display:none; } .product-list span.price{ color:#2696E5; } /* Product options */ .product-list .options { display: none; } /* Add to enquiry/basket/favourites buttons */ .product-list .options .enquiry { } .product-list .options .basket { } .product-list .options .favourites { } /* Moved to account for '1' or 'each' text next to it */ .product-list p.price-box { margin: 5px 0 0; padding: 5px 5px 2px; height: 20px; text-transform: lowercase; background: #fdfdfd; border-top: 1px solid #eee; } .product-list p.price-box em { padding-right: 5px; } .product-list p.price-box span.price { font-weight: bold; color: #abb816; } #a-z-list h3 { background: #eee; padding: 6px; } #a-z-list ul { width: 24.9%; float: left; } #a-z-list a { display: block; } /* Basic element styles (low level stuff) ---------------------------------------------------------------------------------------*/ h1 { font-size: 2em; } h2, #primary h1 { font-size: x-large; font-weight: normal; margin: 0 0 0.4em; border-bottom: 1px solid #ccc; padding: 0 0 0.2em; line-height: 0.81em; color: #000; } h3 { font-size: medium; font-weight: bold; ; margin: 0 0 0.4em; } h4 { font-size: small; font-weight: bold; } /* may want some alternate styling in sidebars or on .tertiary, .secondary, #basket etc... */ .sidebar h3 { margin: 0; padding: 0 0 0.4em; border-bottom: 1px dotted #393a3d; } div.date { margin-bottom: 0.2em; font-size: x-small; color: #76CAF2; font-style: italic; } .pid { font-weight: normal; color: #aaa; font-size: small; } /* product id span */ .price { color: #36f; } /* price display (not always a span) */ .sidebar .price { color: #36f; } .pagination { font-size: small; overflow: hidden; padding: 5px 10px; vertical-align: bottom; } .pagination p { } .pagination .per-page a { } .pagination .per-page { float: left; line-height: normal; color: #666666;} .pagination .next { float: left; padding-left: 40px; } .pagination .prev { float: left; } dl { overflow: hidden; font-size: small; border-bottom: 1px dotted #ddd; margin: 1.62em 0; } dl dt { float: left; width: 10em; padding: 0.4em 0; border-top: 1px dotted #ddd; clear: left; line-height: 1.2em; } dl dd { margin-left: 10em; padding: 0.4em; border-top: 1px dotted #ddd; line-height: 1.2em; } .adr { font-size: small; line-height: 0.8em; } .logged-in-as { font-size: x-small; float: right; margin-top: 4em; text-align: right; color: #ccc; display: none; } a { text-decoration: none; } a:link { } a:visited { } a:hover { } a:active { color: #E368A7; } p.line-shipping { color: #666; } caption { font-weight: bold; text-align: left; padding: 16px 4px 0; text-transform: uppercase; text-decoration: underline; } .add-costs-info { border: 1px solid #ccc; } .add-costs-info th { background: #eee; } /* .body encompasses the output from FCK Editor, try to avoid styling the colors etc as it's meant to be WYSIWYG and customers complain otherwise. They'll complain anyway coz they put tables in and it can break the layout but there's only so much you can do. Refer everyone to the documentation for guidelines on using FCK Editor to the best effect. */ .body { font-size: small; margin-top: 15px; } /* container for FCK Editor output */ p, .body ol, .body ul, .primary ul, .body blockquote, .body dl, .body table { margin: 0 0 0.81em 0; font-size: 12px;} .body ol { list-style: decimal outside; margin-left: 32px; } .body ul { list-style: disc outside; margin-left: 32px; } .body li { line-height: 1.62em; } li { vertical-align: middle; } /* aligns bullet points in IE */ .body img { padding-left: 10px; } img.fl-l { float: left; clear: left; margin: 0 16px 0.81em 0; } img.fl-r { float: right; clear: right; margin: 0 0 0.81em 16px; } img.news-image { float: right; clear: right; margin: 0.4em 0 0.81em 16px; } .body blockquote { margin: 0.81em 80px 0.81em 20px; border: 1px solid #ccc; border-width: 1px 0; background: #393a3d; padding: 0.81em 16px; } small { font-size: small; } big { font-size: normal; font-weight: bold; } strong { font-weight: bold; } em { font-style: italic; } /* js stuff */ #quick-order label, #order-forms label { float: none; display: inline; margin: 0 22px; } #quick-order label input, #order-forms label input { margin: 0; } .details { margin: 12px; } .details h4 { margin-bottom: 4px; } .details dl { margin-top: 0; margin-bottom: 0; } #order-forms ul { clear: both; border-bottom: 1px dotted #ccc; } #order-forms ul li { margin: 0 0 16px; border-top: 1px dotted #ccc; } #order-forms .copy label, #order-forms .copy input { margin: 0; } #order-forms .copy { margin: 8px 0 16px; } /* 2 column product view layout stuff starts here */ #qo-2col { clear: both; float: left; width: 100%; margin: 0 0 12px; } #qo-2col .product-list { clear: both; float: left; width: 100%; list-style: none; margin: 0 0; padding: 12px 0; } #qo-2col .product-list li { float: left; width: 48%; padding: 14px 0; margin: 0 0 -1px 0; border: dotted ; border-color: #cccccc; border-width: 1px 0; font-size: 0.8em; overflow: visible; } #qo-2col .product-list>li { } #qo-2col .product-list li.odd { clear: both; } #qo-2col .product-list li.even { margin-left: 16px; /*float: right; clear: right;*/ } #qo-2col .product-list h3 { margin: 0 0 12px; padding: 0; line-height: 1em; } #qo-2col .product-list h3 a { float: none; } #qo-2col .product-list a { float: left; font-weight: bold; } /* the link surrounding the image */ #qo-2col .product-list a img { padding: 0; margin: 0 10px 0 0; } #qo-2col .product-list .excerpt { margin: 0 0 10px 0; color: #000000; height: 4em; } #qo-2col .product-list>.excerpt { height: auto; min-height: 4em; } #qo-2col .product-list .excerpt * { margin: 0; line-height: 0.8em; } #qo-2col .product-list a.more-info { float: none; display: block; font-weight: bold; color: #000; text-decoration: none; text-align: center; margin: 8px 0 10px; } #qo-2col .product-list a.more-info:hover { color: #000; text-decoration: none; } #qo-2col .product-list .item-info { text-align: center; overflow: hidden; margin-bottom: 6px; } #qo-2col .product-list .item-info * {display: inline; margin: 0; padding: 0; float: none; width: auto; border: 0;} #qo-2col .product-list .item-info dt { text-align: right; padding: 0 0 0 0px; } #qo-2col .product-list .item-info dd { text-align: left; padding: 0 12px 0 0; } #qo-2col .product-list .item-info .price { color: #ED1820;} /*price text color*/ #qo-2col .product-list .item-info .value { color: #ED1820; font-weight: bold; font-size: 110%; } #qo-2col .product-list .item-info .min-qty { color: #999; } /*min qty text color*/ #qo-2col .product-list .item-info .min-val { color: #999; } #qo-2col .product-list .item-info abbr { border-bottom: 0; text-decoration: none; } #qo-2col .product-list form { margin: 6px 0 0 6px; display: block; text-align: right; vertical-align: middle; float: right; } #qo-2col .product-list form * { vertical-align: middle; } #qo-2col .product-list form label { margin: 0 6px 0 0; } #qo-2col .product-list form>label { margin: 0; } #qo-2col .product-list form label abbr { } #qo-2col .product-list form label input { text-align: center; width: 3em; font-size: 0.8em; } #qo-2col .product-list form button { padding: 0 0 1px; margin: 0; line-height: 1em; } #qo-2col .product-list form button img { margin: 1px 1px 0; } #qo-2col .product-list form button { font-size: 0.8em; } /* l10n menu */ #wrapper .l10n { position: relative; z-index: 400; padding: 0; } #wrapper .l10n>a { border: 1px solid #fff; border-width: 1px 1px 0; padding: 1px 4px 1px; position: relative; z-index: 500; background: #fff; } #wrapper .l10n:hover>a { border-color: #aaa; text-decoration: underline; } #wrapper #header .l10n-opts-wrap { display: none; width: 160px; background: #fff; position: absolute; right: 0; top: 99%; z-index: 400; font-size: small; border: 1px solid #aaa; } #wrapper #header .l10n:hover .l10n-opts-wrap { display: block; overflow: hidden; } #wrapper #header .l10n:hover .l10n-opts-wrap ul { padding: 6px; } #wrapper #header .l10n .l10n-opts-wrap li { float: none; text-align: left; display: block; padding: 1px; margin: 0; } #wrapper #header .l10n .l10n-opts-wrap a { padding: 2px; display: block; margin: 0; } #wrapper #header .l10n .l10n-opts-wrap .current a { background: #ccc; color: #000; cursor: default; } #wrapper #header .l10n .l10n-opts-wrap a:hover { background: #eee; color: #000; } #kirzenchatvisitordiv4 { position: absolute; left: 440px; top: 2px; } #viewbasketbutton { width: 103px; height: 20px; position: absolute; margin-left: 180px; margin-top: -9px;} #backtoproducts { width: 118px; height: 22px; position: absolute; left: 140px; } #backtoproducts a { margin: 0; } body.page.search #header #kirzenchatvisitordiv2 { display:none; } body.page.enquiry-basket p.success a { display:none; } body.page.enquiry-basket div.back a { display:none; } body.home #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-pink-small.png") no-repeat bottom left; } body.page.contact-outstanding-branding #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-purple-small.png") no-repeat bottom left; } body.page.search #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-blue-small.png") no-repeat bottom left; } body.page.outstanding-branding-offers #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-brown-small.png") no-repeat bottom left; } body.page.testimonials #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-green-small.png") no-repeat bottom left; } body.page.latest-news #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-green-small.png") no-repeat bottom left; } body.page.enquiry-basket #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-blue-small.png") no-repeat bottom left; } body.page.about-us #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-brown-small.png") no-repeat bottom left; } body.page.faq-s #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-green-small.png") no-repeat bottom left; } body.page.how-to-find-us #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-purple-small.png") no-repeat bottom left; } body.page.terms-conditions #footer #bottom-links { padding-bottom: 120px; background:url("/static/images/iso-blue-small.png") no-repeat bottom left; }