/* :: =================================================================

	Author: www.Spot.bg

 ================================================================ :: */


* {margin: 0; padding: 0;}

img {border: 0;}

html body {
	font: 11px/1.5em Tahoma, Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	background: url(page_b.png);
}

#eXtra {}

#site {
	position: relative; width: 950px;
	margin: 0 auto; padding: 0;
	text-align: left;
	background: url(site.png) repeat-x 0 0;
}

/* :: Page Header =============================================================== */

#intro {
	height: 123px;
}

	#intro h1 {
		position: absolute; top: 15px; left: 26px; z-index: 1000;
		width: 229px; height: 47px;
		margin: 0; padding: 0;
		background: url(cfmoto_logo_bg.png) no-repeat;
	}
		
		#intro h1 a {
			display: block; float: left;
			width: 229px; height: 47px; 
		}
		
	#skipNav {position: absolute; left: -5555px;}
	

	#graphic {
		height: 148px;
		background: url(gr_inside.png) no-repeat 0 0;
	}
	
	.index #graphic {
		height: 400px;
	}

/* =========================================================================== :: */

/* :: Main Navigation :: */

#mainNav {
	position: absolute; top: 35px; left: 0; z-index: 100;
	width: 950px; height: 115px;  
	background: url(nav_b.png) no-repeat 0 0;
}

	#mainNav ul {
		margin: 0; padding: 55px 0 0 55px;
		list-style: none;
	}

		#mainNav li {
			float: left;
			margin: 0 15px 0 0;
		}
	
			#mainNav a {
				display: block; height: 33px;
			}
			
			.b01 a, .b02 a, .b03 a, .b04 a, .b05 a, .b06 a {
				background: url(main-nav_bg.png) no-repeat 0 0;
			}
			
			
			.b01 a {background-position: 0 0 !important; width: 85px;}
			.b02 a {background-position: -150px 0 !important; width: 82px;}
			.b03 a {background-position: -300px 0 !important; width: 99px;}
			.b04 a {background-position: -450px 0 !important; width: 109px;}
			.b05 a {background-position: -600px 0 !important; width: 88px;}
			.b06 a {background-position: -750px 0 !important; width: 95px;}
			
			
			.b01 a:hover {background-position: 0 -100px !important;}
			.b02 a:hover {background-position: -150px -100px !important;}
			.b03 a:hover {background-position: -300px -100px !important;}
			.b04 a:hover {background-position: -450px -100px !important;}
			.b05 a:hover {background-position: -600px -100px !important;}
			.b06 a:hover {background-position: -750px -100px !important;}
			
			.b01 a.current, .b01 a.current:hover {background-position: 0 -200px !important;}
			.b02 a.current, .b02 a.current:hover {background-position: -150px -200px !important;}
			.b03 a.current, .b03 a.current:hover {background-position: -300px -200px !important;}
			.b04 a.current, .b04 a.current:hover {background-position: -450px -200px !important;}
			.b05 a.current, .b05 a.current:hover {background-position: -600px -200px !important;}
			.b06 a.current, .b06 a.current:hover {background-position: -750px -200px !important;}


/* :: Sub Navigation :: */
		
#mainNav ul ul {
	display: none;
	position: absolute; top: 88px; left: 30px; z-index: 1000;
	width: 885px; height: auto;
	margin: 0 !important; padding: 5px 0 5px 3px !important;
	background: url(dot_b_75.png);
	border: 1px solid;
}


#mainNav ul li.hovering ul, #mainNav ul li.subMenu:hover ul {
	display: block;
}

	#mainNav ul ul li {
		float: left;
		margin: 0 2px 5px !important; padding: 0 !important;
	}
			
		#mainNav ul ul a {
			display: block;
			float: left;
			width: 112px; height: auto; min-height: 175px;
			margin: 0; padding: 4px; 
			text-align: left; text-decoration: none;
			font-size: .9em !important;
			background: none;
			border: 1px solid;
		}
		
	#mainNav ul ul .more {
		width: 99%;
		padding-top: .5em !important;
		text-align: center;
		border-top: 1px dotted;
	}
		
		#mainNav ul ul .more a {
			float: none; display: inline;
			width: auto; min-height: 10px;
			margin: 0; padding: 4px 10px;
			font-size: 1em !important;
		}
		
			#mainNav ul ul a strong {
				display: block;
				margin-bottom: .5em;
			}
			
			#mainNav ul ul a img {
				width: 112px;
			}



/* :: Page Content =================================================== :: */

hr {
	height: 1px;
	margin: 1em 0;
	border: 1px dashed #ccc; border-width: 1px 0 0;
}



#main {
	padding: 0 30px;
	background: url(main_b_left-bar.png) no-repeat 0 0;
}

	#content {
		float: right; 
		width: 630px; min-height: 400px;
		margin: 0; padding: 22px 0 2em;
	}
	
		#content h2 {
			margin: 0 0 4px; padding: 9px 12px;
			line-height: 0.8em; text-transform: uppercase; 
			font-size: 1.4em; font-weight: bold;
		}
	
		#content h4 {
			margin: 0.2em 0 1.3em;
		}
		
		#content h4.special {
			clear: both;
			font-size: 1.5em;
			padding: 0.2em 0.4em;
			background: #e7ecf2;
		}
		
		#content ul {
			list-style: url(../_shared/bullet03.gif);
			padding-left: 2em;
		}
		
			#content li {
				margin: 1em 0;
			}
		
/* :: Index Promo :: */
					
.promo {
	clear: both; 
	margin: 0; padding: 0 0 2em;
}

	.promo h3 {
		height: 32px;
		margin: 0 !important; padding: 0;
		background: url(t_promo_bg.png) no-repeat 0 0;
	}
	
		.promo h3 a, .products h3 a {
			display: block;
			width: 100px; height: 20px;
			position: relative; top: 5px; left: 4px;
		}
					
	.promo dl, .prodDescription dl {
		position: relative; float: left;
		width: 33%;
		margin: 1.5em 0 0; padding: 0;
	}
	
		.promo dt, .prodDescription dt {
			font-size: 1.1em;
			margin: 0 0 0.8em 8px; padding-left: 15px;
			background: url(arrow01.gif) no-repeat 0 50%;
		}						
	
		.promo dd.img, .prodDescription dd.img {
			padding-left: 23px;
		}
		
			.promo dd.img img, .prodDescription dd.img img {border: 1px solid #ddd;}
					
					
						
				.specialBlock {
					font-size: 1.2em; color: #14457b;
					display: block;
					margin: 1em 2em 1em 0; padding-left: 1em;
					border-left: 2px dotted #ccc;
				}
				
				.contImg {
					float: right;
					margin: 0 0 2em 1.5em; padding: 1px;
					border: 1px solid #ccc;
				}
				
				.specialLink {
					font-size: 1.3em; text-decoration: none;
					padding: 0.3em 0.5em;
					background: #eee;
					border: 1px solid #ccc;
				}
				
				.specialLink:hover {
					background: #e4f5ff;
				}
		
/* :: Index Products :: */

.products {
	clear: both;
}	

	.products h3 {
		height: 32px;
		margin: 0 !important; padding: 0;
		background: url(t_products_bg.png) no-repeat 0 0;
	}
	
	.products ul {
		list-style: none !important;
		margin: 0 !important; padding: 20px 0 0 1px !important;
	}
	
		.products li {
			float: left;
			width: 284px; height: 118px;
			margin: 0 !important;
		}
		
		.products li#pATV {
			margin-right: 60px !important;
			background: url(in_prod_atv.jpg) no-repeat;
		}
		
		.products li#pScooter {
			background: url(in_prod_scooter.jpg) no-repeat;
		}
		
			.products li a {
				display: block;
				width: 284px; height: 118px;
			}
			
			html > body .products li a:hover {
				background: url(dot40.png);
			}
		
			


/* :: Products :: */

.prodDescription {
	clear: both;
	padding: 2em 0 2em 1.4em;
}

	.prodDescription h3 {
		color: #c00;
	}
		
	.prodGallery-thumbs {
		float: right; 
		width: 100px; height: 364px;
		overflow: auto;
		margin: 0 0 1.5em !important; padding: 5px 2px 5px 5px !important;
		background: #f3f3f3;
		border: 1px solid #ccc;
	}
	
		.prodGallery-thumbs ul {
			list-style: none !important;
			margin: 0 !important; padding: 0 !important;
		}
		
			.prodGallery-thumbs li {
				float: left;
				margin: 0 3px 3px 0 !important; padding: 0 !important;
				border: 1px solid #ccc;
			}
			
			.prodGallery-thumbs li.mark {
				border-color: #c00;
			}
			
				.prodGallery-thumbs li a {
					display: block;
				}
				
					.prodGallery-thumbs li img {
						width: 70px;
						padding: 2px;
					}


#main table {
	clear: both;
	margin: 2em 0 !important;
}

#main table, #main th, #main td {
	font-size: 1em;
	background: white;
	border-collapse: collapse; border: 1px solid #eee;
}

	#main th, #main td {
		padding: 0.3em 0.5em;
	}

	#main th {
		text-align: left;
		font-size: 1.2em; font-weight: bold;
		background: #ccc;
	}



			
/* :: Additional Content :: */

#addBar {
	float: left; width: 220px;
	padding: 22px 0 1em;
	background: none;
}

	#addBar h3.history, #addBar h3.products, #addBar h3.contact, #addBar h3.video {
		height: 35px;
		margin: 0 0 10px; padding: 0;
		background: url(t_history_left-bar_bg.png) no-repeat;
	}

	#addBar h3.products {background-image: url(t_products_left-bar_bg.png);}
	#addBar h3.contact {background-image: url(t_contact_left-bar_bg.png);}
	#addBar h3.video {background-image: url(t_video_left-bar_bg.png);}
	
	#addBar .promo dl {
		width: auto; float: none;
	}
	
	#addBar p {padding-left: 5px; padding-right: 5px;}

	#addBar a.more {
		display: block;
		width: 91px; height: 28px;
		background: url(more_bg.png) no-repeat 0 0;
	}
	
	#addBar a.more:hover {
		background-position: 0 -100px;
	}
	


/* :: Contact ======================================================== :: */

.contact {
	margin: 0; padding: 0 0 0 6px;
}

	input, textarea {
		font: 1.1em Arial, Helvetica, sans-serif;
		padding: 0.2em;
		background: white;
		border: 1px solid #c7c7c7;
	}
	
	select {border: 1px solid #c7c7c7;}

	.txt  {
		color: black; width: 200px; 
		padding: 3px; margin: 2px 0;
	}

	.contact p {
		clear: left; 
		padding: 0 !important; margin: 0 0 1.3em;
	}
	
		.contact p label {
			float: none; display: block; 
			width: auto;
		}
	
		.contact em {color: #c00;}
	
	.btn {
		color: white;
		font: bold 1.4em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		padding: 0.2em 0.6em;
		border-color: white;
		cursor: pointer;
	}
	
	
	.warning {
		color: #c00;
		margin-bottom: 1.5em;
	}



/* :: Footer ========================================================= :: */

#footer {
	clear: both; position: relative;
	color: #333;
	padding: 0 0 20px;
	background: #e9e8e7;
}

	#footer ul {
		list-style: none; text-align: center;
		padding: 1em 0 1em 10px;
		background: white;
	}
	
		#footer li {
			display: inline;
			margin: 0 2em 0 0; padding: 0 0 0 2em;
			border-left: 1px solid #c9c9c9;
		}

		#footer ul .first {
			border: none;
		}

			#footer li a {
				text-decoration: none;
				font-size: 1.1em; 
				padding-bottom: 0.1em;
				border-bottom: 1px solid white;
			}
			
			#footer li a:hover {
				border-color: #d10000;
			}

	.copy {
		margin: 0; padding: .8em 0 .8em 25px;
	}
	
	#spot {
		position: absolute; right: 25px; top: 3.8em; z-index: 1000;
		padding-top: .8em;
	  }
	
		#spot a {
				  position: relative;
				  display: block;
				  width: 67px; height: 19px; 
				  margin: 0 0 0 auto; padding: 0;
				  background: url(spot_logo.png) no-repeat 0 0;
			  }
				  
			  #spot a:hover {background-position: 0 -100px;}
			  
				  #spot a:hover em {
					  display: block;
					  position: absolute; top: -40px; right: 0;
					  width: 120px;
					  color: black; 
					  font: normal 11px Tahoma, Arial, Helvetica, sans-serif;
					  padding: 3px 5px 5px;
					  background: #f6f6f6 url(spot_logo.png) repeat-x 0 -200px;
					  border: 1px solid black;
					  border-radius: 3px;
					  -moz-border-radius: 3px;
					  -webkit-border-radius: 3px;
				  }
				  
			  #spot a span, #spot em {display: none;}

/* :: EOS :: */

acronym {font-style: normal; border-bottom: 1px dotted #686868; cursor: help;}

.floatLeft {float: left;}

.floatRight {float: right;}

.clearBoth {clear: both;}

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

.clearFix {display: inline-block;}

/* Hide from IE Mac \*/
.clearFix {display: block;}
/* End hide from IE Mac */


h3, h5, h6, .copy {cursor: default;}



#header h1 span, #header p, #header hr,
#mainNav a span,
#addBar h3 span, #addBar .more span,
.promo h3 span, .products h3 span, .products li a span,
#spot a span, #spot em,
.hide {display: none;}