@font-face {
	font-family: 'ProCycleLogo';
	src: url('http://www.procycle.us/fonts/ProCycleLogo.eot');
	src: local('ProCycleLogo'), url('http://www.procycle.us/fonts/ProCycleLogo.woff') format('woff'), url('http://www.procycle.us/fonts/ProCycleLogo.otf') format('opentype'), url('http://www.procycle.us/fonts/ProCycleLogo.svg#ProCycle') format('svg');
}
@charset "utf-8";

/* Element Styles
======================================================================*/
	body {
		background-color: #FFFFFF;
		margin: 0px;	/*removes all whitespace from page edges*/
		padding: 0px;
	}
	a {text-decoration: underline;}
	a:link {color: #000000;}
	a:visited {color: #000000;}
	a:active {color: #968000;}
	a:hover {color: #968000;}
	img {border: none;}

/* Common Styles
======================================================================*/
	/* Floats
	-----------------------------*/
		.floatl {float: left; }
		.floatr {float: right; }
		.clear {clear: both; }
	/* Text Styles
	-----------------------------*/
		.bold {font-weight: bold;}
		.italic {font-style: italic;}
		.red {color: #FF0000;}
		.nounderline {text-decoration: none;}
	/* Box Styles
	-----------------------------*/
		.center {text-align: center;}
		.shadowb {	/*adds a shadow under any block*/
			background-image: url(http://www.procycle.us/images/shadows/bottom-light.gif);
			background-repeat: repeat-x;
			height: 7px;
			margin-top: 0px;
		}
		.border {border: 1px solid #cccccc;}
		.hide {display: none;}
		.show {display: block;}
		.width35em {width: 35em;}	/*used for: Bikemenu*/
		.button {
			background-color: #FFEA00;
			border: 1px solid #000000;
			font-weight: bold;
			padding: 5px;
		}

/* Page Header
======================================================================*/
	div.header {
		background: rgb(255, 234, 0);
	}
		div.logo {
			padding-left: 1em;
			padding-bottom: 0.2em;
			float: left;
		}
			a.org {
				text-decoration: none;
				letter-spacing: 0.1em;
				font-family: ProCycleLogo,Arial,Tahoma;
				font-size: 5.2em;
				font-weight: bolder;
				text-shadow: -1px 0 #FFFFFF, 0 1px #FFFFFF, 1px 0 #FFFFFF, 0 -1px #FFFFFF, 0.04em 0.04em 0.06em #B0A400;
			}
			a.org:link {color: #000000;}
			a.org:visited {color: #000000}
			a.org:active {color: #000000;}
			a.org:hover {color: #000000;}
			div.header span.description {
				font-size: 1.2em;
				letter-spacing: 0.23em;
				text-shadow: 0.06em 0.06em 0.06em #B0A400;
			}
		div.contact {
			float: right;
			padding-right: 1em;
			text-align: right;
		}
			span.tel {
				font-weight: bold;
				font-style: italic;
				font-size: 1.3em;
			}
			span.timezone {
				font-weight: bold;
				cursor: help;
			}
			a.email {
				text-decoration: none;
				font-size: 1.5em;
				letter-spacing: 0.1em;
			}
			img.payment {
				padding: 5px;
			}
		
/* Site Menu
======================================================================*/
	#mainmenucontainer {	/*moves menu from bottom of page to top*/
		position: absolute;
		top: 0em;
		width: 100%;
	}
	#menu {	/*black bar below header. contains site menu*/
		background-color: #000000;
		list-style: none;
		margin: 0px;
		padding: 0px;
		padding-left: 1em;
		padding-right: 1em;
	}
	/* Main Links
	-----------------------------*/
		#menu a {text-decoration: none;}	/*removes underlines on all menu links*/
		a.menu-link {	/*styles for visible menu items*/
			color: #FFFFFF;
			font-size: 1.2em;
			font-weight: bold;
		}
		a.menu-link:visited {color: #FFFFFF;}
		a.menu-link:active {color: #FFFFFF;}
		li.menu-link {	/*stacks menu items left to right with a 3em space*/
			float: left;
			margin-right: 2.2em;
			position: relative;
		}
		li.menu-link-2 {	/*same as li.menu-link. swapped with li.menu-link when javascript is enabled to prevent the default hover behavior.*/
			float: left;
			margin-right: 2.2em;
			position: relative;
		}
		/* Dropdowns
		-----------------------------*/
			ul.dropdown {	/*main container for the dropdowns. is hidden until user hovers over the parent element*/
				display: none;
				list-style: none;
				position: absolute; 
				top: 1.4em;
				background-color: rgb(255, 234, 0);
				border: 1px solid #000000;
				padding: 0.4em;
				white-space: nowrap;
				z-index: 30;
			}
			li.menu-link:hover ul {display: block;}	/*when element is hovered changes dropdown to visible*/
				ul.dropdown ul {	/*for submenus inside dropdowns*/
					position: relative;
					top: 0;
					border: none;
					list-style: none;
					left: -1.4em;
				}
			/* Parts for Your Bike Menu
			-----------------------------*/
				span.make {
					font-size: 1.1em;
					font-style: italic;
					text-decoration: underline;
				}
				ul.bikemenu-sprites a {
					background-image: url(../images/icons/menu-icons.gif);
					background-repeat: no-repeat;
					display: inline-block;
					height: 28px;
					line-height: 28px;
					padding-left: 46px;
				}
			/* Category Menus
			-----------------------------*/
				ul.menu-sprites a {
					background-image: url(../images/icons/menu-icons.gif);
					background-repeat: no-repeat;
					display: inline-block;
					height: 30px;
					line-height: 30px;
					padding-left: 36px;
				}
			/* Menu Icons
			-----------------------------
			To add or remove icons, open: images/icons/icons.zip and add or remove icons from the archive. 
			Upload the archive into the sprite generator located at: http://spritegen.website-performance.org/
			Replace: images/icons/menu-icons.gif with the result image then paste the CSS rules below*/
				.sprite-bigborekits { background-position: 0 0; } 
				.sprite-biofuel { background-position: 0 -40px; } 
				.sprite-carbs { background-position: 0 -80px; } 
				.sprite-cbr { background-position: 0 -120px; } 
				.sprite-chain { background-position: 0 -158px; } 
				.sprite-crf150r { background-position: 0 -198px; } 
				.sprite-crf230f { background-position: 0 -236px; } 
				.sprite-crf450r { background-position: 0 -274px; } 
				.sprite-dr350 { background-position: 0 -312px; } 
				.sprite-dr650 { background-position: 0 -350px; } 
				.sprite-drz { background-position: 0 -388px; } 
				.sprite-drz400 { background-position: 0 -426px; } 
				.sprite-dualsport { background-position: 0 -464px; } 
				.sprite-flywheel { background-position: 0 -504px; } 
				.sprite-foamtubes { background-position: 0 -544px; } 
				.sprite-fueltanks { background-position: 0 -584px; } 
				.sprite-g2 { background-position: 0 -624px; } 
				.sprite-gaskets { background-position: 0 -664px; } 
				.sprite-gpr { background-position: 0 -704px; } 
				.sprite-gsxr { background-position: 0 -744px; } 
				.sprite-honda50 { background-position: 0 -782px; } 
				.sprite-hotcams { background-position: 0 -820px; } 
				.sprite-kn { background-position: 0 -860px; } 
				.sprite-klx110 { background-position: 0 -900px; } 
				.sprite-ktm { background-position: 0 -938px; } 
				.sprite-loweringlinks { background-position: 0 -976px; } 
				.sprite-ltz400 { background-position: 0 -1016px; } 
				.sprite-manuals { background-position: 0 -1054px; } 
				.sprite-microfiche { background-position: 0 -1094px; } 
				.sprite-oilfilters { background-position: 0 -1134px; } 
				.sprite-pistons { background-position: 0 -1174px; } 
				.sprite-powernow { background-position: 0 -1214px; } 
				.sprite-r1 { background-position: 0 -1254px; } 
				.sprite-reeds { background-position: 0 -1292px; } 
				.sprite-rims { background-position: 0 -1332px; } 
				.sprite-ruckus50 { background-position: 0 -1372px; } 
				.sprite-shims { background-position: 0 -1410px; } 
				.sprite-slipperclutch { background-position: 0 -1450px; } 
				.sprite-speedohealer { background-position: 0 -1490px; } 
				.sprite-sprockets { background-position: 0 -1530px; } 
				.sprite-stators { background-position: 0 -1570px; } 
				.sprite-supermoto { background-position: 0 -1610px; } 
				.sprite-tires { background-position: 0 -1650px; } 
				.sprite-tools { background-position: 0 -1690px; } 
				.sprite-trx450r { background-position: 0 -1730px; } 
				.sprite-ttr { background-position: 0 -1768px; } 
				.sprite-vapor { background-position: 0 -1806px; } 
				.sprite-wheels { background-position: 0 -1846px; } 
				.sprite-xr100 { background-position: 0 -1886px; } 
				.sprite-xr250-400 { background-position: 0 -1924px; } 
				.sprite-xt225 { background-position: 0 -1962px; } 
				.sprite-yfz450 { background-position: 0 -2000px; } 
				.sprite-yz450 { background-position: 0 -2038px; } 
			/* Brands Menu
			-----------------------------*/
				ul.brandsmenu {	/*custom styles for the brands dropdown*/
					width: 600px;
					background-color: #FFFFFF;
					left: -225px; /*positions dropdown at approx center below it's link*/
				}
					ul.brandsmenu li {float: left;}	/*causes brand logos to stack horizontally*/
					ul.logo-sprites a {
						background-image: url(../images/logos/logo-sprites.jpg);
						background-repeat: no-repeat;
						display: block;
						font-size: 0.6em;
						height: 70px;
						width: 120px;
					}
			/* Brand Logos
			-----------------------------
			To add or remove logos, open: images/logos/logos.zip and add or remove logos from the archive. 
			Upload the archive into the sprite generator located at: http://spritegen.website-performance.org/
			Class Prefix: logo-
			Replace: images/logos/logo-sprites.jpg with the result image then paste the CSS rules below*/
				.logo-athena { background-position: 0 0; } 
				.logo-bbr { background-position: 0 -75px; } 
				.logo-boyesen { background-position: 0 -150px; } 
				.logo-clarke { background-position: 0 -225px; } 
				.logo-clymer { background-position: 0 -300px; } 
				.logo-edelbrock { background-position: 0 -375px; } 
				.logo-excel { background-position: 0 -450px; } 
				.logo-g2 { background-position: 0 -525px; } 
				.logo-haynes { background-position: 0 -600px; } 
				.logo-hinson { background-position: 0 -675px; } 
				.logo-hotcams { background-position: 0 -750px; } 
				.logo-ims { background-position: 0 -825px; } 
				.logo-kn { background-position: 0 -900px; } 
				.logo-keihin { background-position: 0 -975px; } 
				.logo-mikuni { background-position: 0 -1050px; } 
				.logo-moose { background-position: 0 -1125px; } 
				.logo-motionpro { background-position: 0 -1200px; } 
				.logo-powernow { background-position: 0 -1275px; } 
				.logo-speedohealer { background-position: 0 -1350px; } 
				.logo-stm { background-position: 0 -1425px; } 
				.logo-sunrims { background-position: 0 -1500px; } 
				.logo-trailtech { background-position: 0 -1575px; } 
				.logo-vforce { background-position: 0 -1650px; } 
				.logo-wer { background-position: 0 -1725px; } 
				.logo-wiseco { background-position: 0 -1800px; }
			/* View Shopping Cart Link
			-----------------------------
			This is actually a form and button which has been styled to resemble a link*/
			#viewcart {
				float: right;
				margin: 0;
				padding: 0;
			}
				#viewcart form {
					margin: 0;
					padding: 0;
				}
				#viewcartbutton {
					background-color: #000000;
					border: none;
					color: #FFFFFF;
					cursor: pointer;
					font-family: "Times New Roman", Times, serif;
					font-size: 19px;
					font-weight: bold;
					margin: 0;
					padding: 0;
				}

/* Page Content
======================================================================*/
	#container {
		position: relative;
		width: 100%;
	}
	#content {padding-top: 2.5em;}	/*adjusts position of top content box so it clears the main menu*/
	div.contentpadding {
		padding-left: 2.5em;
		padding-right: 2.5em;
		padding-bottom: 2.5em;
	}
	#pageheader {
		background-position: 32em bottom;
		background-repeat: no-repeat;
		margin-left: 2em;
	}
		#pageheader h1 {
			color: #FFEA00;
			font-family: "Times New Roman", Times, serif;
			font-size: 5em;
			font-style: oblique;
			font-weight: bolder;
			letter-spacing: 0.2em;
			margin-bottom: 0px;
			margin-top: 0px;
			text-shadow: 0.05em 0.05em 0.1em #000000, -1px 0 #000000, 0 1px #000000, 1px 0 #000000, 0 -1px #000000;	/*creates a black fuzzy shadow and 1px black outline*/
		}
		#pageheader p {
			margin-top: 0px;
			font-size: 1em;
			color: #000000;
			margin-left: 1em;
			max-width: 30em;
			/*width: 30em;*/
		}
	/* Horizontal Inter-Page Navigation
	-----------------------------*/
		ul.pageNavigation,ul.categoryNavigation,ul.subCategoryNavigation {
			list-style: none;
			text-align: center;
			margin: 0;
		}
		ul.pageNavigation li,ul.categoryNavigation li,ul.subCategoryNavigation li {
			display: inline;
			font-size: 1.2em;
		}
		ul.pageNavigation {
			background-color: #FFEA00;
			border-top: 1px solid #000000;
			padding-bottom:5px;
			padding-left: 10px;
			padding-right: 10px;
			padding-top: 5px;
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			z-index: 100;
		}
	/* Categories
	-----------------------------*/
		div.category {
			background-color: rgb(255, 234, 0);
			text-align: center;
			border-top: 1px solid #000000;
			padding: 10px;
		}
		div.category h2 {
			color: #000000;
			font-size: 3em;
			font-style: oblique;
			font-weight: bolder;
			letter-spacing: 0.2em;
			margin-bottom: 0px;
			margin-left: 0.5em;
			margin-top: 0px;
		}
		div.category h2 a {
			text-decoration: none;
		}
	/* Sub-Categories
	-----------------------------*/
		div.subcategoryheader {
			background-color: rgb(255, 234, 0);
			border-bottom: 1px solid #000000;
			border-top: 1px solid #000000;
			padding: 5px;
			text-align: left;
			vertical-align: bottom;
		}
		div.subcategoryheader h3 {
			display: inline;
			float: left;
			font-size: 1.7em;
			font-style: italic;
			font-weight: bolder;
			margin-bottom: 0px;
			margin-top: 0px;
			padding: 0.04em;
		}
			div.subcategoryheader h3 a {
				text-decoration: none;
			}
		a.backtotop {
			float: right;
			margin-top: 15px;
			text-decoration: none;
		}
	/* Product Boxes
	-----------------------------*/
		div.productboxesl {
			width: 49.9%;
			float: left;
		}
		div.productboxesr {
			width: 49.9%;
			float: right;
		}
		div.productbox {
			border: 1px solid	#8A8A8A;
			margin-bottom: 1em;
			margin-left: 0.5em;
			margin-right: 0.5em;
			margin-top: 0.5em;
			padding: 10px;
		}
		/* Products
		-----------------------------*/
			h4.producttitle {
				display: inline;
				font-size: 1.1em;
				margin-top: 0px;
				margin-bottom: 0.4em;
			}
			h4.producttitle a {
				text-decoration: none;
			}
			span.productnotes {
				font-size: small;
				margin-left: 1em;
			}
			div.productimages {
				float: left;
				margin-right: 1em;
			}
			.productimages img {
				border: 1px solid #cccccc;
				margin: 5px;
			}
			div.productbox ul {
				list-style: disc;
				list-style-position: inside;
				margin-top: 0.3em;
				margin-bottom: 0;
				width: 86%;
			}
			div.productbox p {
				margin-bottom: 0px;
				margin-top: 0.3em;
			}
			form.cartform {
				float: right;
				margin: 0.5em;
				text-align: right;
				vertical-align: bottom;
			}
				form.cartform fieldset {
					border: none;
					margin: 0px;
					padding: 0px;
				}
				span.price {
					font-size: large;
					font-weight: bold;
				}
				input.addtoorder {
					background-color: #FFEA00;
					border: 1px solid #000000;
					font-weight: bold;
					margin-top: 0.5em;
					padding: 5px;
				}
	/* Question and Answer
	-----------------------------*/
	div.qna {
		border: 1px solid #E4E4E4;
		padding: 0.5em;
		margin: 0.5em;
	}
		div.qna span {
			float: left;
			font-size: 2em;
		}
		div.qna h4 {
			font-size: 1.5em;
			margin: 0;
			margin-left: 1.8em;
		}
			div.qna h4 a {
				text-decoration: none;
			}
		div.qna p {
			margin-left: 2.7em;
			margin-top: 0;
		}
		div.qna img {
			margin: 0.3em;
			border: 1px solid #cccccc;
		}
	

/* Page Footer
======================================================================*/
	#catalog {
		background: rgb(255, 234, 0);
		border-top: 1px solid #000000;
		border-bottom: 1px solid #000000;
		text-align: center;
	}
	#catalogstore {
		margin-left: auto;
		margin-right: auto;
		width: 28em;
	}
	#catalogstore ul {
		list-style: none;
		padding: 0;
		margin: 0;
	}
	/* Main Links
	-----------------------------*/
		#catalogstore a {
			text-decoration: none;
			text-align: left;
		}
		#offroadcatalog,#streetcatalog,#atvcatalog {
			margin-right: 3em;
		}
		
		li.dropdown-hover {
			float: left;
			position: relative;
		}
		li.dropdown-hover-2 {
			float: left;
			position: relative;
		}
		a.cataloglink {
			font-size: 1.5em;
			text-align: center;
			text-decoration: underline;
		}
		ul.dropdown2 {
			display: none;
			position: absolute;
			bottom: 1.5em;
			left: 0;
			background-color: rgb(255, 234, 0);
			border: 1px solid #000000;
			padding: 0.2em;
			white-space: nowrap;
			z-index: 30;
		}
		li.dropdown-hover:hover ul {
			display: block;
		}

/* Image Lightbox
======================================================================*/
	#jquery-overlay {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 90;
		width: 100%;
		height: 500px;
	}
	#jquery-lightbox {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 100;
		text-align: center;
		line-height: 0;
	}
	#jquery-lightbox a img { border: none; }
	#lightbox-container-image-box {
		position: relative;
		background-color: #fff;
		width: 250px;
		height: 250px;
		margin: 0 auto;
	}
	#lightbox-container-image { padding: 10px; }
	#lightbox-loading {
		position: absolute;
		top: 40%;
		left: 0%;
		height: 25%;
		width: 100%;
		text-align: center;
		line-height: 0;
	}
	#lightbox-nav {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		z-index: 10;
	}
	#lightbox-container-image-box > #lightbox-nav { left: 0; }
	#lightbox-nav a { border: none;}
	#lightbox-container-image-data-box {
		font: 10px Verdana, Helvetica, sans-serif;
		background-color: #fff;
		margin: 0 auto;
		line-height: 1.4em;
		overflow: auto;
		width: 100%;
		padding: 0 10px 0;
	}
	#lightbox-container-image-data {
		padding: 0 10px; 
		color: #666; 
	}
	#lightbox-container-image-data #lightbox-image-details { 
		width: 70%; 
		float: left; 
		text-align: left; 
	}	
	#lightbox-image-details-caption { font-weight: bold; }
	#lightbox-image-details-currentNumber {
		display: block; 
		clear: left; 
		padding-bottom: 1.0em;	
	}			
	#lightbox-secNav-btnClose {
		width: 66px; 
		float: right;
		padding-bottom: 0.7em;	
	}

/* Shopping Cart
======================================================================*/
	#carttable td {
		padding: 5px;
	}
	#carttable th {
		background-color: #FFEA00;
	}
	#carttable th font {
		color: #000000;
	}
	.subamt {
		background-color: #cccccc;
	}