/******************/
/* General Styles */
/******************/
body {
 background-color: #000000;
 padding: 0 0 10px;
 margin: 0;
 font-family: Verdana, sans-serif;
 font-size: 100%;
 color: #000000;
 text-align: center;
}

div.clear {
 height: 1px;
 clear: both;
 overflow: hidden; /* Workaround required to make IE close the gap below the left col properly */
}

.left {
 float: left;
}

.right {
 float: right;
}

/*************/
/* Container */
/*************/
div#container {
 width: 900px;
 margin-left: auto;
 margin-right: auto;
 text-align: left;
}

/**********/
/* Header */
/**********/
div#header {
 position: relative;
 height: 135px;
 background-image: url(images/header.jpg);
 background-repeat: no-repeat;
 background-position: top left;
}

div#header h1 {
 position: absolute;
 top: 20px;
 right: 30px;
 width: 418px;
 height: 69px;
 margin: 0;
 padding: 0;
 background-image: url(images/logo.png);
 text-indent: -9999px;
}

div#header p {
 position: absolute;
 bottom: 10px;
 right: 60px;
 width: 317px;
 height: 38px;
 margin: 0;
 padding: 0;
 background-image: url(images/strapline.png);
 text-indent: -9999px;
}

* html div#header h1 { /* Workaround IE PNG deficiencies */
 background-image: none;
 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/logo.png', sizingMethod='crop');
}

* html div#header p { /* Workaround IE PNG deficiencies */
 background-image: none;
 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/strapline.png', sizingMethod='crop');
}

/*****************/
/* Accessibility */
/*****************/
div#accessibility {
 display: none;
}

/***********/
/* Top Nav */
/***********/
div#topnav {
 position: relative;
 height: 51px;
 background-image: url(images/topnav.jpg);
 background-repeat: repeat-x;
 background-position: top left;
}

div#topnav ul {
 position: absolute;
 top: 15px;
 left: 5px;
 margin: 0;
 padding: 0;
 list-style: none;
}

div#topnav ul li {
 float: left;
 display: inline;
 margin: 0;
 margin-left: 5px;
 padding: 0;
 padding-left: 5px;
 border-left: 1px solid #585757;
}

div#topnav ul li.first {
 border-left: 0;
}

div#topnav ul li a {
 font-family: Verdana, sans-serif;
 color: #9ce713;
 font-size: 0.75em;
 text-decoration: none;
 font-weight: bold;
}

div#topnav ul li a:hover {
 color: #9ce713;
 text-decoration: underline;
}

div#topnav h3#basket {
 position: absolute;
 top: 1px;
 right: 20px;
 width: 129px;
 height: 20px;
 margin: 0;
 padding: 0;
 background-image: url(images/basket.png);
 text-indent: -9999px;
}

* html div#topnav h3#basket { /* Workaround IE PNG deficiencies */
 background-image: none;
 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/basket.png', sizingMethod='crop');
}

div#topnav p#summary {
 position: absolute;
 bottom: 8px;
 right: 160px;
 font-family: Verdana, sans-serif;
 color: #ffffff;
 font-size: 0.75em;
 margin: 0;
 padding: 0;
}

div#topnav ul#basketlinks {
 position: absolute;
 width: 145px;
 height: 20px;
 left: auto;
 top: auto;
 right: 5px;
 bottom: 5px;
 margin: 0;
 padding: 0;
 list-style: none;
 border: 1px solid #9ce713;
 background-color: #ffffff;
}

div#topnav ul#basketlinks li {
 float: left;
 display: inline;
 width: 60px;
 text-align: center;
 margin: 0;
 padding: 0;
 border-left: 1px solid #555454;
}

div#topnav ul#basketlinks li.first {
 border-left: none;
}

div#topnav ul#basketlinks li.first a {
 padding-left: 0;
}

div#topnav ul#basketlinks li a {
 font-family: Verdana, sans-serif;
 color: #555454;
 font-size: 0.65em;
 text-decoration: none;
 font-weight: bold;
 padding-left: 10px;
 text-transform: uppercase;
}

div#topnav ul#basketlinks li a:hover {
 color: #555454;
 text-decoration: underline;
}

/*********************/
/* Content Container */
/*********************/
div#contentcontainer {
 margin-top: 10px;
 background-image: url(images/contentcontainer.gif);
 background-repeat: repeat-y;
 background-position: top left;
}

/************/
/* Left Col */
/************/
div#leftcol {
 float: left;
 width: 229px;
}

/**********/
/* Search */
/**********/
div#leftcol form#search {
 height: 47px;
 background-image: url(images/search-background.jpg);
 background-repeat: no-repeat;
 background-position: top left;
 padding: 10px 0 10px 10px;
 margin: 0;
}

div#leftcol form#search fieldset {
 border: 0;
 padding: 0;
 margin: 0;
}

div#leftcol form#search fieldset legend {
 display: none;
}

div#leftcol form#search label {
 font-family: Verdana, sans-serif;
 color: #ffffff;
 font-size: 0.7em;
 float: left;
 margin-bottom: 5px;
}

div#leftcol form#search input.text {
 border: 1px solid #9ce713;
 width: 180px;
 float: left;
 clear: both;
}

div#leftcol form#search input.button {
 float: left;
 margin-left: 5px;
 width: 21px;
 height: 21px;
 background-image: url(images/search-button.png);
 background-repeat: no-repeat;
 border: 0px;
 background-color: transparent;
 cursor: pointer;
}

* html div#leftcol form#search input.button { /* Workaround IE PNG deficiencies */
 background-image: none;
 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/search-button.png', sizingMethod='crop');
}

div#leftcol div.navbox {
 margin-bottom: 8px;
}

/***************/
/* Quick Links */
/***************/
div#leftcol form#form-quicklink {
 background-image: url(images/search-background.jpg);
 background-repeat: no-repeat;
 background-position: top left;
 padding: 10px 0 10px 10px;
 margin: 0;
}

div#leftcol form#form-quicklink fieldset {
 border: 0;
 padding: 0;
 margin: 0;
}

div#leftcol form#form-quicklink fieldset legend {
 display: none;
}

div#leftcol form#form-quicklink label {
 font-family: Verdana, sans-serif;
 color: #ffffff;
 font-size: 0.7em;
 float: left;
 margin-bottom: 5px;
}

div#leftcol form#form-quicklink select {
 border: 1px solid #9ce713;
 width: 210px;
}

/*******/
/* Nav */
/*******/
div#leftcol div#nav {
 background-image: url(images/nav-background.jpg);
 background-repeat: repeat-x;
 background-position: bottom left;
 background-color: #989697;
 padding: 3px 0;
}

div#leftcol div#nav ul {
 list-style: none;
 margin: 0 6px;
 padding: 0;
}

div#leftcol div#nav ul li {
 background-image: url(images/nav-category-bullet.gif);
 background-repeat: no-repeat;
 background-position: 0 8px;
 border-top: 1px solid #535252;
 margin: 0;
 padding: 4px 0 4px 25px;
}

html:first-child div#leftcol div#nav ul li { /* Opera hack to get bullet image in the correct place */
 background-position: 0 6px;
}

div#leftcol div#nav ul li.first {
 border-top: 0;
}

div#leftcol div#nav ul ul li.first {
 border-top: 1px solid #535252;
}

div#leftcol div#nav ul li a {
 color: #ffffff;
 text-decoration: none;
 font-weight: bold;
 font-size: 0.75em;
}

div#leftcol div#nav ul li a:hover {
 text-decoration: underline;
}

div#leftcol div#nav ul li a.selected {
 color: #c4f11e;
 font-size: 90%;
}

div#leftcol div#nav ul>ul { /* 2nd UL has to be specified as first child of 1st UL to make IE work properly */
 margin: 6px 0 -3px;
}

div#leftcol div#nav ul ul li {
 background-image: url(images/nav-subcategory-bullet.gif);
 background-repeat: no-repeat;
 background-position: 0 7px;
 padding: 2px 0 2px 20px;
}

html:first-child div#leftcol div#nav ul ul li { /* Opera hack to get bullet image in the correct place */
 background-position: 0 4px;
}

/**********/
/* Brands */
/**********/
div#leftcol div#brands {
 background-color: #afaeae;
 width: 229px; /* Needed to get IE7 to show full background color */
}

div#leftcol div#brands img.brand {
 float: left;
 border: 0;
}

/*********/
/* Cards */
/*********/
div#leftcol div#cards {
 background-image: url(images/cards-background.jpg);
 background-repeat: repeat-y;
 background-position: top left;
}

div#leftcol div#cards img {
 margin: 8px;
}

/************/
/* Content */
/************/
div#content {
 float: left;
 padding: 15px;
 padding-left: 25px;
 padding-right: 10px;
 width: 632px;
 font-size: 0.9em;
}

div#content p, div#content li, div#content address {
 font-size: 0.8em;
}

div#content h4 {
 margin-bottom: 0;
}

div#content li li {
 font-size: 1em;
}

div#content address {
 font-style: normal;
}

div#content a {
 font-weight: bold;
 text-decoration: none;
 color: #0a22bd;
}

div#content a:hover {
 text-decoration: underline;
 color: #fb0102;
}

/******************/
/* Sub Categories */
/******************/
div#content div#subcategories {
 margin-top: 15px;
}

div#content div#subcategories div.subcategory {
 width: 152px;
 height: 56px;
 margin-right: 8px;
 margin-bottom: 4px;
 float: left;
}

div#content div#subcategories div.final {
 margin-right: 0;
}

div#content div#subcategories div.subcategory img {
 border: 0;
}

/*************/
/* Sort Form */
/*************/
div#content div#sortform {
 float: right;
 clear: left;
 height: 50px;
 width: 350px;
 border: 1px solid #cee870;
 margin: 15px 0;
 padding: 10px;
}

div#content div#sortform form {
 float: right;
 clear: right;
 margin: 0;
 padding: 0;
 text-align: right;
}

div#content div#sortform div.field {
 margin-bottom: 10px;
 float: right;
 clear: right;
 width: 100%; /* Daft workaround needed for IE6 to behave */
}

div#content div#sortform form div.field label {
 float: right;
 color: #4d4d4d;
 padding-top: 4px;
}

div#content div#sortform form div.field select {
 float: right;
 border: 1px solid #cee870;
 color: #4d4d4d;
}

/*********************/
/* Category Products */
/*********************/
div#content div#products {
 padding-top: 15px;
 clear: left;
}

div#content div#products div.product {
 width: 180px;
 height: 250px;
 overflow: hidden;
 margin-right: 20px;
 margin-bottom: 25px;
 float: left;
}

div#content div#products div.product h3 {
 font-family: Verdana, sans-serif;
 margin: 0;
 padding: 0;
 font-size: 0.9em;
}

div#content div#products div.product h4 {
 font-family: Verdana, sans-serif;
 margin: 0;
 padding: 0;
 font-size: 0.85em;
 color: #4f4f4f;
 font-weight: normal;
 margin-bottom: -8px;
}

div#content div#products div.product h3 a {
 color: #000000;
}

div#content div#products div.product p, div#content div#products div.product li {
 color: #4f4f4f;
}

div#content div#products div.product p.productprice {
 margin: 0;
 margin-top: -5px;
}

div#content div#products div.product span.highlight {
 font-size: 120%;
 font-weight: bold;
 color: #000000;
}

div#content div#products div.product span.lowlight {
 font-size: 75%;
 color: #000000;
}

div#content div#products div.product img {
 border: 0;
}

div#content div#products div.product img.buy {
 margin-top: 30px;
 margin-left: 20px;
 float: left;
 border: 0;
}

/******************************/
/* Category Featured Products */
/******************************/
div#content div#featuredproducts {
 padding-top: 15px;
 clear: left;
 border-bottom: 1px solid #4f4f4f;
}

div#content div#featuredproducts div.product {
 width: 180px;
 height: 250px;
 overflow: hidden;
 margin-right: 20px;
 margin-top: 15px;
 float: left;
}

div#content div#featuredproducts div.product h3 {
 font-family: Verdana, sans-serif;
 margin: 0;
 padding: 0;
 font-size: 0.9em;
}

div#content div#featuredproducts div.product h4 {
 font-family: Verdana, sans-serif;
 margin: 0;
 padding: 0;
 font-size: 0.85em;
 color: #4f4f4f;
 font-weight: normal;
 margin-bottom: -8px;
}

div#content div#featuredproducts div.product h3 a {
 color: #000000;
}

div#content div#featuredproducts div.product p, div#content div#featuredproducts div.product li {
 color: #4f4f4f;
}

div#content div#featuredproducts div.product p.productprice {
 margin: 0;
 margin-top: -5px;
}

div#content div#featuredproducts div.product span.highlight {
 font-size: 120%;
 font-weight: bold;
 color: #000000;
}

div#content div#featuredproducts div.product span.lowlight {
 font-size: 75%;
 color: #000000;
}

div#content div#featuredproducts div.product img {
 border: 0;
}

div#content div#featuredproducts div.product img.buy {
 margin-top: 30px;
 margin-left: 20px;
 float: left;
 border: 0;
}

/************/
/* Products */
/************/
div#content div#product form {
 margin: 0;
}

div#content div#product h2, div#content div#product h3 {
 font-family: Verdana, sans-serif;
 margin: 0;
 padding: 0;
}

div#content div#product h2 {
 font-size: 1.1em;
 margin-top: 15px;
}

div#content div#product h3 {
 font-size: 0.8em;
 font-weight: normal;
 color: #4f4f4f;
}

div#content div#product p {
 color: #4f4f4f;
}

div#content div#product span.highlight {
 font-size: 150%;
 font-weight: bold;
 color: #000000;
}

div#content div#product span.lowlight {
 font-size: 75%;
 color: #000000;
}

div#content div#product form#form-product {
 width: 250px;
 margin: 0;
 margin-top: 15px;
 padding: 10px;
 border: 1px solid #cee870;
}

div#content div#product form#form-product div.field {
 margin-bottom: 10px;
 float: left;
 clear: left;
 width: 100%; /* Fix needed to get IE to show all Product Option Choices on same line */
}

div#content div#product form#form-product div.field label {
 width: 110px;
 color: #323232;
 font-weight: bold;
 font-family: Verdana, sans-serif;
 font-size: 0.8em;
 float: left;
}

div#content div#product form#form-product select, div#content div#product form#form-product input {
 border: 1px solid #cee870;
 color: #4d4d4d;
 float: left;
}

div#content div#product form#form-product input#input-quantity {
 width: 20px;
 padding: 0 3px;
}

div#content div#product form#form-product input.text { /* Text product option fields */
 width: 100px;
 padding: 0 3px;
}

div#content div#product form#form-product input#submit-button {
 float: none;
 border: 0;
}

div#content div#product div#productimage, div#content div#product div#productdetails {
 float: left;
}

div#content div#product div#productimage {
 width: 300px;
}

div#content div#product div#productimage img {
 float: left;
 border: 0;
}

div#content div#product div#productimage p {
 clear: left;
 margin: 0;
 padding: 0;
 font-size: 80%;
 text-align: center;
 font-style: italic;
}

div#content div#product div#productdetails {
 width: 330px;
}

div#content div#product .extrainfo {
 border: 1px solid #4d4b4c !important;
 padding: 5px;
 background-color: #f1f1f1;
 color: #000000;
 font-style: italic;
}

/********************/
/* Product Rollover */
/********************/
div#overlay {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 z-index: 1;
 background-image: url('images/overlay.png');
}

div#largeimagecontainer {
 background-color: #000000;
 border: 1px solid #999999;
}

div#largeimagecontainer img {
 padding: 10px;
}

div#largeimagecontainer p {
 color: #9ce713;
 margin: 3px auto 0px;
 padding: 0;
 font-size: .9em;
}

/**************/
/* Pagination */
/**************/
div#content div#pagination {
 clear: left;
}

div#content div#pagination a {
 color: #000000;
 text-decoration: none;
}

div#content div#pagination a:hover {
 color: #000000;
 text-decoration: underline;
}

div#content div#pagination span.current {
 border: 1px solid #9ce713;
 padding: 3px;
 color: #4a4a4b;
}

/**********/
/* Basket */
/**********/
div#content table#basket {
 border-collapse: collapse;
 border: 0;
 font-size: 0.9em;
}

div#content table#basket th {
 background-image: url(images/topnav.jpg);
 background-repeat: repeat-x;
 background-position: top left;
}

div#content table#basket td, div#content table#basket th {
 padding: 3px;
 border: 2px solid #ffffff;
}

div#content table#basket tr.highlight td {
 font-weight: bold;
}

div#content table#basket td.noitems {
 text-align: center;
 font-style: italic;
}

div#content table#basket col#basketitemcolumn {
 width: 55%;
}

div#content table#basket col#basketpricecolumn {
 width: 15%;
}

div#content table#basket col#basketquantitycolumn {
 width: 10%;
}

div#content table#basket col#basketsubtotalcolumn{
 width: 15%;
}

div#content table#basket col#basketremovecolumn {
 width: 5%;
}

div#content input#button-updatebasket {
 float: right;
 margin-top: 1em;
}

div#content form#form-clearbasket input {
 margin-top: 1em;
}

div#content div#basket-links {
 margin-top: 1em;
}

div#content div#basket-links p {
 margin: 0;
 padding: 0;
}

div#content p#checkout-link {
 float: right;
}

div#content table#basket input.quantity-field {
 width: 30px;
 text-align: right;
}

/*****************/
/* Accessibility */
/*****************/
div#content table#accesskeystable {
 border: 1px solid #000000;
 border-collapse: collapse;
 width: 300px;
}

div#content table#accesskeystable, div#content table#accesskeystable caption {
 margin-left: auto;
 margin-right: auto;
}

div#content table#accesskeystable th {
 border: 1px solid #000000;
 border-collapse: collapse;
 padding: 4px;
 color: #ffffff;
 background-color: #515151;
}

div#content table#accesskeystable td {
 border: 1px solid #000000;
 border-collapse: collapse;
 padding: 4px;
}

div#content table#accesskeystable tr {
 background-color: #ffffff;
}

div#content table#accesskeystable tr.highlight {
 background-color: #afadae;
}

div#content table#accesskeystable em {
 font-weight: bold;
 text-decoration: underline;
 font-style: normal;
}

/*********/
/* Forms */
/*********/
div#content form {
 margin: 0;
}

div#content form fieldset {
 border: 1px solid #9ce713;
 padding: 10px;
 margin-bottom: 10px;
}

div#content form fieldset legend {
 padding: 0 15px;
 font-size: 0.9em;
 font-weight: bold;
 color: #000000;
}

div#content form fieldset.buttons {
 border: 0px;
}

div#content form fieldset.buttons legend {
 display: none;
}

div#content form div.field {
 float: left;
 clear: left;
 font-size: 0.8em;
 margin-bottom: 3px;
 width: 100%;
}

div#content form fieldset.buttons div.field {
 width: auto;
}

div#content form div.field label {
 color: #4f4f4f;
 float: left;
 width: 125px;
 text-align: right;
 padding-right: 5px;
}

div#content form div.field label.inline {
 width: auto;
 text-align: left;
 padding-left: 5px;
 padding-right: 0;
}

div#content form div.required label {
 font-weight: bold;
}

div#content form div.field input.text, div#content form div.field select, div#content form div.field textarea, div#content form div.field input.checkbox {
 float: left;
}

div#content form div.field input.text {
 width: 250px;
}

div#content form div.field textarea {
 font-family: Verdana, sans-serif;
 font-size: 1em;
 width: 400px;
 height: 120px;
}

div#content form fieldset.buttons div.field {
 padding-left: 130px;
}

div#content form fieldset p {
 margin-top: 0;
}

div#content form fieldset p.indent {
 margin-left: 130px;
}

div#content form fieldset p.lowlight {
 font-size: 80%;
}

/****************/
/* Address Book */
/****************/
div#content div.address {
 float: left;
 margin-left: 10px;
 margin-bottom: 15px;
 height: 10em;
 width: 250px;
}

div#content div.address input {
 float: left;
}

div#content div.address label {
 font-size: 0.9em;
 display: block;
 float: left;
 margin-left: 5px;
}

div#content div.address em {
 font-style: italic;
}

/**********/
/* Orders */
/**********/
div#content table.data {
 border-collapse: collapse;
 border: 0;
 font-size: 0.9em;
}

div#content table.data th {
 background-image: url(images/topnav.jpg);
 background-repeat: repeat-x;
 background-position: top left;
 text-align: center;
}

div#content table.data td, div#content table.data th {
 padding: 3px;
 border: 2px solid #ffffff;
}

/**************/
/* Home icons */
/**************/
div#content img.homeicon {
 float: left;
 margin-left: 2px;
 margin-right: 3px;
 margin-bottom: 5px;
}

/*********************/
/* Errors & Messages */
/*********************/
div#content div.errors {
 border: 1px solid #000000;
 background-color: #fb0102;
 padding: 5px 10px;
 margin: 10px 20px;
 color: #ffffff;
}

div#content div.messages {
 border: 1px solid #000000;
 background-color: #9ce713;
 padding: 5px 10px;
 margin: 10px 20px;
 color: #000000;
}

/********/
/* News */
/********/
div#content .summary  {
 color: #333333;
 font-style: italic;
}

/**********/
/* Footer */
/**********/
div#footer {
 clear: both;
 font-family: Verdana, sans-serif;
 color: #ffffff;
 font-size: 0.65em;
 padding-top: 20px;
}

div#footer ul {
 margin: 0;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 5px;
 padding: 0;
 width: 600px;
 text-align: center;
 list-style: none;
}

div#footer ul li {
 display: inline;
 margin: 0;
 margin-left: 5px;
 padding: 0;
 padding-left: 5px;
 border-left: 1px solid #ffffff;
}

div#footer ul li.first {
 border-left: 0;
}

div#footer a {
 color: #ffffff;
 text-decoration: none;
}

div#footer a:hover {
 text-decoration: underline;
}