/* Eighth Inch Style Sheet */

/*****************
GENERAL STYLES 
*****************/

html {
	background: #161615 url('../images/rider_bg.jpg') no-repeat fixed top center;
	margin: 0;
	padding: 0;}

body {
	margin: 0;
	padding: 0;
	padding-bottom: 32px;
	background: url('../images/page_bg2.png') no-repeat fixed top left;
	color: #e8e7e1;
	font: 14px/22px Arial, Helvetica, sans-serif;}

h1 {
	font: 32px/32px Arial, Helvetica, sans-serif;
	color: #46aeff;
	font-weight: normal;
	background: none;
	margin: 0 0 8px 0;
	padding: 0;}

h2 {
	font: 20px/28px Arial, Helvetica, sans-serif;
	color: #acacaa;
	font-weight: normal;
	background: none;
	margin: 0;
	padding: 0;}

h3 {
	font: 26px/32px Arial, Helvetica, sans-serif;
	color: #46aeff;
	font-weight: normal;
	background: none;
	margin: 0;
	padding: 0;}

h4 {
	font: 16px/s2px Arial, Helvetica, sans-serif;
	color: #ffffff;
	font-weight: normal;
	background: none;
	margin: 0;
	padding: 0;}
	
p {
	margin: 10px 36px 12px 0;}

a {	color: #2faaff;
	text-decoration: underline;}

a:hover {	color: #147ec7;
	text-decoration: underline;}

ul {
	color: #fcfaf1;
	margin: 14px 0 12px 8px;
	padding: 0;
	list-style-type: none;}
ul li {
	margin: 0;
	padding: 0 0 0 14px;
	display: block;
	background: url('../images/bullet-1.png') no-repeat 0 8px;}

ul ul {
	margin: 2px 0 12px 10px;
	padding: 0;
	list-style-type: none;}

ul ul li {
	margin: 0;
	padding: 0 0 0 14px;
	display: block;
	background: url('../images/bullet-2.png') no-repeat 0 8px;}

#header-wrapper {
	background-image: url('../images/header_bg.png');
	border-bottom: 5px solid #000000;
	margin: 28px 0 145px 0;
	height: 31px;}

#header {
	height: 31px;
	position: relative;
	width: 967px;
	margin: 0 auto;
	}

#header ul {
	position: absolute;
	top: 0px;
	right: 7px;
	margin: 0;
	padding: 0;
	list-style-type: none;
	float: left;}

#header ul li {
	display: inline;
	margin: 0;
	padding: 0;}

#header ul li a {
	display: block;
	float: left;
	height: 31px;
	background: url('../images/topnav_bg.png') no-repeat 0 -31px;
	line-height: 99px;
	overflow: hidden;
	margin-left: 30px;}
	
#header ul li a#about { width: 63px; background-position: 0 -31px;}
#header ul li a#about:hover, #header ul li#active a#about {background-position: 0 0;}

#header ul li a#products { width: 99px; background-position: -93px -31px;}
#header ul li a#products:hover, #header ul li#active a#products {background-position: -93px 0;}

#header ul li a#gallery { width: 80px; background-position: -230px -31px;}
#header ul li a#gallery:hover, #header ul li#active a#gallery {background-position: -230px 0;}

#header ul li a#blog { width: 49px; background-position: -343px -31px;}
#header ul li a#blog:hover, #header ul li#active a#blog {background-position: -343px 0;}

#header ul li a#contact { width: 83px; background-position: -426px -31px;}
#header ul li a#contact:hover, #header ul li#active a#contact {background-position: -426px 0;}

#header ul li a#riders { width: 70px; background-position: -659px -31px;}
#header ul li a#riders:hover, #header ul li#active a#riders {background-position: -659px 0;}

#header ul li a#dealers { width: 83px; background-position: -542px -31px;}
#header ul li a#dealers:hover, #header ul li#active a#dealers {background-position: -542px 0;}

#header a#logo {
	display: block;
	width: 229px;
	height: 160px;
	line-height: 480px;
	overflow: hidden;
	background: url('../images/logo.png') no-repeat 0 0;
	position: absolute;
	top: -24px;
	left: 8px;
	border: 0;
	text-decoration: none;}

/* END HEADER */

#wrapper {
	width: 967px;
	margin: 0 auto;}
	
#content {
	margin: 0;
	padding: 0;
	position: relative;}

#breadcrumbs {
	font: 10px/13px Arial, Helvetica, sans-serif;
	margin-left: 25px;
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: -1px;}

#breadcrumbs a {
	padding: 0 6px;
	color: #ffffff;
	text-decoration: none;
	letter-spacing: 0;}

#breadcrumbs a:hover { text-decoration: underline;}

#main-content {
	color: #e8e7e1;
	width: 538px;
	margin-left: 28px;
	padding: 22px 2px 32px 18px;
	background-image: url('../images/ip_content_bg.png');}

#footer { 	
	width: 548px;
	margin: 16px 0 32px 32px;
	color: #575755;
	font: 10px/14px Verdana, Arial, Helvetica, sans-serif;
	text-align: left;}
	
#footer ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: inline;}

#footer ul li {
	display: inline;
	border-right: 1px solid #575755;
	padding: 0 10px 0 0;
	margin: 0 10px 0 0;
	background-image: none;}

#footer a {
	color: #575755;
	margin: 0;
	text-decoration: underline;}

#footer #copyright {
	color: #575755;
	text-align: left;
	margin: 22px 0 0 0;}

#footer a:hover {color: #8b8b87;}
	

/* HOME PAGE CONTENT */

body#home #header-wrapper {
	background-image: url('../images/header_bg.png');
	border-bottom: 5px solid #000000;
	margin: 28px 0 202px 0;
	height: 31px;}

#follow-us {
	margin-left: 34px;}

#content {
	margin: 0;
	padding: 0;
	position: relative;}

#content #right-rail {
	width: 297px;
	position: absolute;
	top: 276px;
	left: 590px;
	margin: 0;
	padding: 0;}

#content #right-rail img {	
	padding: 3px;
	background: #ffffff url('../images/photo-border.png');
	border: 0;
	margin: 1px;}
	
body#home #main-content {
	color: #e8e7e1;
	width: 508px;
	margin-left: 28px;
	padding: 22px 22px 32px 18px;
	background-image: url('../images/hp_content_bg.png');}

#content #main-content a#about-callout {
	display: block;
	width: 239px;
	height: 30px;
	background: url('../images/about-callout.png') no-repeat top left;
	line-height: 90px;
	overflow: hidden;}
#content #main-content a#about-callout:hover {background-position: 0 -30px}

ul.inline-images {
	list-style-type: none;
	margin: 40px 0 26px 0;
	padding: 0;}

ul.inline-images li {
	margin: 0;
	padding: 0;
	display: inline;
	background-image: none;}

ul.inline-images li img {
	border: 0;
	}

/***** BLOG FEED *******/
#blog {
	font: 12px/20px Arial, Helvetica, sans-serif;
	color: #e8e7e1;}

#blog div.blog-post {
	position: relative;}

#blog div.blog-post div.date {
	position: absolute;
	width: 37px;
	text-align: center;
	background-color: #000000;
	border-right: 1px solid #a0a0a0;
	border-bottom: 1px solid #a0a0a0;
	right: -66px;
	top: 0;
	padding: 0 1px 2px 1px;}

#blog div.blog-post div.date span.month {
	font: 12px/14px Verdana, Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #a0a0a0;
	clear: both;}

#blog div.blog-post div.date span.day {
	font: bold 24px/22px Verdana, Arial, Helvetica, sans-serif;
	color: #a0a0a0;
	letter-spacing: -1px;}


/********************
ABOUT US PAGE
********************/

#content #main-content a#products-callout {
	display: block;
	width: 205px;
	height: 30px;
	background: url('../images/products-callout.png') no-repeat top left;
	line-height: 90px;
	overflow: hidden;}
#content #main-content a#products-callout:hover {background-position: 0 -30px}


/********************
CATEGORIES LIST PAGE
********************/

ul.categories {
	margin: 10px 8px 6px 0;
	padding: 10px 0 0 0;
	list-style-type: none;
	color: #2faaff;
	overflow: hidden;}

ul.categories li {
	margin: 0 50px 42px 0;
	padding: 0;
	width: 122px;
	float: left;
	text-align: center;
	background: none;}

ul.categories li a {
	text-decoration: none;
	color: #2faaff;
	border: 0;}
	
ul.categories li a img {
	border: 2px solid #ffffff;}

ul.categories li a:hover img {
	bordeR: 2px solid #2faaff;}
	
ul.categories li a span.label {
	text-decoration: underline;}
	
/*********************
=PRODUCT PROFILE PAGE
**********************/

img.product-photo {
	margin: 2px 0;
	border: 3px solid #ffffff;}

a.purchase-callout {
	display: block;
	margin: 12px auto;
	width: 175px;
	height: 48px;
	line-height: 150px;
	overflow: hidden;
	background: url('../images/purchase-online.png') no-repeat 0 -48px;
	text-decoration: none;
	border: none;}

a.purchase-callout:hover {
	background: url('../images/purchase-online.png') no-repeat 0 0;}