@import url("master.css");

/* ----- IDS ----- */
body { background: #191919 url("../templateimages/background-page.jpg") repeat-x; color: #4F4F4F; }
#page-wrapper { width: 960px; margin: 0 auto; background: #fff; }
#info-layer { margin-top: 2px; height: 35px; background: #335967; }
#main-content { float: right; width: 640px; margin: 20px 20px 0 0; }
#left-content { width: 260px; margin: 20px 0 0 20px; padding-bottom: 20px; }
#footer { width: 960px; margin: 0 auto; color: #4F4F4F; text-align: right; }

#mini-basket { position: relative; float: right; height: 111px; width: 285px; padding-left: 51px; background: #efefef url("../templateimages/background-mini-basket.gif") no-repeat; }
#baskethidden { padding-bottom: 15px; }
#home_region1 { width: 195px; height: 200px; margin-bottom: 1em; padding: 48px 15px 0 355px; color: #fff; background: url("../templateimages/js_bg_WELCOME.jpg") no-repeat; }
#home_region3 { padding-top: 1em; }
#home_region4 { clear: both; width: 455px; padding: 1em 185px 0 0; background: url("../templateimages/js_bg2_WELCOME.jpg") no-repeat top right; font-size: 1.1em; }
#newsitem2 { background: url("../templateimages/text-presentation-box.gif") no-repeat 0 5px; }
#newsitem3 { background: url("../templateimages/text-trade.gif") no-repeat 0 5px; }
#newsitem4 { width: 565px; height: 200px; padding: 1em 0; background: url("../templateimages/js_slateimage_WELCOME.jpg") no-repeat 0 1em; }

/* ----- CLASSES ----- */
.full #main-content { float: none; width: 920px; margin-left: 20px; }
.product-left { float: left; width: 250px; }
.product-right { float: right; width: 370px; }
.product-description { clear: both; margin: 0 0 1em 0; padding: 10px 10px 0; border: 3px solid #335967; }
.box-left, .box-right, .box-middle { float: left; margin-bottom: 10px; width: 275px; padding: 0 15px; border: 3px solid #335967; border-top: 0; }
.box-right, .box-middle { border-color: #6A323E; }
.box-right { float: right; }
.box-middle { float: none; width: auto; }
.signin { min-height: 310px; }
.fb_iframe_widget { margin-bottom: 1em; }

/* ----- LISTS ----- */
ul#nav, #left-content ul, ul.products, #footer ul, ul#breadcrumb, ul.basket-status, ul.trade { margin: 0; }
ul#nav li, left-content li, ul.products li, #footer li, ul#breadcrumb li, ul.basket-status li, ul.trade li { list-style: none; }

ul#nav li { background: #335967; float: left; height: 35px; }
ul#nav li a { float: left; line-height: 35px; padding: 0 9px 0 8px; color: #fff; font-size: 1.2em; font-weight: bold; text-decoration: none; text-transform: uppercase; }
ul#nav li a:hover { background: #6A323E; }

#left-content ul { margin: 1em 0; }
#left-content li { line-height: 20px; }
#left-content li a { color: #000; font-weight: bold; text-decoration: none; }

#left-content dt { float: left; width: 20px; }
#left-content dd { margin-left: 20px; }

#footer ul { margin-right: -10px; }
#footer li { display: inline; padding: 0 5px 0 10px; color: #fff; border-left: 1px solid #fff; }
#footer li:first-child { border-left: 0; }
#footer li a { color: #fff; }

ul#breadcrumb { margin-bottom: 6px; background: #335967; color: #fff; }
ul#breadcrumb li { display: inline; line-height: 23px; padding-left: 8px;  }
ul#breadcrumb li a { color: #fff; }

#mini-basket dt { float: left; width: 90px; text-align: right; }
#mini-basket dd { margin-left: 105px; width: 85px; text-align: right; color: #6A323E; font-weight: bold; }
#mini-basket dd.empty { margin: 0; width: 190px; }

ul.basket-status { width: 612px; }
ul.basket-status li { float: left; margin-left: 45px; height: 51px; color: #ccc; text-align: center; font-weight: bold; }
ul.basket-status li:first-child { margin-left: 0; }
ul.basket-status li.a-a, ul.basket-status li.b-a, ul.basket-status li.c-a, ul.basket-status li.d-a, ul.basket-status li.e-a { color: #000; }

ul.products li .title { font-size: 1.1em; }
ul.products li .title a { color: #000; text-decoration: none; }
ul.products li .title a:hover { text-decoration: underline; }
ul.products li .price { padding: 5px 10px; color: #fff; background: #335967; border: 1px solid #B1B9BC; text-align: center; font-weight: bold; }

ul.products_normal li { margin-bottom: 10px; padding: 20px 20px 20px 220px; min-height: 180px; background: #ccc; }
ul.products_normal li img { float: left; margin-left: -200px; }
ul.products_normal li ul { margin: 0 0 1em 3.5em; }
ul.products_normal li li { margin: 0; padding: 0; min-height: 5px; list-style: disc; }

ul.products_shortened, ul.trade { margin: 0 0 1em -20px; width: 660px; }
ul.products_shortened li, ul.trade li { float: left; padding: 10px; margin-left: 20px; width: 180px; background: #ccc; }
ul.trade li { width: auto; margin-left: 19px; }
ul.products_shortened li img { display: block; margin-bottom: 1em; }
ul.products_shortened li .title { height: 40px; }

#newsitem4 ul { display: none; }

#main-content ul { list-style: disc; }
#main-content ol { list-style: decimal; }

/* ----- HEADINGS & PARAGRAPHS ----- */
h1, .h1, h2, .h2, h3, .h3 { }
blockquote { font-style: italic; }

#home_region1 h1 { display: none; }
#home_region4 h2 { visibility: hidden; }

.product-description h2 { margin: -10px -10px 1em -10px; padding: 2px 10px 5px; background: #335967; font-size: 1em; color: #fff; font-weight: bold; text-transform: uppercase; }
.box-left h2, .box-right h2, .box-middle h2 { margin: 0 -15px 7px; line-height: 36px; text-indent: 15px; color: #fff; background: #335967; text-transform: uppercase; }
.box-right h2, .box-middle h2 { background: #6A323E; }

/* ----- LINKS ----- */
a { color: #c00; }

/* ----- IMAGES ----- */
#top-layer img { margin-left: 15px; }
.thumb_0, .thumb_1, .thumb_2, .thumb_3 { margin-bottom: 1em; }
.thumb_1, .thumb_2 { margin-right: 5px; }

/* ----- TABLES ----- */
.versionstable table { width: 100%; }
.versionstable thead th { line-height: 20px; text-align: left; background: #335967; color: #fff; text-transform: uppercase; font-weight: bold; }
.versionstable .id { padding-left: 5px; }
.versionstable .stock { text-align: center; }

.basket table, .checkout table { width: 100%; }
.basket thead th, .checkout thead th { line-height: 30px; text-align: left; background: #335967; color: #fff; text-transform: uppercase; font-weight: bold; }
.basket tbody td, .checkout tbody td { padding: 15px 0; border-bottom: 3px solid #335967; vertical-align: top; }
.basket tbody td.image, .checkout tbody td.image { padding: 15px 12px; width: 68px; }
.basket .stock, .basket .price, .basket .quantity, .checkout .stock, .checkout .price, .checkout .quantity { width: 100px; text-align: center; }
.basket .total, .checkout .total { padding-right: 12px; width: 85px; text-align: right; }
.basket tfoot td.quantity, .checkout tfoot td.quantity { text-align: right; padding-right: 20px; width: 80px; }
.basket .subtotals td, .checkout .subtotals td { padding: 10px 0; font-weight: bold; }
.basket .saving td, .checkout .saving td { padding: 0 0 10px; color: #c00; font-weight: bold; }
.basket .saving td, .checkout .saving td { padding: 10px 0; border-top: 3px solid #335967; border-bottom: 3px solid #335967; }
.basket .icons td.total, .checkout .icons td.total { padding-top: 10px; text-align: right; }
.basket .highlight, .checkout .highlight { background: #ffc; }
.basket .checkout table, .checkout .checkout table { margin-bottom: 10px; border-bottom: 3px solid #dccca3; }
.basket .checkout .quantity, .checkout .checkout .quantity { width: 30px; }
.basket .checkout .price, .basket .checkout .total, .checkout .checkout .price, .checkout .checkout .total { width: 90px; }
.basket tbody .separate td, .checkout tbody .separate td { padding-bottom: 0; border-bottom: 0; }
.basket tbody .discountdetails td, .checkout tbody .discountdetails td { padding-top: 0; }

.shippingtable tbody td { padding: 0 5px 5px 0; }
.shippingtable tbody td.zone { font-weight: bold; }

/* ----- FORMS ----- */
fieldset { margin: 0 0 1em 0; }
legend { margin-left: -3px; }
label { float: left; width: 150px; font-weight: bold; }
input[type="text"], input[type="password"], textarea, select { width: 269px; }
select { width: 275px; }

.errors label { float: none; width: auto; }

#info-layer fieldset { float: right; margin: 0; height: 35px; }
#info-layer legend, #info-layer label { display: none; }
#info-layer input[type="text"] { float: left; margin: 8px 0 0 0; padding: 1px 0 2px 4px; width: 140px; }
#info-layer input[type="submit"] { margin: 8px 0 0 0; color: #fff; font-size: 1.2em; font-weight: bold; text-decoration: none; text-transform: uppercase; background: #335967; border: 0; cursor: pointer; }
#mini-basket input { position: absolute; top: 81px; left: 180px; }

#left-content legend { padding: 1em 0; }
#left-content label { color: #6A323E; font-weight: bold; }
#left-content input[type="text"], #left-content input[type="password"] { width: 254px; }

#CP_CouponCode, #strEmailAddressReminder, #numShipMethod, #quantity-add { padding: 0.1em; height: auto; }
#CP_CouponCode { width: 150px; }
#numCardStartMonth, #numCardStartYear, #numCardExpiryMonth, #numCardExpiryYear, #numShipMethod, #quantity-add, #strReadTerms, #numPriceMin, #numPriceMax { width: auto; }
#strReadTerms, #strMailingList { vertical-align: middle; }
#strMailingListHTML { margin-left: 28px; }
#C_Card_IssueNumber { width: 20px; }
#C_Card_SecurityNumber { width: 40px; }

.basket table .quantity input { text-align: center; padding: 0.1em 0; }
.basket table input.image, .emailreminder input.image { vertical-align: top; margin-right: 4px; }
.checkout label { float: none; }
.checkout fieldset { width: 100%; }
.box-right textarea { height: 217px; }
.box-middle textarea { width: 600px; }

.form-row { margin: 1em 0; }
.auto, .checklabel { float: none !important; width: auto !important; margin-right: 10px; border: 0 !important; }
.normal, .validation-passed { border: 1px solid #7f9db9; }
.disabled { color: #ACA899; border: 1px solid #C9C7BA; }
.active { border: 1px solid #529214; }
.validation-failed { border: 1px solid #d12f19; }
.validation-advice, .errors, .advice { margin: 1em 0; padding: 0.5em; background: #fbe3e4; border: 1px solid #fbc2c4; color: #d12f19; font-weight: bold; }
.advice { background-color: #dff4ff; border: 1px solid #c2e1ef; color: #336699; }
.validation-advice { width: 170px; }

.radio { float: none; display: inline; font-weight: normal; padding: 0.1em; height: auto; width: auto !important; }

/* ----- LIGHTBOX ----- */
#lightbox { position: absolute; top: 20px; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; color: #151410; }
#lightbox a, #lightbox a: hover { border-bottom: none; color: #151410; text-decoration: underline; }
#lightbox a img { border: none; }
#outerImageContainer { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainerBottom .icLine1, #imageContainerBottom .icLine2, #imageContainerBottom .icLine3, #imageContainerBottom .icLine4, #imageContainerBottom .icLine5,
#imageContainerTop .icLine1, #imageContainerTop .icLine2, #imageContainerTop .icLine3, #imageContainerTop .icLine4, #imageContainerTop .icLine5 { font-size: 1px;/*	line-height: 1px;*/ height: 1px; background-color: #fff; border-style: solid; border-width: 0px 1px; }
#imageContainerTop .icLine1,#imageContainerBottom .icLine1 {margin: 0px 0px;border-color: #9e9e9e}
#imageContainerTop .icLine2,#imageContainerBottom .icLine2 {margin: 0px 0px;border-color: #3b3b3b}
#imageContainerTop .icLine3,#imageContainerBottom .icLine3 {margin: 0px 1px;border-color: #7b7b7b}
#imageContainerTop .icLine4,#imageContainerBottom .icLine4 {margin: 0px 2px;border-color: #676767}
#imageContainerTop .icLine5,#imageContainerBottom .icLine5 {margin: 0px 4px;border-color: #9e9e9e}
#imageContainerTop, #imageContainerBottom { position: relative; width: 250px; margin: 0 auto; }
#imageContainer { border-style: solid; border-color: #fff; border-width: 6px 10px 10px 10px; }
#loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#loadingLink { display: block; margin: 0 auto; padding: 0; width: 32px; height: 32px; background: url("../templateimages/loading.gif") center center no-repeat; text-indent: -9999px; }
#hoverNav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav { left: 0;}
#hoverNav a { outline: none;}
#prevLinkImg, #nextLinkImg { width: 49%; height: 100%; background-image: url(data: image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; text-indent: -9999px; }
#prevLinkImg { left: 0; float: left;}
#nextLinkImg { right: 0; float: right;}
#prevLinkImg:hover, #prevLinkImg:visited:hover { background: url("../templateimages/prev.png") 5% center no-repeat; }
#nextLinkImg:hover, #nextLinkImg:visited:hover { background: url("../templateimages/next.png") 97% center no-repeat; }
#imageDataContainer { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; }
#imageData { padding: 0 10px; }
#imageDetails { width: 70%; float: left; text-align: left; }	
#caption { font-weight: bold;	}
#numberDisplay { display: block; float: left; padding-right: 10px;}			
#detailsNav { display: block; padding: 0 0 10px 0; }	
#prevLinkDetails { margin: 3px; margin-top: 1px; display: block; width: 16px;height: 16px; background: url("../templateimages/prevlabel.gif") left center no-repeat; float: left; }
#nextLinkDetails { margin: 3px; margin-top: 1px; display: block; width: 16px;height: 16px; background: url("../templateimages/nextlabel.gif") right center no-repeat; float: left; }
#slideShowControl.started { background-image: url("../templateimages/pause.gif"); }
#slideShowControl { display: block; width: 17px; height: 17px; float: left; background: url("../templateimages/start.gif"); background-position: center center; background-repeat: no-repeat; }
#closeLink { display: block; margin: 0; padding: 0px; text-decoration: none; float: right; width: 32px; height: 32px; background: url("../templateimages/close.gif") no-repeat; text-indent: -9999px; overflow: hidden; }	 	
#overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #151410; filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; } 
.clearfix: after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html>body .clearfix { display: inline-block; width: 100%; }
* html .clearfix { /* Hides from IE-mac \*/ height: 1%; /* End hide from IE-mac */ }
