/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
.beige {color: #f1dbaa;}
.blue {color: #96d3ff;}
.brown {color: #c39464;}
.gray {color: #c4bcb5;}
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body {
	font: normal small "trebuchet ms", helvetica, arial, verdana, sans-serif;
	color: #c4bcb5;
	background: #000 url(i/main_dirt_bg.jpg) 0 0 repeat;
	margin: 0;
	padding: 0;
}

* html body {
  font-size: x-small; /* for IE5/Win */
  f\ont-size: small; /* for other IE versions */
}

div * {padding: 0; margin: 0;}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Structural and related
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#outerwrapper {
	width: 100%;
	background: transparent url(i/top_dirt_bg.jpg) 0 0 repeat-x;		
}

#innerwrapper {
	width: 970px;
	background-color: transparent;
	margin: 0 auto;		
}

#siteframe{
	width: 970px;
	background: #000 url(i/bottom_bg.jpg) bottom left no-repeat;
	margin: 0 auto;	
	padding-bottom: 15px;
}

#header {
	position: relative;
	width: 970px;
	height: 139px;
	background: transparent url(i/header_bg.jpg) 0 0 no-repeat;
}


	#header h1 a {
		display: block;
		float: left;
		width: 159px;
		height: 139px;
		background: transparent url(i/bcc_logo.jpg) 0 0 no-repeat;
		margin-left: 25px;
	}
	
		#header h1 a:hover {background-position: left bottom;}

	#navigation {
		position: absolute;
		right: 25px;
		bottom: 0;
		width: 402px;
		height: 32px;		
	}

#banner {
	width: 970px;
	height: 141px;
	background: transparent url(i/banner_bg.jpg) 0 0 no-repeat;		
}

	body#b_store #banner {
		height: 4px;
		background: transparent url(i/banner_bg-store.gif) 0 0 no-repeat;
	}

#userinfo {
	float: left;
	width: 920px;
	height: auto;
	padding: 2px 25px;
	margin-bottom: 16px;
}
	body#b_store #userinfo {margin-bottom: 0;}
	#userinfo p {
		visibility: hidden; /* ---- Remove ---- */
		float: left;
		width: 834px;
		text-align: right;
		font-size: 115%;
		margin: 0;
		padding: 4px 0 4px 0;
	}
		#userinfo p a {color: #c4bcb5;}
			#userinfo p a:hover {color: #c39464;}
				body#b_store #userinfo p a {color: #96d3ff;}
					body#b_store #userinfo p a:hover {color: #90683d;}
					
	#userinfo a.checkout_btn {
		visibility: hidden; /* ---- Remove ---- */
		display: block;
		float: right;
		width: 82px;
		height: 15px;
		background: transparent url(i/checkout_btn.gif) 0 0 no-repeat;
		margin: 7px 0 0 0;
		padding: 0;
	}
		#userinfo a:hover.checkout_btn {background-position: 0 -15px;}

#storecategories {
	width: 920px;
	float: left;
	text-align: right;
	padding: 8px 25px;
	margin-bottom: 16px;
}
	
#storecategories ul {
	width: 920px;
	list-style-type: none;
	font-size: 90%;
	margin: 0;
	padding: 0;
}
#storecategories ul li {
	display: inline;
	margin-left: 10px;
}
#storecategories ul li a {}
		#storecategories ul li a:hover {}

#contentwrap {
	width: 920px;
	background: transparent url(i/maincontent_bg.jpg) 0 0 no-repeat;
	padding: 0 25px;
}

	body#b_store #contentwrap {
		background-image: none;
	}



#maincontent {
	float: left;
	width: 448px;
	margin-right: 24px;			
}

	#introcontent {
		width: 448px;
		padding: 0;
		margin-bottom: 32px;
	}
	
#maincontent_inside {
	float: left;
	width: 671px;
	margin-right: 25px;	
}

	#introcontent_inside {
		width: 671px;
		padding: 0;
		margin-bottom: 32px;
	}


#sidebar {
	float: left;
	width: 448px;
	margin-top: 20px;
}

	#b_contact #sidebar {
		margin-top: 20px;
	}

#sidebar_inside {
	float: left;
	width: 224px;
	margin-top: 20px;
}

	a.ad_block img {border:none; margin-bottom: 12px;}

	.sideblock {
		width: 184px;
		background: #161616 url(i/sideblock.jpg) 0 0 no-repeat;
		padding: 0 14px;
		margin-bottom: 12px;
	}
		.sideblock h2 {
			display: block;
			width: 184px;
			height: 35px;
			font-size: 115%;
			padding-top: 15px;
			margin-bottom: 10px;
		}
	
		.sideblock p, .sideblock ul, .sideblock ol {font-size: 90%;}
		.sideblock p {margin: 0 0 10px 0;}
		.sideblock ul, .sideblock ol {margin: 0 14px 10px 14px; padding: 0; color: #F1DBAA; line-height: 180%;}
		/*.sideblock ol span {color:#c4bcb5;}*/
		
		.sideblock h3 {
			font-size: 100%;
			color: #f1dbaa;
			margin: 0;
		}
		
		.sideblock p {margin: 0 0 25px 0;}
		
		.float-l {float:left;}
		.float-r {float:right;}
		
		.imageframe { float: left; width: 448px; background-color: #161616; font-size: 90%;}
		.imageframe p {color: #c4bcb5; padding: 8px; margin: 0; text-align: right;}		
		a img#customer_rigs {padding: 1px; border: 1px solid #2B201A;}
		a:hover img#customer_rigs {border: 1px solid #c39464;}

#footer {
	width: 892px;
	height: 62px;
	background: transparent url(i/footer_bg.png) 0 0 no-repeat;
	clear: both;
	font-size: 90%;
	margin-top: 30px;
	padding: 5px 14px;
}
	#footer p {display: block; float: left;}
	#footer p.siteby {display: block; float: right;}
		#footer p.siteby a {color: #CFE06D;}
			#footer p.siteby a:hover {color: #C39464;}

	#footer ul {list-style-type: none; clear: both;}
		#footer ul li {display: inline;}
	

#bottomcontent {
	position: relative;
	height: 80px;
}

	#bottomcontent img {
		margin-top: 10px;
	}
	
.imagebox {background-color: #161616; margin-bottom: 16px;}
.imagebox p {color: #c4bcb5; padding: 0 8px 8px 8px; margin: 0;}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Product Display
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/


	.productbox {
		position: relative;
		width: 447px;
		height: 9em;
		margin-bottom: 40px;
	}
		.productbox a img {
			float: left;
			width: 166px;
			height: 110px;
			border: 2px solid #c4bcb5;
			background-color: #fff;
			margin-right: 14px;
		}
			.productbox a:hover img {border: 2px solid #c39464;}
		
		.productbox h3 {
			display: block;
			float: left;
			width: 262px;

			margin: 0;
			padding: 0;
		}
		
		.productbox p {
			float: left;
			width: 170px;
			height: 74px;
			font-size: 90%;
			line-height: 130%;
			margin: 0;
			padding: 5px 0 0 0;
		}
		
		.productbox a.details_btn {
			visibility: hidden; /* ---- Remove ---- */
			display: block;
			position: absolute;
			bottom: 0;
			left: 180px;
			width: 82px;
			height: 15px;
			background: #000 url(i/details_btn.gif) 0 0 no-repeat;
			margin-right: 8px;
		}
			.productbox a:hover.details_btn { background-position: 0 -15px;}
		
		.productbox a.addtocart_btn {
			visibility: hidden; /* ---- Remove ---- */
			display: block;
			position: absolute;
			bottom: 0;
			left: 270px;
			width: 82px;
			height: 15px;
			background: #000 url(i/addtocart_btn.gif) 0 0 no-repeat;
			margin-right: 8px;
		}
			.productbox a:hover.addtocart_btn { background-position: 0 -15px;}
	
	
	
		.productbox strong {
			display: block;
			float: left;
			width: 87px;
			height: 29px;
			background: #000 url(i/price_bg.jpg) 0 0 no-repeat;
			color: #F1DBAA;
			font-size: 120%;
			text-align: center;
			line-height: 90%;
			padding: 12px 0 0 0;
			margin-top: 20px;
		}
		
		.productbox strong span.nprice {
			font-size: 70%;
			text-decoration:line-through;
			color: #C4BCB5;
		}


.productscolumn1 {
	float: left;
	width: 447px;
	margin: 48px 26px 0 0;
}

.productscolumn2 {
	float: left;
	width: 447px;
	margin-top: 48px;
}

/* ~~~~~~~~~~~ Product Page ~~~~~~~~~~~~~*/


.productimage {
	float: right;
	margin: 0 0 10px 16px;
	clear: right;
}

.product_price {
	margin-top: 16px;
	font-size: 120%;
}

	.product_price strong {color: #f1dbaa;}


a.addtocart_btn_large {
			display: block;
			width: 127px;
			height: 30px;
			background: #000 url(i/addtocart_btn_large.gif) 0 0 no-repeat;
		}
	a:hover.addtocart_btn_large { background-position: 0 -30px;}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Search form (in the site header)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#searchbox {
	visibility: hidden; /* ---- Remove ---- */
	position: absolute;
	top: 20px;
	right: 25px;
	width: 186px;
	height: 45px;
}

	#searchbox form {
		width: 186px;
		height: 45px;
		margin: 0;
		padding: 0;
	}
		#searchbox form fieldset {border: none; margin: 0; padding: 0;}
		#searchbox form label {
			position: absolute;
			right: 4px;
			bottom: 0;
			width: 160px;
			height: 15px;
			color: #c4bcb5;
			font-size: 70%;
			text-align: right;
		}
		#searchbox form input#keywords {
			float: left;
			width: 151px;
			height: 24px;
			border: none;
			font: normal 120% "trebuchet ms", helvetica, arial, verdana, sans-serif;
			color: #302011;
			background: transparent url(i/search_field.gif) 0 0 no-repeat;
			padding: 2px 1px 2px 6px;
		}




/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Newsletter Form (in the site footer)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#newsletterbox {
	position: absolute;
	top: 0;
	right: 0;
	width: 500px;
	height: 70px;
}

	#newsletterbox form {
		width: 500px;
		margin: 0;
		padding: 0;
	}
		#newsletterbox form fieldset {border: none; margin: 0; padding: 0;}
		#newsletterbox form label {
			position: absolute;
			right: 240px;
			bottom: 0;
			width: 240px;
			color: #f1dbaa;
			font-size: 90%;
			line-height: 120%;
			text-align: right;
		}
		#newsletterbox form input.email_field {
			position: absolute;
			bottom: 0;
			right: 63px;
			width: 160px;
			height: 24px;
			border: none;
			font: normal 120% "trebuchet ms", helvetica, arial, verdana, sans-serif;
			color: #302011;
			background: transparent url(i/newsletter_field.gif) 0 0 no-repeat;
			padding: 2px 1px 2px 6px;
		}
		#newsletterbox form input#newsletter_btn {
			position: absolute;
			bottom: 0;
			right: 0;
			width: 63px;
			height: 28px;
		}
		
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Store Notification Form (in the site content)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#newsletterbox_content {
	position: relative;
	width: 447px;
	margin-top: 32px;
}

	#newsletterbox_content form {
		width: 447px;
		margin: 0;
		padding: 0;
	}
		#newsletterbox_content form fieldset {border: none; margin: 0; padding: 0;}
		#newsletterbox_content form label {
			display: block;
			width: 200px;
			color: #f1dbaa;
			line-height: 140%;
		}
		#newsletterbox_content form input#email_field_content {
			position: absolute;
			bottom: 0;
			right: 63px;
			width: 160px;
			height: 24px;
			border: none;
			font: normal 120% "trebuchet ms", helvetica, arial, verdana, sans-serif;
			color: #302011;
			background: transparent url(i/newsletter_field.gif) 0 0 no-repeat;
			padding: 2px 1px 2px 6px;
		}
		#newsletterbox_content form input#newsletter_btn_content {
			position: absolute;
			bottom: 0;
			right: 0;
			width: 63px;
			height: 28px;
		}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Manufacturer & Category drop-down List
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

form.product_list {
	margin: 16px 0;
	padding: 0;
}

	.product_list fieldset { border: none;}
	
	.product_list select {
		width: 184px;
		background-color: #E4E1DD;
		color: #272218;
		font-size: 90%;
		padding: 2px 0 0 0;
	}
		.product_list select option {
			padding: 2px 0 2px 0;
		}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Navigation
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/


    #navigation ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }
        #navigation ul li {
            display: block;
			float: left;
			margin-right: 4px;
        }
					#navigation ul li#n_contact {margin:0}
					
            #navigation ul li a {
				display: block;
				float: left;
				height: 32px;
            }
			
li#n_home a {background: transparent url(i/n/n_home.gif) 0 0 no-repeat; width: 58px;}
li#n_store a {background: transparent url(i/n/n_store.gif) 0 0 no-repeat; width: 61px;}
li#n_custom a {background: transparent url(i/n/n_custom.gif) 0 0 no-repeat; width: 78px;}
li#n_community a {background: transparent url(i/n/n_community.gif) 0 0 no-repeat; width: 105px;}
li#n_contact a {background: transparent url(i/n/n_contact.gif) 0 0 no-repeat; width: 84px;}

/* ------- | These styles create the "active page" navigation state | ------- */

body#b_home li#n_home a {
	background-position: bottom left;
}
body#b_store li#n_store a {
	background-position: bottom left;
}
body#b_custom li#n_custom a {
	background-position: bottom left;
}
body#b_community li#n_community a {
	background-position: bottom left;
}
body#b_contact li#n_contact a {
	background-position: bottom left;
}


/* ------- | This style creates the navigation hover state | ------- */

#navigation ul li a:hover {
	background-position: left bottom;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
   Typography
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

h1 {
		font: bold 240% "trebuchet ms", helvetica, arial, verdana, sans-serif;
		color: #f1dbaa;
		margin: 0;
		padding: 0;
}

h2 {
		font: bold 160% "trebuchet ms", helvetica, arial, verdana, sans-serif;
		color: #f1dbaa;
		padding:0;
}
	#maincontent h2 {margin: 0; padding: 10px 0;}
	#maincontent h2 + p {margin: 0 0 16px 0;}

	

h3 {
		font: bold 120% "trebuchet ms", helvetica, arial, verdana, sans-serif;
		color: #96d3ff;		
}
	#maincontent h3 {margin: 0;}
	#maincontent h3 + p {margin: 0 0 32px 0;}
	
	h3 a {text-decoration: none; border-bottom: 1px solid #96d3ff;}
	h3 a:hover {border-bottom: 1px dotted #c39464;}

h4 {
		font: bold 100% "trebuchet ms", helvetica, arial, verdana, sans-serif;
		color: #c39464;
		margin: 4px 0 0 0;
}

h5 {
		font: bold 100% "trebuchet ms", helvetica, arial, verdana, sans-serif;
		color: #c4bcb5;
		margin: 4px 0 0 0;
}

p {
		font: normal 100% "trebuchet ms", helvetica, arial, verdana, sans-serif;
		margin: 10px 0;
}

a {color: #96d3ff;}
a:visited {color: #96d3ff;}
	a:hover {color: #c39464;}
	
.beige {color: #f1dbaa;}
.blue {color: #96d3ff;}
.brown {color: #c39464;}
.gray {color: #c4bcb5;}

.big {font-size: 130%;}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Global
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/




/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Misc.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

a.addtocart_btn_large,
a.checkout_btn_big,
a.checkout_btn,
#banner,
.productbox a.details_btn,
.productbox a.addtocart_btn,
#navigation ul li a ,
#header h1 a {      /*----Add image replaced element here----*/
    letter-spacing: -1000em;
    text-indent: -999em;
    overflow: hidden;
}


.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

 
 div.clearer {clear: left; line-height: 0; height: 0;}
 
 
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Flickr thumbnails
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
 
#flickr img {
	float:left;
	margin:0 0px 8px 8px;
	background: #161616;
	padding:4px;
	border: 1px solid #c4bcb5;
	width:62px;
	height:62px;
}

		#flickr a:hover img {border: 1px solid #c39464;}
		
		



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Shopping Cart
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/



#cart_details {
	margin-bottom: 16px;
}

table.cart td img {
	vertical-align:top;
}

table.cart tfoot td ul {
	list-style:none;
	margin: 0;
	padding: 0;
	
}

table.cart tfoot td ul li {
	border-bottom: 1px solid #645d56;
	margin-bottom: 4px;
}

table.cart tfoot td ul li.total {font-size: 120%;color:#F1DBAA; margin-top: 16px;}

td.total {
	text-align:right;
	width: 15%;
}

span.error {
	border: 1px solid red;
	background-color: #FFCCCC;
	color: #000;
	display:block;
	padding: 8px;
	margin: 8px 0;
}

a.checkout {
	float:right;
	padding:0.7em 2em;
	margin:2em 0;
}

table {
	margin-top: 16px;
	width: 100%;
}

td, th {
	padding: 8px;
	vertical-align:top;
}

th {
	color: #F1DBAA;
	background-color: #291E18;
	text-align:left;
	font-size: 130%;
	border-bottom: 2px dotted #966E54;
}

td {
	background-color: #161616;
	border: 2px solid #000;
}

.hidden_td {background-color: transparent; border: none;}


	a.checkout_btn_big {
		display: block;
		float: right;
		width: 114px;
		height: 40px;
		background: transparent url(i/checkout_btn_big.gif) 0 0 no-repeat;
		margin: 8px 0;
		padding: 0;
	}
		a:hover.checkout_btn_big {background-position: 0 -40px;}

.ProductCartNote
{
	color: #F1DBAA;
	position: absolute;
	bottom: -10px;
	display: none;
	left: 270px;
	margin-right: 8px;
}