body { margin:0px; font-size:80%; font-family:Arial, Helvetica, sans-serif; }

/* div { border:1px dotted black; } */


/* LAYOUT STYLES */


#siteContainer {  }

/* .brace sets the width of the content */
.brace { width:900px; margin:0px auto; }
/* IE6 - Different content width (if necesasry) */
* html .brace { width:900px; margin:0px auto; }

/* Sets the global padding on content elements. If you adjust this setting you need to adjust widths sitewide */
.bigPad { padding:20px; }
.smlPad { padding:10px 20px; }

#header { height:131px; background: url(images/header_bg.gif) repeat-x; }
#header #logo { position:absolute; width:440px; height:100px; top:28px; }
#header #strapLine { display:none; position:absolute; width:200px; height:30px; top:95px; margin-left:200px; }
#header #contactDetails { position:absolute; width:270px; height:62px; top:69px; margin-left:580px; }
#header #headerBasket { float:right; width:370px; margin-right:20px; background-color:#414141; color:white; -moz-border-radius-bottomleft:10px; -moz-border-radius-bottomright:10px; }

#tabBar { display:none; margin-bottom:2px; }
#navBar { background-color:#C5DC29; margin-bottom:2px; border-top:1px solid #DCEA7C; border-bottom:1px solid #7F8D1A; }
#searchBar { margin-bottom:2px; background-color:#F2F7D3; text-align:center; }
#searchBar form { margin:0px; padding:0px; }
#searchBar form input { vertical-align:middle; }


/* Fix the width of the site and use a BG image on contentArea for columns with bg's, as contentArea expands with all columns */
#contentArea { min-height:300px; }
/* IE6 - min-height hacks */
* html #contentArea { height:300px; }

/* Firefox - extend contentArea with the left and right columns */
#contentArea:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#contentArea #leftColumn { width:140px; float:left; border-right:1px dashed black; }
#contentArea #rightColumn { display:none; width:110px; float:right; margin-left:20px; }

#contentArea #leftColumn, #contentArea #rightColumn { min-height:300px; }
/* IE6 - min-height hacks */
* html #contentArea #leftColumn { height:300px; }
* html #contentArea #rightColumn { height:300px; }

#loginBox { margin-top:20px; display:none; }
#loginBox input { margin-top:5px; }
#loginBox input[type='text'], #loginBox input[type='password'] { width:130px; }
#loginBox form { margin:0px; padding:0px; }

#loginBox input#loginSubmit { float:right; }


#contentArea #contentColumn { display:block; margin:0px 0px 0px 180px; }

#bitTrail { margin:-10px 0px 10px 0px; font-size:0.8em; }

#footer { clear:both; margin-top:2px; background-color:black; }

#footerNotices { font-size:0.8em; }
#footerNotices span { margin-right:10px; }

.rightColumn { float:right; width:50%; }
.leftColumn { float:left; width:50%; }




/* NAVIGATION STYLES */


#navBar ul { margin:0px; padding:0px; }
#navBar ul li { display:inline; margin:0px; padding:0px; list-style-type:none; font-size:1.1em; }

/* The padding on this a should be set to the same as .smlPad or the buttons won't line up (in any browser!) */
#navBar ul li a { padding:10px; border-right:1px solid #7F8D1A; border-left:1px solid #DCEA7C; text-decoration:none; }
#navBar ul li a.first { border-left:1px solid #DCEA7C; }
#navBar ul li a.last {  }

#navBar ul li a:link {  }
#navBar ul li a:active {  }
#navBar ul li a:visited {  }
#navBar ul li a:hover { color:#3F3F3F; background-color:#D4E464; }


#leftNav ul { margin:0px; padding:0px; font-size:1.1em; }
#leftNav ul li { margin:0px; padding:0px; list-style-type:none; }
#leftNav ul li a { display:block; padding:5px; border-top:1px dotted #CECECE; text-decoration:none; }
#leftNav ul li a.first { border-top:none; }
#leftNav ul li a.last {  }

#leftNav ul li a:link {  }
#leftNav ul li a:active {  }
#leftNav ul li a:visited {  }
#leftNav ul li a:hover { color:#3F3F3F; background-color:#F2F7D3; }


#footer ul { margin:0px; padding:0px; }
#footer ul li { display:inline; margin:0px; padding:0px; list-style-type:none; }

/* The padding on this a should be set to the same as .smlPad or the buttons won't line up (in any browser!) */
#footer ul li a { padding:10px; }

#footer ul li a:link { color:white; }
#footer ul li a:active { color:white; }
#footer ul li a:visited { color:white; }
#footer ul li a:hover { color:white; }


#headerBasket a:link { color:white; }
#headerBasket a:active { color:white; }
#headerBasket a:visited { color:white; }
#headerBasket a:hover { color:white; }




/* FORMATTING STYLES */


p, li, td, dt, dd { color:#3F3F3F; }

p { margin:0px 0px 10px 0px; line-height:1.3em; font-family:Tahoma, Arial, Helvetica, sans-serif; }
p.intro { padding:10px; margin:10px 0px; background-color:#F2F7D3; -moz-border-radius:10px; }

h1, h2, h3, h4, h5, h6 { margin:0px 0px 4px 0px; }

h1 { font-size:2.4em; color:#C5DC29; }
h2 { font-size:1.3em; color:#6EBDFE; }
h3 { font-size:1.1em; color:#C5DC29; }
h4 { font-size:1em; color:#C5DC29; }
h5 { font-size:0.9em; color:#C5DC29; }
h6 { font-size:0.8em; color:#C5DC29; }

a:link { color:#3F3F3F; text-decoration: underline; }
a:active { color:#3F3F3F; }
a:visited { color:#3F3F3F; }
a:hover { color:#636363; text-decoration:none; }

ul { list-style-type:square; }
li {  }

.customerServices th { background-color: #F2F7D3; text-align: right; font-weight: normal; }


hr { color:#3F3F3F; border-color:#3F3F3F; }

.right { float:right; }
.left { float:left; margin-right:10px; }

.imgRight { float:right; margin:0px 0px 10px 10px; }
.imgLeft { float:left; margin:0px 10px 10px 0px; }

.boxoutRight { float:right; width:30%; padding:10px; margin:0px 0px 10px 20px; background-color:#E6E6E6; font-size:0.8em; -moz-border-radius:10px; }
.boxoutLeft { float:left; width:30%; padding:10px; margin:0px 20px 10px 0px; background-color:#E6E6E6; font-size:0.8em; -moz-border-radius:10px; }
.boxOut { padding:10px; margin:18px 0px; background-color:#E6E6E6; -moz-border-radius:10px; }

.notice { padding:10px; margin:10px 0px; background-color:#FEFCD5; border:1px solid #D2CF98; color:#5D5D5D; line-height:1.3em; -moz-border-radius:10px; }

.error { padding:15px; margin:10px 0px; background-color:#FFE9E9; border:1px solid #F08282; color:red; font-size:1em; line-height:1.3em; -moz-border-radius:10px; }

input[type="text"], input[type="password"], select, textarea { padding:2px; border:1px solid black; background: url(images/input_inner_shadow.gif) no-repeat left top white; }

.linkList { margin:20px 0px 0px 35px; padding:0px 0px 0px 0px; list-style-type:none; }
.linkList li { margin:0px 0px 20px 0px; padding:0px 0px 0px 20px; background: url(images/arrow_right.gif) no-repeat 0px 2px; }
.linkList li a { color:#2066A0; }
.linkList li a:visited { color:#6EBDFE; }

.webLinkList { margin:20px 0px 0px 35px; padding:0px 0px 0px 0px; list-style-type:none; }
.webLinkList li { margin:0px 0px 20px 0px; padding:0px 0px 0px 20px; background: url(images/arrow_weblink.gif) no-repeat 0px 0px; }
.webLinkList li a { color:#2066A0; }
.webLinkList li a:visited { color:#6EBDFE; }



#contactFormTable { border-collapse:collapse; border:1px; }
#contactFormTable td { padding:6px; }
#contactAddress { float:right; width:275px; }




/* CONTENT STYLES */

.special, .new { float:right; margin-left:5px; }

.productListing, #productDetail, #subCatListing { margin-top:15px; }
.productListing h1, #productDetail h1, #subCatListing h1 { margin-bottom:15px; }

.productListing { display:inline-block; padding:0px 0px 0px 0px; }

/* .productListing div { border:1px solid #FFE9E9; } */



/* Product Listings */
.productListing ul { margin:0px; padding:0px; list-style-type:none; }
.productListing ul li { margin:0px 0px 20px 0px; padding:0px 0px 20px 0px; border-bottom:1px dashed black; }

.productListing ul li.oneColumn { float:left; width:100%; background-color:white; }

.productListing ul li.twoColumnLeft { float:left; width:48%; height:15em; overflow:hidden; }
.productListing ul li.twoColumnRight { float:right; width:48%; height:15em; overflow:hidden; }

/* ..vDivider should be slightly smaller than the height of the twoColumn classes*/
.productListing ul li.twoColDivider { float:left; height:14em; width:1px; margin:0px 10px; background:url(images/vetical_divider.gif) repeat-y left; border-bottom:none; }

.productListing ul li .prodImg { float:left; height:170px; width:170px; text-align:center;}
.productListing ul li .prodDetails { margin-left:190px; }
.productListing ul li .prodDetails p { font-size:0.9em; }
.productListing ul li .prodDetails .exVatPrice { font-size:1.2em; font-weight:bold; color:red; }
.productListing ul li .prodDetails .incVatPrice { font-size:0.9em; }
.productListing ul li .prodDetails form { margin:0px; padding:0px; }
.productListing ul li .prodDetails form .qty { width:20px; text-align:center; vertical-align:middle; }
.productListing ul li.twoColumnLeft .prodImg, .productListing ul li.twoColumnRight .prodImg { height:120px; width:120px; }
.productListing ul li.twoColumnLeft .prodDetails, .productListing ul li.twoColumnRight .prodDetails { margin-left:140px; }

#featProdHead, #relProdHead { padding:7px; margin:10px 0px; background-color:#F2F7D3; }
#featProdHead h2, #relProdHead h2 { margin:0px; color:#3F3F3F; font-size:0.9em; text-transform:uppercase; }

.origin { margin-bottom:0px; }

/* The Sub-category Listing */
#subCatListing {  }
ul.subCatList { font-size:1.2em; }
ul.subCatList li { margin-bottom:5px; }



/* The Product Detail Page */
#productDetail {  }
#productDetail .prodImg { float:left; height:220px; width:220px; margin-right:20px; text-align:center; }
/* This left margin should be the width of the prodImg plus its margin */
#productDetail .prodDetails { margin-left:240px; }
/* #productDetail .prodDetails { float:left; } */
#productDetail .prodDetails .exVatPrice { font-size:1.2em; font-weight:bold; color:red; }
#productDetail .prodDetails .incVatPrice { font-size:0.9em; }
#productDetail .prodDetails form { margin:0px; padding:0px; }
#productDetail .prodDetails form .qty { width:20px; text-align:center; vertical-align:middle; }


#relProductListing { float:left; width:100%; margin-bottom:20px; }

#relProductListing .relProduct { float:left; height:220px; width:31%; margin:0px 5px; }
#relProductListing .relProduct .prodImg {  }
#relProductListing .relProduct h2 { font-size:0.9em; }
#relProductListing .relProduct .exVatPrice { font-size:1em; font-weight:bold; color:red; }
#relProductListing .relProduct .incVatPrice { font-size:0.8em; }
#relProductListing .relProduct input.qty { width:1.5em; }
#relProductListing .relProduct form { margin:0px; }

/* Search Results */
#searchResultsContainer {  }
#searchResultsContainer ol li { margin-bottom:10px; font-size:1.1em; }
.pagination { text-align:center; }
.pagination a { padding:5px 10px; }
.pagination a.active { -moz-border-radius:5px; background-color:#F2F7D3; padding:5px 10px; font-weight:bold; text-decoration:none; }



/* BUTTON STYLES */


.addButton { height:29px; width:50px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_add.gif) no-repeat left top; }
.addButton:hover { height:29px; width:50px; border:0px; overflow:hidden; background: url(images/button_add.gif) no-repeat -50px top; }
.addButton:active { height:29px; width:50px; border:0px; overflow:hidden; background: url(images/button_add.gif) no-repeat -50px top; }

.goButton { height:25px; width:35px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_go.gif) no-repeat left top; }
.goButton:hover { height:25px; width:35px; border:0px; overflow:hidden; background: url(images/button_go.gif) no-repeat -35px top; }
.goButton:active { height:25px; width:35px; border:0px; overflow:hidden; background: url(images/button_go.gif) no-repeat -35px top; }

.loginButton { height:33px; width:70px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_login.gif) no-repeat left top; }
.loginButton:hover { height:33px; width:70px; border:0px; overflow:hidden; background: url(images/button_login.gif) no-repeat -70px top; }
.loginButton:active { height:33px; width:70px; border:0px; overflow:hidden; background: url(images/button_login.gif) no-repeat -70px top; }

.contactButton { height:33px; width:70px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_submit.gif) no-repeat left top; }
.contactButton:hover { height:33px; width:70px; border:0px; overflow:hidden; background: url(images/button_submit.gif) no-repeat -70px top; }
.contactButton:active { height:33px; width:70px; border:0px; overflow:hidden; background: url(images/button_submit.gif) no-repeat -70px top; }

.updateButton { height:29px; width:61px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_update.gif) no-repeat left top; }
.updateButton:hover { height:29px; width:61px; border:0px; overflow:hidden; background: url(images/button_update.gif) no-repeat -61px top; }
.updateButton:active { height:29px; width:61px; border:0px; overflow:hidden; background: url(images/button_update.gif) no-repeat -61px top; }

.checkoutButton { height:33px; width:76px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_checkout.gif) no-repeat left top; }
.checkoutButton:hover { height:33px; width:76px; border:0px; overflow:hidden; background: url(images/button_checkout.gif) no-repeat -76px top; }
.checkoutButton:active { height:33px; width:76px; border:0px; overflow:hidden; background: url(images/button_checkout.gif) no-repeat -76px top; }

.sendPasswordButton { height:33px; width:106px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_send_password.gif) no-repeat left top; }
.sendPasswordButton:hover { height:33px; width:106px; border:0px; overflow:hidden; background: url(images/button_send_password.gif) no-repeat -106px top; }
.sendPasswordButton:active { height:33px; width:106px; border:0px; overflow:hidden; background: url(images/button_send_password.gif) no-repeat -106px top; }

.placeOrderButton { height:33px; width:92px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_place_order.gif) no-repeat left top; }
.placeOrderButton:hover { height:33px; width:92px; border:0px; overflow:hidden; background: url(images/button_place_order.gif) no-repeat -92px top; }
.placeOrderButton:active { height:33px; width:92px; border:0px; overflow:hidden; background: url(images/button_place_order.gif) no-repeat -92px top; }

.continueShoppingButton { height:33px; width:125px; border:0px; overflow:hidden; vertical-align:middle; background: url(images/button_continue_shopping.gif) no-repeat left top; }
.continueShoppingButton:hover { height:33px; width:125px; border:0px; overflow:hidden; background: url(images/button_continue_shopping.gif) no-repeat -125px top; }
.continueShoppingButton:active { height:33px; width:125px; border:0px; overflow:hidden; background: url(images/button_continue_shopping.gif) no-repeat -125px top; }

/* BASKET STYLES */

#basketContainer { width:95%;  }

#basketTable { width:95%; border:0px; border-collapse:collapse; font-size:1.2em; }
#basketTable th, #basketTable td { padding:4px; }
#basketTable .qty { text-align:center; }
#basketTable th { border-bottom:2px solid gray; text-align:left; font-size:0.7em; font-weight:bold; }
#basketTable td { text-align:left; }
#basketTable th.priceLabel { text-align:right; }
#basketTable th.rowHead { border-bottom:0px; font-size:1em; }

#basketTable input.qty { width:1.5em; }

#updateButton {  }
#checkoutButton {  }

#basketTable .price { text-align:right; }

#basketTable .gTotal { font-weight:bold; }
#basketTable th.gTotal {  }
#basketTable td.gTotal { font-size:1.2em; }

#basketTable .questionLabel { text-align:right; }
#basketTable #email { width:15em; }
#basketTable .oddRow td { border-bottom:1px dotted gray; background-color:#FAFAFA; }
#basketTable .evenRow td { border-bottom:1px dotted gray; }

#basketTable .errorField { border:2px solid #C72929; }

#checkoutTable {  }


.supCont { margin-top: 20px; padding-bottom: 12px; border-bottom: 1px dotted #CECECE; min-height: 100px; }
.supImg { float: left; width:120px; text-align: center; margin-bottom:10px; }
.supTxt { margin-left: 140px; }
.supCont h2 { margin-bottom: 0px; }
.supCont a:link { color:#6EBDFE; text-decoration: underline; }
.supCont a:active { color:#6EBDFE; text-decoration: underline; }
.supCont a:visited { color:#6EBDFE; text-decoration: underline; }
.supCont a:hover { color:#6EBDFE; text-decoration:none; }