@import url("/libs/stylesheets/base.css");
@import url("/libs/stylesheets/site/base.css");

/* ---- layout ---- */
#layout-wrapper, #footer { width:960px }
#wrapper { padding:0 320px 0 0; width:640px }
#content { padding:20px 40px 40px; width:560px }
#rail { margin-right:-320px; padding:10px 30px 20px; width:260px }
body { background:#003559 }
#layout-wrapper { background:url("/images/faux-columns.png") repeat-y }
#header { background:url("/images/headerF.png") no-repeat; height:150px }
#header .logo { background:url("/images/logo.png") no-repeat; height:100px; top:0; width:640px }
#content { background:url("/images/contentF.png") no-repeat }
#deco { background:url("/images/deco-default.jpg") no-repeat bottom left; height:212px; margin:0 -20px }
#rail { background:url("/images/railF.png") no-repeat; padding-top:0 }
.main-menu { bottom:8px; left:10px }
.main-menu li { border-color:#003455; padding:0 35px }
.main-menu a { color:#CCC }
.main-menu a.active, .main-menu a:hover, .main-menu a.active:hover { color:#FFF }

h2, h3, h4 { color:#003559; font-family:Arial, Helvetica, sans-serif; font-weight:700 }
#content h2 { border:none }
#content h2 span, #rail h2 span { color:#BB1717 }

a.textlink { color:#BB1717 }
a.textlink:hover { background-color:#BB1717; color:#FFF }

/* products */
.product-wrapper .highlight { background-color:#FF9; padding:0 1px }
.product-wrapper h3 { margin-bottom:10px }
.product-wrapper .row { background:#EFEFEF; border-bottom:1px solid #CCC; margin:0 0 20px; padding:5px 10px 10px }
.product-wrapper .compatible { background:#FFF url("/images/compatible.png") no-repeat left top; border-top:1px solid #CCC; clear:both; margin-top:10px; padding:35px 0 5px 5px }
.product-wrapper .left, .product-wrapper .middle, .product-wrapper .right { display:block; float:left }
.product-wrapper .left { width:60% }
.product-wrapper .middle { width:15% }
.product-wrapper .right { width:24% }
.product-wrapper .left dl { width:330px }
.product-wrapper .left dt { clear:both; float:left; font-size:0.9em; font-weight:700; width:90px }
.product-wrapper .left dd { float:left; margin:0 0 3px; padding:0 0 0 2px; width:238px }
.product-wrapper .left dd:last-child { }

/* history */
.history-list { background:#FFF }
.history-list dt { background:#003559; color:#FFF; font-weight:700; padding:4px }
.history-list dd { border-bottom:1px solid #F1F1F1; padding:2px 4px }
.history-list dd span { display:block; float:left }
.history-list dd span.quantity { margin-right:10px; text-align:right; width:30px }
.history-list dd span.name { width:250px }
.history-list dd span.comment { background:url("/libs/images/comment.png") no-repeat left 2px; padding-left:20px; width:280px }
.history-list dd.last-child { border:none; margin-bottom:10px; padding-top:10px }

/* rail */
#rail .panel { background:url("/images/rail-panel.png") repeat-x bottom left }
#rail .basket-summary.panel { background:none; border:none; padding-top:5px }
#rail .certified-logos { margin-bottom:10px }
#rail .brand-logos { padding-top:40px }
#rail h2 span { color:#BB1717 }
.brand-wrapper li { float:left; margin:0 5px 0 0 }
.tagcloud li a:hover { color:#FFF }
.tagcloud-wrapper .options { border:none }

/* banner */
#rail .banner { display:block; text-indent:-9999em; width:260px }
#rail .banner.deliver { background:url("/images/railbanner-delivery.png") no-repeat; display:block; height:144px }
#rail .banner.join a { background:url("/images/railbanner-join.png") no-repeat; display:block; height:50px }

/* search */
#cartridge-search li { margin:0 0 5px }
#cartridge-search input { border:1px solid #003458; float:left; font-size:1.8em; height:27px; padding:3px; width:180px }
#cartridge-search select { font-size:1em; padding:2px }
#cartridge-search select option { padding:0 10px }
#cartridge-search button.search { background:url("/images/button-search.png") no-repeat; border:none; cursor:pointer; float:left; height:35px; margin-left:5px; text-indent:-9999em; width:60px }
#basket-summary { background:url("/images/basket.png") no-repeat left 10px; height:40px; position:relative; width:100% }
#basket-summary span { position:absolute }
#basket-summary .items { color:#BB1717; font-weight:700; right:5px; text-align:right; top:2px }
#basket-summary .total { bottom:2px; font-size:1.5em; font-weight:700; right:5px; text-align:right }
#basket-summary .link { top:12px; left:30px }
.basket-functions button.add { background:url("/images/button-buy.png") no-repeat; width:52px }
.basket-functions button.remove { background:url("/images/button-remove.png") no-repeat; width:52px }
#rail fieldset dt { margin-bottom:3px; text-align:left }
#rail fieldset dt, #rail fieldset dd { float:none; display:block }
#rail fieldset .actions { padding-left:0 }

/* login */
#login-wrapper { position:absolute; right:0; top:30px; width:300px }
#login-wrapper div { margin-bottom:5px }
#login-wrapper span { color:#003559; display:block; float:left; font-weight:700; width:70px; }
#login-wrapper input { border:1px solid #666; padding:3px; font-size:1.1em }
#login-wrapper p { padding-left:70px }
#login-wrapper.logged-in { top:10px }
#login-wrapper.logged-in p { padding:0; font-size:1.5em }

/* registration form */
.registration-form .block { background:#FFF; margin:0 0 10px; padding:5px 10px 10px }
.registration-form dt { width:150px }

/* ---- SPACING ---- */
h2 { margin:20px 0 30px; padding:0 0 2px }
h3 { margin:10px 0 }
.flash { margin-bottom:10px }