* {font-size: 100%; padding: 0; margin: 0;}
body {
	color: #000;
	background: #080808 url(../images/bg-top-page.gif) 0 0 repeat-x ;
	font: 75% "Arial", sans-serif; 
	margin: 0; 
	padding: 0;
 }
img, a img {
	border: 0px;
}
a, a:link, a:visited{
	color: #cb1306;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	color: #b5b5b5
}
p{

	line-height: 1.3em;
	margin: 1.2em 0em 1.2em 0em;

	}
li > p {
	margin-top: 0.2em;
	}
pre {/*moz 1.0/1.1/1.2.1, net 7.0/7.01 make this way too small, but i'm not going to go larger because monospace tends to run you into overflow pretty quick. prior moz and net are okay.*/
	font-family: monospace;
	font-size: 1.0em;
	}
strong, b {
	font-weight: bold;
	}
	
form, table, tr, th, td, fieldset{
	margin: 0;
	padding: 0;
	text-align:left

}
ol, ul, li {

	line-height: 1.8em;
	margin-top: 0.2em;
	margin-bottom: 0.1em; 
}
h1 {
	font-size: 2.15em;
	font-weight: normal;
	margin-top: 0em;
	margin-bottom: 0em;/*both set to zero and padding in header div is used intead to deal with compound ie pc problems that are beyound summary in a simple comment.*/
	}
h2 {font-size: 1.80em;}
h3 {font-size: 1.4em;}
h4 {font-size: 1.2em;}
h5 {font-size: 1.1em;}
h6 {font-size: 1.0em;}
h2, h3{	
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
}
h4, h5, h6{
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
}
/* Styles for Accessibility and SEO */
#tools .search-wrapper label, .structural, #access, #browserSupport, .accessible, hr, caption, #latest .prev, #latest .next{
	position:absolute;
	left: -5000px;
	width: 4000px
}
ol li,
ul li{
	list-style-position: inside
}
/* ------------------------------------
    COMMON ELEMENTS
--------------------------------- */

/* Clearfix */
#header:after,
#nav-primary:after,
#content .panel .set:after,
#content .layout-2col:after,
#content .layout-1col:after,
.list:after,
.post-body:after,
#footer .tweetarea:after,
#footer .internal:after,
.filter:after,
.wheelform:after,
.column2 .promo:after,
#footer .internal .legal:after,
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

#header,
#content .panel .set{
    height: 1%;
}
#header #tools li a,
#header #logo,
#content .latest a.more,
#slides .next,
#slides .prev,
.more-wheels,
.moreinfo,
#footer .social a,
#latest .slide a,
#banner .pagination a,
#footer .internal .friend-form a,
#footer .jch a,
.facebook a,
#latest .pagination a
{
	height: 1px;
	display:block;
	overflow:hidden;
}
/* ------------------------------------
   HEADER
--------------------------------- */
#header{
	width: 975px;
	margin: 0px auto;
	background:  url(../images/bg-header.jpg) 0 3.0em no-repeat;
	position: relative;
	height: 155px
	
}
#header #tools{
	padding: 0px;
	margin: 0;
	float: right
	 	
}
#header #tools li{
	padding: 0px;
	margin: .5em 0 0 .4em;
	float: left;
	list-style: none
}
#header #tools li.search{
	padding: 0px;
 	margin: .3em 0 0 .4em;
}
#header #tools li.contact a{
	background:url(../images/btn-contact.gif) 0 0 no-repeat;
	padding-top: 16px;
	width: 75px
}
#header #tools li.home a{
	background:url(../images/btn-home.gif) 0 0 no-repeat;
	padding-top: 16px;
	width: 46px
}
#header #tools li.facebook a{
	background: url(../images/btn-facebook.gif) 0 0 no-repeat;	
	width: 20px;
	padding-top: 18px;
}
#header #tools li.facebook a:hover{
	background-position: 0 -19px
}
#header #tools li.facebook{
	margin-top: .4em	
}
#header #tools li.text-sm a{
	background:url(../images/btn-text-standard.gif) 0 0 no-repeat;
	padding-top: 16px;
	width: 19px
}
#header #tools li.text-lge a{
	background:url(../images/btn-text-large.gif) 0 0 no-repeat;
	padding-top: 16px;
	width: 19px
}
#header #tools li a:hover
{
	background-position: 0px -16px	
}
#header #tools .search-wrapper{
	background:url(../images/bg-search.gif) 0 0 no-repeat;
	padding-left: 8px;
	width: 180px;
	height: 22px;
	position: relative

}
#header #tools .search-wrapper #CAT_Search{
	border: 0;
	background: none;
	color: #9d9d9d;	
	height: 15px;
	width: 116px;
	font-size: 1.0em; 	
	float:left;
	margin: .1em .5em 0 0
}
#header #tools .search-wrapper .submit{
	background:url(../images/btnsearch.png) 0 0 no-repeat;
	border: 0px;
	cursor:pointer;
	width: 55px;
	height: 17px;
	margin-top: 2px;
	padding-top: 17px;
	overflow:hidden;
	position: absolute;
	
}
#header #logo {
	position: absolute;
	background:url(../images/logo-versus.png) 0 0 no-repeat;
	width: 342px;
	padding-top: 120px;
	top: 31px;
	display: block
}
#header .phone{
	position: absolute;
	right: 0.3em;
	top: 6.0em;
	color: #FFF;
}
#header .phone h2{
	font-size: 1.8em;
	padding: 0;
	margin: 0
}
#header .phone span{
	color: #b20303;
	font-size: 1.2em
}
#header .phone em{
	top: 0px;
	padding: 0;
	font-style:normal;
	margin: 0 .3em 0 0;
	float: right;
	font-size: 0.88em	
}
/* ------------------------------------
   NAVIGATION
--------------------------------- */

#nav-primary{
	background:  url(../images/bg-nav.gif) 0 0 repeat-x;
}
#nav-primary .frame{
	margin: 0 auto;
	width: 990px;
	position: relative	
}
#nav-primary ul{
	padding: 0;
	margin: 0px;

}
#nav-primary ul li{
	padding: 1.1em 1.9em 1.1em 1.9em;
	margin: ;
	list-style:none;	
	float: left;
	background: url(../images/nav-divider.gif) 100% 50% no-repeat
}
#nav-primary ul li a{
	text-transform: uppercase;
	color: #FFF;
	font-size: 1.0em
}

/* ------------------------------------
   CONTENT 
--------------------------------- */
#content{
	background: url(../images/bg-content.jpg) 50% 0% no-repeat
}
#latest{
	width: 964px;
	height: 302px;
	margin: .5em auto;
	background: url(../images/bg-promo.png) .3em .4em no-repeat;
	position: relative;
}
#latest .slides_container {
	width:964px;
	overflow:hidden;
	position:relative;
	padding:0;
	height: 302px
}
#latest .border{
	background: url(../images/promo-frame.png) 0 0 no-repeat;
	width: 962px;
	height: 302px;
	position:absolute;
	top: 0;
	z-index: 100;
	left: 0
}
#latest  #slides{
	position: relative;
	height:302px;
	width:964px; 
}
#latest img{
	margin: .2em .2em	
}
#latest .slide a{
	position: absolute;
	right: 20px;
	bottom: 14px;
	width: 129px;
	z-index: 50;
	padding-top: 33px;
	background: url(../images/btn-findout.png) 0 0 no-repeat;
}
#latest .slide a:hover{
	background-position: 0 -33px
}

#content .panel{
	width: 960px;
	margin: 0 auto 0 auto;
	background: url(../images/heading-panel-l.png) 0 0 no-repeat;
}
#content .panel.wheels{
	width: 930px;
	margin: 0;
	background: url(../images/panel-wheels.png) 0 0 no-repeat;
}
#content .panel h3{
	color: #fff;
	text-transform:uppercase;
	letter-spacing: -.06em;
	padding: 1.0em .8em ; 
	margin: 0
}
#content .panel h3 em{
	color: #b20303;
	font-style:normal		
}
#content .panel .set{
	background: url(../images/bg-feature.gif) 0 0 repeat-x;
	padding: 1.0em 0 1.0em .1em;
}
#content .panel .feature{
	width: 298px;
	height: 170px;
	position:relative;
	float: left;
	margin: 0 .8em
}
#content .panel .feature .frame{
	background: url(../images/feature-panel.png) 0 0 no-repeat;
	width: 298px;
	position: absolute;
	top: 0;
	height: 170px;
	left: 0
}
#content .panel .feature h4{
	color: #FFF	;
	position: absolute;
	text-transform:uppercase;
	letter-spacing: -.03em;
	left: .8em;
	font-weight: normal;
	top: 8.1em;
}
#content .panel .feature h4 a{
	width: 275px;
	display: block;	
	color: #FFF;
	height: 23px;
	padding-top: 3px;
	background: url(../images/arrow-more.png) 100% 0 no-repeat;
}
#content .panel .feature h4 a:hover{
	background-position: 100% -26px ;
	color : #5a5a5a;
	text-decoration: none	
}

#content .layout-2col .column2 .panel{
	background: url(../images/bg-latest-wheel.png) 0 0 no-repeat;
	width: 305px
}
#content .layout-2col .column1 .panel{
	background: url(../images/bg-welcome.png) 0 0 no-repeat;
	width: 610px;
	color: #FFF;
}
#content .layout-2col .column1 .panel p{
	color: #FFF;
	padding: .8em 1.0em .5em 1.0em;
	margin: 0	
}
#content .moreinfo{
	background: url(../images/btn-findoutmore.gif) 0 0 no-repeat;
	width:  111px;
	padding-top: 24px;
	display:block;
	float: right;
	margin: .5em 1.0em
}
#content .moreinfo:hover{
	background-position: 0 -24px	
}
#content .layout-2col{
	color: #FFF	
}
#content .panel h3.pg-title{

	color: #fff;
	text-transform:uppercase;
	letter-spacing: -.06em;
	padding: 1.1em .9em ; 
	margin: 0
}
#content .column1 h4{
	margin: .5em 1.0em .5em .7em;
	padding-bottom: .5em;
	border-bottom: 1px solid #b20303;
}
#content ol,
#content ul{
	padding-left: 1.0em
}
/* ------------------------------------
   LAYOUT 
--------------------------------- */
.slides_container {
	width:285px;
	overflow:hidden;
	position:relative;
	padding-left: 10px
}
#banner{
	position: relative	
}
#banner .slides_container {
	width:930px;
	overflow:hidden;
	position:relative;
	padding:0;
	height: 189px
}
/*
	Each slide
	Important:
	Set the width of your slides
	If height not specified height will be set by the slide content
	Set to display block
*/
#slides{
	position: relative;
	height:185px;
	width:290px;
}
#latestwheels{
	position: relative;
	height:205px;
	width:290px;
	display: none;
	margin-left: 5px;
}
.latest-container{
	padding-bottom: 36px;
    position: relative;
}
#latestwheels img{
 	margin-left: 0;
    margin-top: -30px;
    width: 310px;

}
.tweetarea{
display: none;	
}
#banner #slides{
	position: relative;
	height:185px;
	width:930px; 
	overflow: hidden;
}

#banner .pagination,
#latest .pagination {
	display:block;
	position:absolute;
	bottom: -1px;
	z-index: 999;
	width:102px;
	left: 373px;
	padding: 2px 8px;
	height: 12px; 
	background: url(../images/bg-pagination.png) 0 0 no-repeat
}
#latest .pagination {
	left: 428px;
}
#banner .pagination li,
#latest .pagination li{
	list-style: none;
	float: left;
	padding: 2px 2px;
	margin: 0	
}
#banner .pagination li a,
#latest .pagination li a{
	background: url(../images/pagination.png) 0 0 no-repeat;
	width: 10px;
	padding-top: 9px
	
}
#banner .pagination li.current a,
#latest .pagination li.current a{
background-position: 0 -10px
	
}

.slides_container a {
	height:240px;
	width: 290px;
	display:block;
	padding: 0px 10px;
	overflow: hidden;
	margin: -90px 0

}
.slides_container a img{
margin-left: -80px;
}


/*
	Next/prev buttons
*/

#slides .next,#slides .prev {
	position:absolute;
	bottom: .2em;
	left: 0;
	width:19px;
	padding-top: 18px;
	display:block;
	z-index: 101
}
#slides .next img,#slides .prev img{
	display: none
}
#slides .next {
	background: url(../images/arrow-next.gif) 0 0 no-repeat;
	left: 2.5em	;
	text-decoration: none
}
#slides .prev {
	background: url(../images/arrow-prev.gif) 0 0 no-repeat;
	left: .7em;

}
#slides .next:hover ,#slides .prev:hover{
	background-position: 0 -18px	
}
/*Pagination*/
.pagination {
	display:none
}
.more-wheels {
	background: url(../images/btn-morewheels.gif) 0 0 no-repeat;
	width:  108px;
	padding-top: 24px;
	display:block;
	right: 0;
	bottom: 0;
	position:absolute
}
.more-wheels:hover{
	background-position: 0 -24px	
}
/* ------------------------------------
   LAYOUT 
--------------------------------- */

#content .layout-2col,
#content .layout-1col{
	width: 944px;
	margin: 0 auto;
	border-right: 1px solid #111111;	
	border-left: 1px solid #111111;
	background: #080808;
	padding: 0em 0 1.0em 1.0em;
}
#content .layout-2col .column1{
	width: 610px;
	float:left
}
#content .layout-2col .column2{
	width: 305px;
	margin-left: 15px;
	float:left
}
/* ------------------------------------
   FOOTER 
--------------------------------- */
#footer{
	display: block;
	background: url(../images/bg-footer.gif) 0 0 repeat-x;
	padding-top: 25px	
}
#footer .internal{
	display: block;
	width: 955px;
	margin: 0 auto;
	padding-bottom: 30px;
	position: relative
}
#footer .tweetarea{

	display: none;
	clear: both;
	border-bottom: 1px solid #151515;
    padding-bottom: 1.5em;	
}
#footer .tweetarea .details{
   float: left;
   width: 205px;
   padding-right: 21px;	
}
#footer .tweetarea .details h3,
#footer .internal .friend-form h3,
#footer .contact h3,
#footer .social h3{
	text-transform:uppercase;
	color: #FFF;
	padding: 0;
	margin: 0
}
#footer .tweetarea .details h3 em,
#footer .internal .friend-form em,
#footer .social em,
#footer .contact em{
  color: #B20303;
  font-style: normal 	
}
#footer .tweetarea .details p{
	margin: 0;
	padding: 0;
	color: #CCC
}
#footer .tweetarea .twitter{
	background: url(../images/bg-tweet.gif) 0 0 no-repeat;
	width: 729px;
	height: 60px;
	float: left
	
}
#footer .tweet{
   padding-left: 6.5em;
    padding-top: 1.5em;
	color: #5D5A5A
}
#footer .tweet ul,
#footer .tweet li{
	padding: 0;
	line-height: normal;
	margin: 0;
	list-style: none	
}
#footer .contact{
    border-right: 1px solid #151515;
    float: left;
    height: 108px;
    margin-right: 3em;
    margin-top: 1.0em;
    padding-top: 0.6em;
    width: 240px;
}
#footer .contact p{
	padding: .6em 0 0 0;
	margin: 0;
	color: #5d5a5a;
}
#footer .contact span{
	padding-right: .4em	
}
#footer .social{
	width: 195px;
	float: left;
	padding-top: .6em;
	margin-top: 1.0em	
}
#footer .social p{
	padding: .6em 0 0 0 ;
	margin: 0;	
	color: #5d5a5a;
}
#footer .social ul,
#footer .social li{
	padding: 0;
	margin: 0
}
#footer .social li{
	float: left;
	margin-right: 1.1em;
	line-height: normal	
}
#footer .social a[href*='twitter']{
	width: 	33px;
	padding-top: 33px;
	background: url(../images/icon-twitter.gif) 0 0 no-repeat 
}
#footer .social a[href*='facebook']{
	width: 	33px;
	padding-top: 33px;
	background: url(../images/icon-facebook.gif) 0 0 no-repeat 
	
}
#footer .social .rss a{
	width: 	33px;
	padding-top: 33px;
	background: url(../images/icon-rss.gif) 0 0 no-repeat 
}
#footer .social .share a{
	width: 	33px;
	padding-top: 33px;
	background: url(../images/icon-share.gif) 0 0 no-repeat 
	
}
#footer .social a:hover{
	background-position: 0 -34px	
}
#footer .internal img{
	padding-top: 0.5em;
	float:left;	
	margin-right: 1.0em
}
#footer .internal .legal{
	float: left;
	width: 160px;

}
#footer .internal .legal p{
	color: #FFF;
	padding: 2.4em 0 0 1.0em;
	margin: 0
}
#footer .internal .legal .copyright{
	color: #FFF;
	padding: .4em 0 0 1.0em;
	margin: 0;
	font-size: .8em
}
#footer .internal .legal span{
	color: #5d5a5a;
	font-size: .8em
}
#footer .base ul{
	padding: 1.0em 0 0 0;
	margin: 0;
	float: right
}
#footer .base ul li{
	padding: 0 .8em 0 .8em ;
	margin: 0;
	float: left;
	font-size: .9em;
	list-style: none;
	border-right: 1px solid #151515
}
#footer .base ul li.last-child{
	padding-right: 0;
	border: 0	
}
#footer .base ul li a,
#footer .base ul li {
	color: #5d5a5a;
}
#footer .internal .friend-form{
    float: left;
    margin-left: 1em;
    padding: 0.6em;
    position: relative;
    width: 254px;
    border-right: 1px solid #151515;
    margin-right: 3.0em;
    margin-top: 1.0em;
}
#footer .internal .friend-form h4,
#footer .internal .friend-form p{
	color: #FFF;
	padding: 0;
	margin: 0
}
#footer .internal .friend-form p{
	color: #5d5a5a;
	padding: .6em 0 0 0
}
#footer .base {
	border-bottom: 1px solid #151515;
	display: block ;
	clear:both;
	height: 40px;
	position: relative
}
#footer .base p{
	padding: 0;
	margin: 0;
	color: #5d5a5a
}
#footer .internal .friend-form a{
	background:url(../images/btn-send.gif) 0 0 no-repeat;
	width: 196px;
	padding-top: 23px;
	display: block;
	margin-top: 1.0em
	
}
#footer .internal .friend-form a:hover{
	background-position: 0 -24px		
}
#footer .jch{
	position: absolute;
	bottom: .7em;
	right: 1.0em;
	color: #5d5a5a;
	width: 130px;
	line-height: 26px; 	
	font-size: .9em
}
#footer .jch a{
	width: 43px;
	float:right;
	padding-top: 26px;
	background: url(../images/jchlogo.gif) 0 0 no-repeat
}
#footer .like{
	position: absolute;
	top: .7em;
	left:1.0em;

}
/* ------------------------------------
   CONTACT FORM 
--------------------------------- */
.contactform{
	padding: 0;
	margin: 0px;
	border: 0px;
	background: none
}
.contactform p{
	margin-bottom: 1.5em !important
}
.contactform li{
	padding: 5px 0px 0px 14px ;
	margin: 0px;
	list-style: none;
	display: block;
	clear: both
}
.contactform li label{
	width: 180px;
	float: left;
	color: #d3d3d3;
	padding-right: 10px;
	padding-top: 9px;
}
.contactform li input,
.contactform li textarea,
.contactform li select
{
	border: 1px solid #282828;
	background: #121212;
	color: #FFF;
	font: Arial;
}
.contactform li input
{
	height: 36px;
    padding: 0 5px;
    width: 350px;
}
.contactform li select{
	padding: 5px
}
.contactform li textarea{
	width: 359px
}
.contactform li span
{
	color: #FFF;
}
.sub_button{
	background: #b90000;
	border: 1px solid #8b0000;
	color: #FFF;
	padding: 2px 10px 2px 10px;
	float:right;
	margin: 0 72px 15px 0
}
.contactform li.preferred input
{
	height: auto;
	width: auto;
	vertical-align: bottom;
	background: none;
	border: 0px
}
.contactform .req{
	color: #da0000
}
.contactform .checkbox{
	width: auto;
	border: 0;
	margin: .2em 0 0 0;
	float: left
}
.contactform ul li ul{
	padding: 0 0 .9em 0;
	margin:  0 0 .9em 0
}
.contactform ul li ul li{
	padding: 0;
	margin: 0;
	float: left !important;
	width: 150px;
	clear: none !important
}
.contactform ul li ul li label{
	float: left;
	width: 50px;
	font-weight: normal;
	margin: 0 .7em;
}
.contactform ul li .captcha{
	display: block;
	padding-top: 8px

}
.captcha input.cat_textbox{
	margin-top: 10px;
}
.panel.contact p{
	padding: 0;
	margin: .4em 0 0 1.2em;
}
.panel.contact span{
	 width: 70px;
	font-weight: bold;
	color : #5a5a5a;
	display: inline-block
}

.contactform.friend h2{
	color: #FFF;
	padding: .5em 0 .5em .7em;
	margin: 0;	
	font-size: 1.4em
}
.contactform.friend h4{
	color: #FFF;
	padding: .5em 0 0 .9em;
	margin: 0;	
	font-size: 1.1em
}
.contactform.friend{
	color: #FFF	
}
.contactform.friend .checkout label{
	width: 50px;	
}
.list{
	display: block;
	width: 927px;
	padding-left: 5px

}
.contactform.friend label{
	width: 200px;	
}
.contactform.friend .cat_listbox{
	height: 50px ;	
}
.contactform.friend .captchaimg img{
	float: left;
	margin-right: 1.0em 	
}
.contactform.friend li.captcha{
	height: 60px	
}
.contactform.friend .sub_button{
	float: none;
	margin: 1.0em 1.2em;	
}
.contactform.friend .sub_buttonx{
	display: none	
}
.list li{
	float: left;
	margin-right: 25px;
	margin-bottom: .7em;
	border: 1px solid #666666;
    list-style: none outside none;
    padding: 0;
    width: 204px;	
    min-height: 240px;
}
.list li img{
	margin: 2px;
	padding: 0;
	display: block;

}
.list li h4{
	background: url(../images/bg-wheel-list.gif) 100% 100% repeat-x;
	margin: 1px 2px 2px 2px !important;
	padding: .5em .2em .5em .5em !important;
	font-size: 11px !important;
	font-weight: normal !important; 
	border-top: 1px solid #b20303;	
	border-bottom: 0 !important
}
.list li h4 a{
	color: #FFF;

}
.list li a{
		display:block;
		padding: 0;
		margin: 0;

}
.filtertxt{
	text-transform:uppercase;
	font-weight: bold; 
	color: #CCC
}
.filtertxt ul li{
	text-transform: none;
	font-weight: normal;
	margin-left: -3px !important
}
.filter {
  text-align: center;
  background: url(../images/bg-filter.gif) repeat-x 0 0;
  padding: 6px 40px 5px;
  font-size: 12px;
}


.filter ul {
  margin-right: 0;
  margin-top: 0;
}

.filter > li {
  padding-left: 8px;
}

.filter > li ul {
  margin-left: 8px;
}

.filter ul li a {
  border-bottom: 0;
  position: static;
}

.filter li,
.filter ul,
.filter ul li a  {
  display: inline;
  display: inline-block;
  line-height: 1;
}

.filter ul,
.filter ul li,
.filter ul li a {
  background-image: url(../images/buttons.png);
  background-repeat: no-repeat;
}

.filter ul {
  background-position: 0 -137px;
  background-repeat: repeat-x;
}

.filter ul li {
  margin-left: 1px;
}

.filter ul li:first-child {
  margin-left: 0;
}

.filter ul li a {
  padding: 5px 8px 6px;
  color: #8b8b8b;
  text-shadow: rgba(255, 255, 255, 0.1) 0 1px 0;
  text-decoration: none;
}
.filter ul li.segment-0{
  background-position: 0px -92px;	
}
.filter ul li.segment-1,
.filter ul li.segment-2 {
  background-position: -3px -92px;
}
.filter ul li.segment-3 {
  background-position: 100% -115px;
}
.filter ul li.segment-0 a{
  background-position: 0 -161px;
}
.filter ul li.segment-1 a,
.filter ul li.segment-2 a,
.filter ul li.segment-3 a {
  background-position: 0 -161px;

}
.filter ul li.segment-2 a {
  background-position: 100% -115px;
}
.filter ul li.selected-0 a,
.filter ul li.selected-1 a,
.filter ul li.selected-2 a,
.filter ul li.selected-3 a {
  color: #fff;
  text-shadow: rgba(0, 0, 0, 0.25) 0 1px 0;
}

.filter ul li.selected-0{
  background-position: 0 0px;
}

.filter ul li.selected-0 a {
  background-position: 100% -46px;
}

.filter ul li.selected-1 a,
.filter ul li.selected-2 a{
  background-position: -3px 0;
}
.filter ul li.selected-3{
	background: none	
}
.filter ul li.selected-3 a   {
  background-position: 100% -69px;
}

/*-- BANNER --*/
#banner {
	margin-bottom: 1.0em
}
/*-- WHEEL DETAIL --*/
.wheel-detail {
	display: block;
	padding-top: 1.0em;
}
.wheel-detail #gallery{
	float: left;
	width: 404px; 

}
.wheel-detail .image img{
	display: block;
	border: 1px solid #666;	
}
.wheel-detail .detail{
	float: left;
	width: 490px;
	margin-left: 20px
}
.wheel-detail .detail table{
	color: #FFF;
	width: 490px;	
}

.wheel-detail .detail th{
	font-weight: bold;
	text-align:center;
  background: url(../images/bg-filter.gif) repeat-x 0 0;
  padding: .4em .4em .4em 0;
  border-bottom: 1px solid #666
}

.wheel-detail .detail td{
  text-align: center;
  padding: .4em .4em .4em 0;
  border-bottom: 1px solid #666
}
.wheel-detail .detail .size{
	width: 80px
}
.wheel-detail .detail .pcd
{
	width: 80px
}
.wheel-detail .detail .offset
{
	width: 70px;
}
.wheel-detail .detail .bore
{
	width: 110px
}

.wheel-detail #gallery ul {
	padding: 0;
	margin: .5em 0 0 0;	
}
.wheel-detail #gallery ul li{
	list-style: none;
	margin: 0;
	float: left;
	padding: 0 .5em 0 0	
}
.wheel-detail #gallery ul li img{
	padding: 0px;
	display: block;
	border: 1px solid #666;
	width: 100px;
	cursor: pointer	
}
.wheel-detail .detail{
	color: #FFF
}
.wheel-detail .detail h2{
	margin: 0;
	padding: 0 0 .5em 0
}
.wheel-detail .detail .model,
.wheel-detail .detail .colour{
	padding: 0;
	margin: 0	
}
.wheel-detail .detail .model span,
.wheel-detail .detail .colour span{
	color : #666	;
	font-weight: bold;
}
/*-- BLOG LISTING --*/
.blog-post{
	
	padding: .5em 1.0em 0 1.0em;
	margin: 0
}
.blog-container{
	
	padding: 0;
	margin: 0
}
.blog-post h2,
.post-details h2{
	padding: 0;
	margin: 0;
	color: #FFF;
	border: 0 !important
}

.blog-post h2 a{
	#FFF
}
.blog-post .post-date,
.post-details .post-date{
	color : #666;
	font-size: .9em;
	margin-top: -2px;
}
.blog-post .post-body{
	padding: 0 0 1.0em 0!important;
	margin: 0 0 .8em 0 !important;
	background: url(../images/bg-line.gif) 0 100% repeat-x;
}
.post-body p{
	padding: 0 0 1.0em 0 !important;
	margin: 0 !important;
}
.side-panel .BlogRecentPost,
.BlogTagCloud,
.BlogPostArchive {
	display: block;
	clear: both;
	min-height: 30px;	
	padding-top: 30px;	
	background: url(../images/service-line2.gif) 50% 100% no-repeat;
}
.side-panel h4{
	font-size: 1.2em;
	font-weight: normal; 
	margin-top: 10px !important;
	padding-bottom: .5em;
	border-bottom: 1px solid #353534!important
}
.BlogRecentPost,
.BlogTagCloud,
.BlogTagList,
.BlogPostArchive
{
	padding: 5px 0px 10px 0px !important;
	margin: 0px ;
}
.side-panel ul li{
	background: url(../images/blog-arrow.gif) 3px 5px no-repeat;
	line-height: 12px;
	font-size: 1.0em;
	padding: 2px 0px 2px 17px !important
}
.BlogTagCloud{
	padding-left: 17px !important	
}
.BlogTagList{
	display: none	
}
.post-list #catblogoutput ul,
.post-list #catblogoutput ul li{
	padding: 0px;
	margin: 0px ;	
	list-style: none
}
.post-list .postTitle a{
	text-decoration:none;
	color: #FFF		
}
.BlogTagCloud-XX-Small{
	font-size: 1.0em;
}
.BlogTagCloud-Small{
	font-size: 1.2em;
}
.BlogTagCloud-Medium{
	font-size: 1.6em;
	color: #ccc !important
}
.BlogTagCloud-Large{
	font-size: 1.9em;
}


/*--SIDE PANEL--*/
.column2 .promo {
	display: block;
	width: 	298px;
	position: relative;
	background: url(../images/bg-side-promo.png) 0 0 no-repeat;
	height: 151px;
	margin-bottom: 15px

}
.column2 .promo .frame {
	position: absolute;
	z-index: 3;
	width: 286px;
	height: 101px;
	background: url(../images/bg-side-promo-frame.png) 0 0 no-repeat;
	top: 7px;
	left: 6px;
}
.column2 .promo img{
	display: block;
	padding: 9px 8px	
}
.column2 .promo.dealer .frame {
	position: absolute;
	z-index: 3;
	width: 299px;
	height: 152px;
	background: none;

	top: 0px;
	left: 0px;
}
.column2 .promo h4{
	color: #FFF	;
	position: absolute;
	text-transform:uppercase;
	letter-spacing: -.03em;
	left: .8em;
	font-weight: normal;
	top: 6.9em;
	z-index: 5
}
.column2 .promo h4 a{
	width: 275px;
	display: block;	
	color: #FFF;
	height: 23px;
	padding-top: 3px;
	cursor: pointer;
	background: url(../images/arrow-more.png) 100% 0 no-repeat;
}
.column2 .promo h4 a:hover{
	background-position: 100% -26px ;
	color : #5a5a5a;
	text-decoration: none	
}
.column2 .promo.dealer img{
	display: block;
	padding: 0	
}
/*-- SEARCH RESULTS --*/

.search-results h4 a{
	color: #FFF	
}



/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
	font: 12px Arial, Helvetica, sans-serif;
	color: #333333;
}

#TB_secondLine {
	font: 10px Arial, Helvetica, sans-serif;
	color:#666666;
}

#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
	position: fixed;
	z-index:999;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
	position: fixed;
	background: #000;
	z-index: 999;
	color:#fff;
	display:none;
	border: 2px solid #525252;
	text-align:left;
	top:50%;
	left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
}

#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
	color: #666666
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#000;
	height:27px;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:103;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
}
.photogalleryItem img{
	border: 1px solid #FFF	
}





/*

Wheel Filter

*/
.wheelform{
	padding: 0;
	margin: 0;
	background: url("../images/bg-filter.gif") repeat-x scroll 0 0 transparent	
}
.wheelform li{
	margin: 10px 0;
    padding: 0 19px 0 10px;
	float: left;
	list-style: none;
	background: url(../images/bg-dd.png) 5px 0 no-repeat	
}
.wheelform label{
	color: #b6b6b6	; 
	display: block;
	clear: both;
	padding-left: 6px
}

/* Global Declaration */

div.selector, 
div.selector span{
  background-image: url(../images/sprite-agent.png);
  background-repeat: no-repeat;
}

.selector, 
.selector *{
	margin: 0;
	padding: 0;
}

/* SPRITES */

/* Select */

div.selector {
  background-position: -483px -160px;
  line-height: 32px;
	height: 32px;
}

div.selector span {
  background-position: right 0px;
  height: 32px;
	line-height: 32px;
}

div.selector select {
  /* change these to adjust positioning of select element */
  	top: 8px;
	left: 5px;
	background: #545454;
	color: #FFF
}

div.selector:active, 
div.selector.active {
	background-position: -483px -192px;
}

div.selector:active span, 
div.selector.active span {
	background-position: right -32px;
}

div.selector.focus, div.selector.hover, div.selector:hover {
	background-position: -483px -224px;
}

div.selector.focus span, div.selector.hover span, div.selector:hover span {
	background-position: right -64px;
}

div.selector.focus:active,
div.selector.focus.active,
div.selector:hover:active,
div.selector.active:hover {
	background-position: -483px -256px;
}

div.selector.focus:active span,
div.selector:hover:active span,
div.selector.active:hover span,
div.selector.focus.active span {
	background-position: right -96px;
}

div.selector.disabled,
div.selector.disabled:active,
div.selector.disabled.active {
	background-position: -483px -288px;
}

div.selector.disabled span,
div.selector.disabled:active span,
div.selector.disabled.active span {
  background-position: right -128px;
}



/* PRESENTATION */

/* Select */
div.selector {
  width: 190px;
  color: #464545;
  font-weight: bold
}

div.selector select {
  width: 190px;
	font-size: 1em;
	border: solid 1px #fff;
}

div.selector span {
  padding: 0px 25px 0px 2px;
  cursor: pointer;
}

div.selector span {
  color: #ffffff;
  width: 158px;
  text-shadow: rgba(0,0,0,0.5) 0px -1px 0px;
}

div.selector.disabled span {
	color: #bbb;
}

/*

CORE FUNCTIONALITY 

Not advised to edit stuff below this line
-----------------------------------------------------
*/

.selector select:focus, .radio input:focus, .checker input:focus, uploader input:focus {
  outline: 0;
}

/* Select */

 div.selector {
	position: relative;
	padding-left: 10px;
	float:left
}

 div.selector span {
	display: block;
	float: left;
}

 div.selector select {
	position: absolute;
	opacity: 0;
}

/* checker */

 div.checker {
	position: relative;
	float: left;
}

 div.checker span {
	display: block;
	float: left;
	text-align: center;
}

div.checker input {
  opacity: 0;
  display: inline-block;
}

/* radio */

div.radio {
	position: relative;
	float: left;
}

div.radio span {
	display: block;
	float: left;
	text-align: center;
}

 div.radio input {
  opacity: 0;
  text-align: center;
  display: inline-block;
}

/* uploader */

div.uploader {
  position: relative;
  float: left;
  overflow: hidden;
}

div.uploader span.action {
  float: left;
  display: inline;
  padding: 4px 0px;
  overflow: hidden;
  cursor: pointer;
}

div.uploader span.filename {
  padding: 0px 10px;
  float: left;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

div.uploader input {
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  float: right;
}

/* Start: Recommended Isotope styles */

/**** Isotope Filtering ****/

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/* End: Recommended Isotope styles */



/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
  -webkit-transition: none;
     -moz-transition: none;
      -ms-transition: none;
       -o-transition: none;
          transition: none;
}




#container {
  margin-bottom: 20px;
  padding: 10px 0 0 0;
  margin-left: 5px;
}

.element {
  width: 110px;
  height: 110px;
  margin: 0;
  float: left;
  overflow: hidden;
  position: relative;
  background: #888;
  color: #222;
  -webkit-border-top-right-radius: 1.2em;
      -moz-border-radius-topright: 1.2em;
          border-top-right-radius: 1.2em;
}

.element.alkali          { background: #F00; background: hsl(   0, 100%, 50%); }
.element.alkaline-earth  { background: #F80; background: hsl(  36, 100%, 50%); }
.element.lanthanoid      { background: #FF0; background: hsl(  72, 100%, 50%); }
.element.actinoid        { background: #0F0; background: hsl( 108, 100%, 50%); }
.element.transition      { background: #0F8; background: hsl( 144, 100%, 50%); }
.element.post-transition { background: #0FF; background: hsl( 180, 100%, 50%); }
.element.metalloid       { background: #08F; background: hsl( 216, 100%, 50%); }
.element.other.nonmetal  { background: #00F; background: hsl( 252, 100%, 50%); }
.element.halogen         { background: #F0F; background: hsl( 288, 100%, 50%); }
.element.noble-gas       { background: #F08; background: hsl( 324, 100%, 50%); }


.element * {
  position: absolute;
  margin: 0;
}

.element .symbol {
  left: 0.2em;
  top: 0.4em;
  font-size: 3.8em;
  line-height: 1.0em;
  color: #FFF;
}
.element.large .symbol {
  font-size: 4.5em;
}

.element.fake .symbol {
  color: #000;
}

.element .name {
  left: 0.5em;
  bottom: 1.6em;
  font-size: 1.05em;
}

.element .weight {
  font-size: 0.9em;
  left: 0.5em;
  bottom: 0.5em;
}

.element .number {
  font-size: 1.25em;
  font-weight: bold;
  color: hsla(0,0%,0%,.5);
  right: 0.5em;
  top: 0.5em;
}

.variable-sizes .element.width2 { width: 230px; }

.variable-sizes .element.height2 { height: 230px; }

.variable-sizes .element.width2.height2 {
  font-size: 2.0em;
}

.element.large,
.variable-sizes .element.large,
.variable-sizes .element.large.width2.height2 {
  font-size: 3.0em;
  width: 350px;
  height: 350px;
  z-index: 100;
}

.clickable .element:hover {
  cursor: pointer;
}

.clickable .element:hover h3 {
  text-shadow:
    0 0 10px white,
    0 0 10px white
  ;
}

.clickable .element:hover h2 {
  color: white;
}

/**** Example Options ****/

#options {
  padding: 0 15px 19px 1px;
}

#options h3 {
  color: #FFFFFF;
    font-size: 15px;
    margin: 0;
    padding: 11px;
	font-size: 25px !important;
}

#options h4 { 
  font-weight: bold;
}

#options ul {
  margin: 0;
  list-style: none;
  background: transparent;
  
}

#options ul ul {
  margin-left: 1.5em;
}

#options li {
  float: left;
  margin-bottom: 0.2em;
}
#options .finish li,
#options .type li,
#options .fitment li{
  float: none;
  display: block;
  margin: 0;
  text-align:left;
  padding-left: 0;
  border-bottom: 1px solid #373737;
}
#options li a {
    color: #FFFFFF;
    display: block;
    font-size: 1em;
    padding: 7px 12px;
	
}

#options li a:hover {
   	background: #2d2d2d url("../images/bg-filter.png") repeat scroll 0 0;
    color: #FFFFFF;
    text-shadow: none;
}

#options li a:active {
  background-color: #39D;
  -webkit-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
     -moz-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
       -o-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
          box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
}

#options li a {

}

#options li:first-child a {

}

#options li:last-child a {
  border: none;
}

#options li a.selected {
  	background: #2d2d2d url("../images/bg-filter.png") repeat scroll 0 0;
    color: #FFFFFF;
    text-shadow: none;
}

/* Combination filter options*/

.combo-filters{
	background: url("../images/bg-filter.gif") repeat-x scroll 0 0 transparent;
}
#options .option-combo {
 display: inline-block;
    float: left;
    margin-right: 0;
    width: 25%;
	background: url("../images/bg-content.jpg") no-repeat scroll 18% 0% transparent;
}

#options .option-combo ul {
	  display: block;
    height: 160px;
    margin-right: 5px;
    padding: 0 0 42px 10px;
    position: relative;
}
#options .size li{
	  font-size: 14px;
    margin-bottom: 12px;
    margin-right: 6px;
    padding: 0;
    width: 44px;
}

#options .option-combo h2,
#options .option-combo h4 {
    background: url("../images/bg-wheel-list.gif") repeat-x scroll 100% 100% transparent;
    border-color: -moz-use-text-color -moz-use-text-color #B20303;
    border-image: none;
    border-style: none none solid;
    border-width: 0 0 1px;
    color: #FFFFFF;
    font-weight: normal;
    margin-bottom: 0;
    margin-right: 5px;
    padding: 9px 0 5px 10px;
    text-transform: uppercase;
    vertical-align: top;
}
#options li.reset{
    bottom: 5px;
    left: 52px;
    margin: 0 auto;
    padding-top: 5px;
    position: absolute;
    text-align: center;
    width: 106px;
	font-size: 12px;
	border: 0;	
}
#options li.reset a{
  background: none repeat scroll 0 0 #181818;
    border: 1px solid #313131;
    border-radius: 17px 17px 17px 17px;
}
#options li.reset a.selected{
  background: #2d2d2d url("../images/bg-filter.png") repeat scroll 0 0;
    border: 1px solid #313131;
    border-radius: 17px 17px 17px 17px;
}
/**** Infinite Scroll ****/

#infscr-loading {
  position: fixed;
  text-align: center;
  bottom: 30px;
  left: 42%;
  z-index: 100;
  background: white;
  background: hsla( 0, 0%, 100%, 0.9 );
  padding: 20px;
  color: #222;
  font-size: 15px;
  font-weight: bold;
  -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
          border-radius: 10px;
}



/* The Magnificent Clearfix: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
