html {background-color: #cccccc;}
html.about {background: #cccccc url(/images/template/AboutBackground.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
html.contact {background: #cccccc url(/images/template/ContactUsBackground.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
html.csp {background: #cccccc url(/images/template/CoreStockBackground.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
html.info {background: #cccccc url(/images/template/InfoBackground.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
html.products {background: #cccccc url(/images/template/ProductsBackground.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
html.stockists {background: #cccccc url(/images/template/StockistsBackground.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}

body {margin: 0; color: Black;}
table, img.border, input, textarea, select, button {border-color: #231f20;}

a:link {color: #000099;}
a:visited {color: #000099;}
a:hover, a:active, a:focus {color: #C0C0C0;}


div#templateMain {position: relative; background-color: White; width: 920px; padding: 0 20px 12px; margin: auto; padding-top: 26px;}
div#templateHeader, div#templateFooter, div#templateMenu {border-top: 2px dotted #8e8e8e; padding: 15px 0;}
div#templateHeader {width: 920px; padding-top: 20px;}
div#templateMenu {border-bottom: 2px dotted #8e8e8e;}
div#templateContent {position: relative; margin-top: 20px; padding-top: 100px;}
div#templateMenu, div#templateUserBoxes, div#templateSearch {color: Black;}
div#templateMenu {position: absolute; top: 198px; left: 20px; width: 920px;}
div#templateUserBoxes {position: absolute; top: 27px; right: 20px; width: 500px; text-align: right; line-height: 1.3em; font-size: 1.1em;}
div#templateSearch {position: absolute; top: -63px; right: 0; width: 210px; font-size: 1.2em; line-height: 1.5em;}
div#templateFooter {margin-top: 40px;}
div#templateFooterMain {font-size: 1.3em; background-color: #231f20; padding-top: 11px; height: 30px; text-align: center;}

div#templateMenuMain {text-transform: uppercase; padding-top: 10px; height: 31px; background-color: #231f20; font-size: 1.2em; text-align: center;}
#mainmenu > li {display: inline; margin-left: 60px;}
#mainmenu > li:first-child {margin-left: 30px;}
#mainmenu, #mainmenu ul {margin: 0; padding: 0; list-style-position: outside; position: relative; line-height: 1.5em;}
#mainmenu a:link, #mainmenu a:active, #mainmenu a:visited {display: block;}
#mainmenu li {float: left; position: relative; list-style-type: none; text-align: left;}
#mainmenu ul {position: absolute; width: 13em; top: 1.5em; display: none; background-color: #231f20; padding: 10px; margin-left: -10px;}
#mainmenu li ul a {width: 13em; float: left; text-transform: none;}
#mainmenu ul ul {top: auto;}
#mainmenu li ul ul {left: 13em; margin: 0px 0 0 10px;}
#mainmenu li:hover ul ul, #mainmenu li:hover ul ul ul, #mainmenu li:hover ul ul ul ul {display: none;}
#mainmenu li:hover ul, #mainmenu li li:hover ul, #mainmenu li li li:hover ul, #mainmenu li li li li:hover ul {display: block;}
div#templateMenu a {color: Yellow;}
div#templateFooter div.footermenu div {display: inline; margin-right: 15px;}
div#templateFooter div.abn {display: inline;}
div#templateFooter, div#templateFooter a {color: White;}

#searchForm {width: 198px; height: 25px; background-color: #cccccc; padding: 4px 6px 6px;}
#searchForm input {background-color: #cccccc; border: 0 none;}
div#templateSearch input {width: 120px;}
div#templateSearch input.button {width: 60px;}

div#userInfo {float: left; width: 290px; margin-right: 10px; margin-top: 25px;}
div#cartInfo {float: left; width: 200px; margin-top: 25px;}
div#userInfo strong, div#cartInfo strong {font-weight: normal; text-transform: uppercase;}

img#homeMainImage {display: block;}

span.important, p.important {border: 1px solid Black; background-color: #800000; color: White;}
span.important {padding: 2px 3px;}
p.important {padding: 3px;}
span.important a, p.important a {color: #FFEC00;}

.products-container {position: relative; clear-both; margin-bottom: 45px;}
.products-list {float: right; width: 800px;}
p#category, p#range {position: absolute; left: 0; top: 0; width: 123px; height: 67px; margin: 0; padding: 0; text-indent: -1000em; overflow: hidden;}
p#category {background: url("/images/products/category.png") no-repeat top left;}
p#range {background: url("/images/products/range.png") no-repeat top left;}


h1#logo {width: 204px; height: 124px; margin: 0; background: url("/images/template/logo.png") no-repeat top left; text-indent: -1000em; overflow: hidden;}
h1#logo a {display: block; width: 204px; height: 124px;}

h1, h2, h3 {color: Black;}
h1 {margin-top: 3px;}

hr {background-color: #231f20; color: #231f20;}


thead {background-color: #231f20; color: White;}
thead th a:link, thead th a:visited {color: White;}
thead th a:hover, thead th a:active, thead th a:focus {color: White;}

th, tr.search td, tr.totals td, tr.total td, td.divider {border-color: #231f20;}
tr.totals td, tr.total td, td.endUserCategoryName, td.endUserProductName {border-color: #231f20;}

td.endUserCategoryName {background-color: #202020;}
td.endUserProductName {background-color: #101010;}


legend, button, input.button {background-color: White; color: Black;}
legend {font-size: 1.2em; padding: 10px 0 15px;}
input.checkOut, button.checkOut {background-color: #800000; color: White;}
label.requiredField {color: #800000;}

