/* Font sizes all relative to the "body" tag below and by using "em" it means if the user increases the font size on the browser (DDA compliance) then the sizes increase on the site in proportion too. */ body { font-family: Arial; font-size: .80em; background-color: #ECECED;} body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, textarea, blockquote, th { margin:0; padding:0; } table {border-collapse: collapse;} #page {margin: 0 auto; width:974px; } /* Region: TOP MENU */ #regTopMenuBar { clear: both; background-color:white; color: #cccccc; height: 131px} #regTopMenuBar #reg1 { float: left; background-image: url(images/template/topbar_phone_bg.gif); background-repeat: no-repeat; width: 392px;} #regTopMenuBar #reg1 #regTel { float: left; width: 392px; height: 70px; padding: 5px 0px 0px 10px} #regTopMenuBar #reg1 #regLowPrices { float: left; width: 392px; height: 56px;background-image: url(images/template/topbar_login_bg.gif); background-repeat: repeat-x;} #regTopMenuBar #reg2 { float: left; background-image: url(images/template/topbar_KBS.gif); background-repeat: no-repeat;} #regTopMenuBar #reg3 { float: left; background-image: url(images/template/topbar_topnav_bg.gif); background-repeat: no-repeat; width: 392px;} #regTopMenuBar #reg3 #regForThePlayer { float: left; text-align: right; width: 380px; height: 67px; padding: 8px 0px 0px 0px; } #regTopMenuBar #reg3 #regForThePlayer .TopNav { padding-top: 6px;} #regTopMenuBar #reg3 #regForThePlayer .TopNav .Normal { float: right; padding-left: 8px; color: #000000; } #regTopMenuBar #reg3 #regForThePlayer .TopNav .Normal a { color: #000000; font-size: 0.9em; text-decoration: none;} #regTopMenuBar #reg3 #regForThePlayer .TopNav a:hover { text-decoration: underline;} #regTopMenuBar #reg3 #regForThePlayer .TopNav .Home { float: right; padding-left: 8px;} #regTopMenuBar #reg3 #regForThePlayer .TopNav .Home a { color: #FFFFFF; font-size: 0.9em; text-decoration: none;} #regTopMenuBar #reg3 #regMyAccount { float: left; width: 392px; height: 56px; background-image: url(images/template/topbar_login_bg.gif); background-repeat: repeat-x;} #regTopMenuBar #reg3 #regMyAccount .TopBarLow {} #regTopMenuBar #reg3 #regMyAccount .Normal { padding-top: 7px; float:left; padding-left: 8px; color: #000000; } #regTopMenuBar #reg3 #regMyAccount .Normal a { color: #FFFFFF; font-size: 0.85em; text-decoration: none;} #regTopMenuBar #reg3 #regMyAccount .Search { float: right; background-image: url(images/template/search_bg_yellow.png); background-repeat: no-repeat; margin-right: 10px; margin-top: 4px; padding-top: 1px; padding-left: 2px; height: 20px; width: 154px} #regTopMenuBar #reg3 #regMyAccount .Search .BasicSearch {width: 118px; border: 0px; height: 14px; background-color: transparent; font-size: 0.9em; font-weight: bold; color: #504E50} /* Region: FOOTER */ #regFooter {clear:both; font-size: .85em;color: #FFFFFF; padding: 8px 10px 6px 10px; background-image: url(images/template/footer_bg.gif); background-repeat: repeat-x; height: 18px;} #regFooter a {color: #FFFFFF; font-weight: normal; text-decoration: none;} #regFooter a:hover {text-decoration: underline;} #regFooter .Copyright { float: left; } #regFooter .MenuLinks { float: left; margin-left: 20px;color: #FFFFFF; } #regFooter .MenuLinks ul { display: inline; padding: 0px; margin: 0px;} #regFooter .MenuLinks ul li { display: inline; padding-left: 2px; padding-right:0px;} #regFooter .DesignedBy { float: right; } #regMainContent {clear:both; background-color: white;} #regFixHeights { clear: both;} /*If you want a background on regMainContent to span the height of regBodyContent this is necessary. */ #regLeftMenu {float: left; font-size: 1em; color: #44749D; width: 160px; margin-left: 5px; margin-bottom: 10px;} #regLeftMenu .SocialNetworking a { color: #333333; font-size: 0.9em;} #regLeftMenu #regSearch { color: #3C3C3C ; background-image: url(images/template/search_box_bg.gif); background-repeat: no-repeat; height: 171px; margin-bottom: 5px; padding: 5px 7px 5px 7px;} #regLeftMenu #regSearch .DescTop { font-weight: bold; font-size: 1.1em;} #regLeftMenu #regSearch .Desc { padding: 4px 0px 2px 0px; font-size: 0.85em;font-weight: bold; } #regLeftMenu #regSearch .Search {background-image: url(images/template/search_bg_white.png); background-repeat: no-repeat; margin-top: 7px; padding-top: 1px; padding-left: 2px; height: 20px; } #regLeftMenu .SaleItems {background-image: url(images/template/lm_bg_red.gif); background-repeat: no-repeat ; height: 20px; font-size: 1em; margin: 0px 0px 0px 0px; padding: 3px 0px 0px 8px; } #regLeftMenu .SaleItems A { color:#FFFFFF; font-weight: normal; text-decoration: none;} #regLeftMenu .SaleItems A:hover {text-decoration: underline;} #regLeftMenu .MenuItem {background-image: url(images/template/lm_bg_grey.gif); background-repeat: no-repeat ; height: 20px; font-size: 1em; margin: 0px 0px 0px 0px; padding: 3px 0px 0px 8px; } #regLeftMenu .MenuItem A { color:#FFFFFF; font-weight: normal; text-decoration: none;} #regLeftMenu .MenuItem A:hover {text-decoration: underline;} #regLeftMenu .subMenuItem { font-size: .8em; margin: 0px 0px 1px 0px; padding: 2px 4px 2px 8px; border-bottom: 1px solid #CBDAE6} #regLeftMenu .subMenuItem A { color:black; font-weight: normal; text-decoration: none; } #regLeftMenu .subMenuItem A:hover {text-decoration: underline; } /* Region: Right hand menu/column */ #regRightHandColumn {float: right; font-size: 1em; color: #3C3C3C; width: 160px;margin-right: 5px;} #regRightHandColumn .BasketHeader {background-image: url(images/template/basket_grey_bg.gif);font-weight: bold; background-repeat: no-repeat ; height: 24px; text-align: right; padding: 10px 10px 0px 0px} #regRightHandColumn .BasketTotal { height: 30px; background-color: #3C3C3C; color: #F6D411; font-weight: bold; font-size: 1.6em; padding: 5px 10px 0px 5px; text-align: right} #regRightHandColumn .BasketHeader .Icon { float: left; padding: 0px 0px 0px 8px;} #regRightHandColumn .BasketTotal .Total { font-size: 0.8em; color: #FFFFFF; float: left; font-weight: normal; padding: 5px 0px 0px 0px;} #regRightHandColumn .BasketButtons { height: 20px; background-color: #3C3C3C; color: #FFFFFF; padding: 0px 3px 3px 7px;} #regRightHandColumn .BasketButtons a { color: #FFFFFF; font-size: 0.8em; text-decoration: none;} #regRightHandColumn .BasketCards {background-image: url(images/template/panel_linegrey_bg.gif); background-repeat: repeat-y ; text-align: center; padding-top: 5px;} #regRightHandColumn .BasketCards a { color: #3C3C3C; font-size: 0.8em; text-decoration: none;} #regRightHandColumn .BasketFooter {background-image: url(images/template/panel_linegrey_btm.gif); background-repeat: no-repeat ; height: 9px} #regRightHandColumn #regRecentlyViewed { margin-top: 5px; margin-bottom: 8px;} #regRightHandColumn #regRecentlyViewed .RecentTop {background-image: url(images/template/panel_linegrey_top.gif); background-repeat: no-repeat ; height: 13px} #regRightHandColumn #regRecentlyViewed .RecentMiddle {background-image: url(images/template/panel_linegrey_bg.gif); background-repeat: repeat-y ; text-align: center; padding-top: 0px; padding-left: 5px; padding-right: 5px;} #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems {color: #3C3C3C; text-decoration: none; font-weight: bold; font-family: Arial; font-size: 1.3em;} #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems img { border: 0px;} #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems a { text-decoration: none; color: #3C3C3C; font-family: Arial; font-size: 11px; font-weight: bold;} #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems a:hover { text-decoration: underline;} #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems .recentItem { clear: both; padding: 5px; margin-top: 5px; border-bottom: 1px dotted #CCCCCC; } #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems .Button { float: right; padding: 5px;} #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems .recentItemImage { float: left; padding-top: 5px; width: 65px; height: 65px; text-align: center;} #regRightHandColumn #regRecentlyViewed .RecentMiddle #recentItems .recentItem .Button { text-align: right; padding: 5px;} #regRightHandColumn #regRecentlyViewed .RecentBottom {background-image: url(images/template/panel_linegrey_btm.gif); background-repeat: no-repeat ; height: 9px} /* Set main content width - if main content width should be 700, but there is 15 left and 15 right padding, then width should be set to 670... */ #regBodyContent {float: left; width: 625px; background-color: #FFFFFF; font-size: .85em; padding: 0px 0px 20px 0px; margin-left: 10px;} #regBodyContent h1 {margin-top: 0px; margin-left: 6px; margin-bottom: 0px; font-size: 1.8em; font-weight: bold; color: #000000} #regBodyContent h2 {margin-top: 8px; margin-bottom: 3px; font-size: 1.7em; font-weight: bold; color: #E81723;} #regBodyContent h3 {margin-top: 8px; margin-bottom: 3px; font-size: 1.6em; font-weight: bold; color: #000000;} #regBodyContent h4 {margin-top: 0px; padding-bottom: 10px; font-size: 1.3em; font-weight: bold; color: #E81723;} #regBodyContent a {text-decoration: underline; font-weight: bold; color: #E81723; } #regBodyContent #regProductImage { float: left; width: 300px; } #regBodyContent #regProductImage .Image {width: 300px;text-align: center; height: 300px; vertical-align: middle; font-size: 200px; display: table-cell;} #regBodyContent #regProductDescription { float: right; width: 289px;} #regBodyContent #regProductDescription #Top { background-image: url(images/template/shadowpanel2_header.gif); background-repeat: no-repeat; height: 13px;} #regBodyContent #regProductDescription #Middle { height: 260px; padding: 0px 10px 0px 15px; background-image: url(images/template/shadowpanel2_bg.gif); background-repeat: repeat-y; overflow: auto;} #regBodyContent #regProductDescription #Bottom { background-image: url(images/template/shadowpanel2_footer.gif); background-repeat: no-repeat; height: 13px;} #regBodyContent #regVariations { clear: both; padding-top: 12px;} #regBodyContent #regVariationsPurchase { float: left} #regBodyContent #regVariationsPurchase .dgHeader { background-color: #DEDFDE; color: #3C3C3C; font-weight: bold; font-size: 1em;} #regBodyContent #regVariationsPurchase .dgItem { border-bottom: 1px dotted #3C3C3C;} #regBodyContent #regPriceBeater{ float: right} #regBodyContent #regVariationsPurchase .UnavailableToPurchase { border: 2px solid Red; font-size: 1.3em; text-align: center; font-weight: bold; padding: 10px; margin-left: 110px;} #regBodyContent #regVariationsPurchase { font-size: 1.1em;} #regBodyContent #regVariationsPurchase .OurPrice { color: #E81723; font-size: 1.4em; font-weight: bold; font-family: Arial;} #regBodyContent #regVariationsPurchase .YouSave { color: #E81723; font-size: 1.1em; font-weight: bold; font-family: Arial;} #regBodyContent #regCategoryDescription #Top { background-image: url(images/template/shadowpanel_header.gif); background-repeat: no-repeat; height: 13px;} #regBodyContent #regCategoryDescription #Middle { font-size: 1.1em; padding: 0px 10px 0px 15px; background-image: url(images/template/shadowpanel_bg.gif); background-repeat: repeat-y;} #regBodyContent #regCategoryDescription #Bottom { background-image: url(images/template/shadowpanel_bg_footer.gif); background-repeat: no-repeat; height: 13px;} #regBodyContent #regSubCategory { width: 200px;} #regBodyContent #regSubCategory a { color: #3C3C3C; text-decoration: none; font-weight: bold; font-family: Arial; font-size: 1.6em;} #regBodyContent #regSubCategory a:hover { cursor: hand;} #regBodyContent #regSubCategory #SubCategoryTop { background-image: url(images/template/panel_3rd_top.gif); background-repeat: no-repeat; height: 9px;} #regBodyContent #regSubCategory #SubCategoryMiddle {height: 210px; padding: 0px 10px 0px 15px; background-image: url(images/template/panel_3rd_bg.gif); background-repeat: repeat-y; } #regBodyContent #regSubCategory #SubCategoryMiddle .SubCategoryDescription { height: 60px;padding: 0px 0px 5px 0px;} #regBodyContent #regSubCategory #SubCategoryMiddle .SubCategoryImage { height: 150px; line-height: 150px; vertical-align: middle; text-align: center; display: table-cell; width: 170px; clear: both;} #regBodyContent #regSubCategory #SubCategoryBottom { background-image: url(images/template/panel_3rd_btm.gif); background-repeat: no-repeat; height: 10px;} #regBodyContent .dlProducts { width: 200px; text-align: center;} #regBodyContent .dlProducts a { color: #000000; text-decoration: none;} #regBodyContent .dlProducts a:Hover {cursor: hand;} #regBodyContent .dlProducts .dlProductsTop { background-image: url(images/template/panel_3rd_top.gif); background-repeat: no-repeat; height: 9px;} #regBodyContent .dlProducts .dlProductsMiddle { height: 280px; padding: 0px 10px 0px 15px; background-image: url(images/template/panel_3rd_bg.gif); background-repeat: repeat-y;} #regBodyContent .dlProducts .dlProductsMiddle .ProductName { color: #3C3C3C; text-decoration: none; font-weight: bold; font-family: Arial; font-size: 1.2em; border: 0px} #regBodyContent .dlProducts .dlProductsMiddle .ProductName { height: 40px;} #regBodyContent .dlProducts .dlProductsMiddle .ProductName a:Hover { text-decoration: underline;} #regBodyContent .dlProducts .dlProductsMiddle .FreeGifts { height: 22px;color: Red;} #regBodyContent .dlProducts .dlProductsMiddle .FreeGifts a { color: Red;} #regBodyContent .dlProducts .dlProductsMiddle a.FreeGifts { color: Red;} #regBodyContent .dlProducts .dlProductsMiddle .Image { height: 140px; line-height: 140px; vertical-align: middle; display: table-cell; text-align: center; width: 170px; clear: both; padding-bottom: 5px;} #regBodyContent .dlProducts .dlProductsMiddle .SaleNew { height: 15px; float: left;} #regBodyContent .dlProducts .dlProductsMiddle .Prices {color: #000000; height: 50px; text-align: right; float: right;} #regBodyContent .dlProducts .dlProductsMiddle .Prices .MRPDetail { color: #3C3C3C; font-weight: normal} #regBodyContent .dlProducts .dlProductsMiddle .Prices .OurPrice { color: #E81723; font-size: 1.6em; font-weight: bold; font-family: Arial;} #regBodyContent .dlProducts .dlProductsMiddle .Prices .YouSave { color: #E81723; font-size: 1.2em; font-weight: bold; font-family: Arial;} #regBodyContent .dlProducts .dlProductsMiddle .Button { padding-top: 6px; clear: both; text-align: right;} #regBodyContent .dlProducts .dlProductsBottom { background-image: url(images/template/panel_3rd_btm.gif); background-repeat: no-repeat; height: 10px; clear: both;} #regBodyContent #recentItems {margin: 10px 5px 10px 5px;} #regBodyContent #recentItems .recentItem {float: left; padding: 5px; text-align: center;} /* add 'float: left' to have them across... */ #regBodyContent .MessageToUser {font-weight: bold; color: red; padding-top: 5px;} #regBodyContent .BreadCrumbTrail {font-weight: bold; margin-bottom: 5px; padding-top: 5px; } #regBodyContent .BreadCrumbTrail a {padding-left: 6px; padding-right: 6px; font-size: 1.1em} /*Highlight user searched text in the search engine */ #regBodyContent .highlight {text-decoration: none;color:black;background:yellow;} #regBodyContent .ImageBorder {border:1px solid #A1A0A3;} /* Page Numbering */ #regBodyContent .page_number_selected {font-weight: bold} #regBodyContent .page_number_unselected {font-weight: normal} #regBodyContent .Previous_Next_border{} #regBodyContent .NextDayDeliveryBold { color: Red; font-weight: bold; font-size: 1.1em; padding-bottom: 5px;} /* Shopping Cart */ #regBodyContent .shoppingcart_empty {font-weight: bold; color: green; text-align: left; margin: 10px 0px 10px 0px; text-align: center;} #regBodyContent .shoppingcart_button {border: 1px solid #1A258E; font-weight: bold; background-color: white; height: 18px; color: #2D4191} #regBodyContent .price {color:#8D4D7B; font-weight:bold; font-size:11px;} /* Payment */ #regBodyContent .payment_header { background-color: #DEDFDE; color: #3C3C3C; font-weight: bold; font-size: 1.2em; border-bottom: 2px solid #A1A0A3; margin-bottom: 15px; padding: 3px;} #regBodyContent .payment_item {font-weight: normal; font-size: 1.2em;} #regBodyContent .payment_item select { font-size: 0.95em;} #regBodyContent .payment_underline {border-bottom: 2px solid black} #regBodyContent .payment_totalprice {font-weight: bold; text-align: right; border-bottom: 2px solid black; font-size: 1.2em;} #regBodyContent .payment_discount {font-weight: bold; text-align: right; color: maroon; padding-right: 104px;} #regBodyContent .payment_deliveryprice {font-weight: bold; text-align: right; border-bottom: 1px solid black; font-size: 1.2em;} #regBodyContent .payment_vattotal {font-weight: bold; text-align: right; border-bottom: 1px solid black;} #regBodyContent .payment_overallprice {font-weight: bold; text-align: right; padding-top: 10px; font-size: 1.62em; border-bottom: 1px solid black;} #regBodyContent .Payment_Remove A {font-weight: bold; color: #000000; font-size: 11px; text-decoration: none;} #regBodyContent .Payment_Remove A:Hover { text-decoration: underline;} #regBodyContent input { font-size: 1em;} #regBodyContent select{ font-size: 1em;} /* Products image zoom... */ #lightbox{ background-color:#eee; padding: 10px; border-bottom: 2px solid #666; border-right: 2px solid #666; } #lightboxDetails{ font-size: 0.8em; padding-top: 0.4em; } #lightboxCaption{ float: left; } #keyboardMsg{ float: right; } #closeButton{ top: 5px; right: 5px; } #lightbox img{ border: none; clear: both;} #overlay img{ border: none; } #overlay{ background-image: url(js/lightbox/overlay.png); } * html #overlay{ background-color: #333; back\ground-color: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="js/lightbox/overlay.png", sizingMethod="scale"); } .ThumbnailPhoto { border: 0px solid #CCCCCC; font-size:55px; line-height: 90px; vertical-align: middle; width:90px; height:90px; margin-left: 3px; margin-right: 3px; margin-bottom: 5px; text-align: center;}