/* CSS Document */
/* v1.0 Dave Crawford */
@media screen
{
/* PAGE PROPERTIES */
body {
	text-align: center;
	margin: 0px;
}
/* PAGE LAYOUT */
/* frame */
#frame {
	width: 770px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
	text-align: left;
	background: #000 url('Images/background.gif') center repeat-y; 
	padding: 0 5px 0 5px;
	position: relative;
}
/* header */
#contentHeader {
	width: 100%;
	height: 164px;

}
#contentHeader .left {
	float: left;
	height: 83px;
}
#contentHeader .right {

}

#catalogue {
	position: absolute;
	top: 0;
	right: 5px;
	width: 192px;
	height: 72px;
}

/* left column */
#contentLeft {
	width: 130px;
	float: left;
	padding-left: 10px;
}
/* centre column */
#contentCenter {
	width: 460px;
	float: left;
	margin-top: 20px;
}
#contentCenterStretch {
	width: 626px !important;
	float: left;
	margin-top: 20px;
}
/* right column */
#contentRight {
	width: 160px;
	float: left;
	padding-right: 10px;
}
/* CONTENT CLASSES */
/* header */
.printLogo {
	display: none;
}
ul#navigation {
	list-style-type: none;
	padding: 0 5px 0 10px;
	margin: 11px 5px 0 5px;
}
ul#navigation li {
	display: block;
	margin: 20px 20px 0 0;
	padding: 0;
	float: left;
}

ul#navigation li.right 
{
	float: right;
	text-align: right;
	margin: 20px 5px 0 15px !important;
}

/* centre column */
#content {
	margin: 0 10px 0 10px;
}
#contentStretch {
	margin: 20px 0 0 10px;
}
.userStatus {
	height: 35px;
	width: 180px;
	position: absolute;
	top: 85px;
	right: 15px;
}
.userStatusStretch {
	height: 35px;
	width: 180px;
	position: absolute;
	top: 85px;
	right: 15px;
	padding-left: 5px;
	padding-top: -5px;
}
.formdisplayleft {
	float: left;
	width: 36%;
	text-align: right;
}
.formdisplayright {
	float: right;
	width: 60%;
}
div.formContainer {
	height: 1%;
	clear: both;
}
div.formRow {
	clear: both;
}
div.formRow label {
	float: left;
	width: 36%;
}
div.formRow span.formField {
	float: right;
	width: 60%;
}
div.formRow span.formField label {
	float: none;
	display: inline;
}
div.formRowDivider {
	clear: both;
	height: 20px;
}
.genericInputField, .genericTextarea, .genericSelect {
	width: 90%;
}
.rangeForm {
	margin: 0px;
}
.rightIllustration {
	float: right;
}
.leftIllustration {
	float: left;
}
.productLeft {
	float: left;
	width: 46%;
}
.productRight {
	float: right;
	width: 46%;
}
.clearBlock {
	display: block;
	clear: both;
	font-size: 1%;
	height: 6px;
}
.purchasingMatrix, .basketMatrix {
	width: 100%;
	clear: both;
}
.purchasingMatrix .desc {
	width: 60%;
}
.basketMatrix .desc {
	width: 48%;
}
.totalsMatrix {
	width: 100%;
	margin: 10px 0 10px 0;
}
.totalsMatrix td.totalLabel {
	width: 20%;
}
.totalsMatrix td.totalValue {
	width: 20%;
}

.quickOrderMatrix {
	width: 100%; 
	clear: both; 
}

.tile {
	float: left;
	width: 45%;
}
#footer {
	clear: both;
	margin: 0;
	width: 100%;
	padding: 1.5em 0px 20px 0;
	height: 30px;
}
.footerLeft {
	float: right;
	width: 90%;
}
.footerLeft a {
	color: #fff;
}
.footerRight {
	width: 10%;
}
/* left column */
.controls {
	height: 30px;
}
.productsHeader {
	margin-top: 10px;
	height: 6px;
}
#productsContent dl {
	margin: 0;
}
/* right column */
#basketControlHeader {
	height: 5px;
}
#basketControlTitle {
	height: 25px;
}
.basketControlFooter {
	height: 6px;
	margin-bottom: 10px;
}
.newProductsFooter {
	margin-bottom: 10px;
}
.bestsellersHeader {
	height: 6px;
	padding: 0;
}
.bestsellersContent dl {
	margin: 0;
}
.bestsellersFooter {
	height: 6px;
	padding: 0;
	margin: 0;
}
.bestsellersFooter img {
	height: 6px;
	padding: 0;
	margin: 0;
}
/* kludge to generic fix float problems */
.clearfix {
	display: inline-block;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
/* End hide from IE-mac */
}
@media print
{
/* header */
#contentHeader {
	display: none;
}
.printLogo {
	display: block;
}
/* left column */
#contentLeft {
	display: none;
}
/* centre column */
.userStatus {
	display: none;
}
.userStatusStretch {
	display: none;
}
#contentRight {
	display: none;
}
#footerRight {
	display: none;
}
}
