/*
  Author: Peter Kwiatkowski
  Date: December 8th, 2006
  Description: Main layout & page styles for classybikes.com
*/


/* GLOBAL SETTINGS 
===========================================================*/
html, body, h1, h2, h3, h4, h5, h6, img, p, a, ul, ol, li, dl, dt, dd, form { 
				margin:0; padding:0; border:0;}

body {
				font-family:			verdana, arial, helvetica, sans-serif;
				background:		#333333;
				text-align: 			center;}
						
.clear {
				clear:					both;
				height:				1px;
				overflow:			hidden;
				font-size:			0.1em;}

p {
				font: 					normal 12px/18px verdana, sans-serif;
				color: 				#000;}

p a:link { 
				color:					#000;
				text-decoration: 	none;
				border-bottom: 	1px dotted #666;}
		
p a:visited { 
				color: 				#666;
				text-decoration: 	none;
				border-bottom: 	1px dotted #666;}
				
p a:hover {
				color: 				#fff; 
				background-color:#000;
				text-decoration: 	none;
				border:				none;}


/* GLOBAL SETTINGS 
===========================================================*/
#wrap { 
				width: 				830px;	
				margin:				20px auto;
				background:		#fff;}
				
#wrap-fix {
				padding:				20px;				
				text-align:			left;}			
				

/* HEADER AND BANNER 
===========================================================*/
#top-navigation {
				width:				488px;
				height: 				30px;
				padding: 			25px 0 0 0;}
				
#top-navigation p {
				font: 					bold 12px/17px verdana, sans-serif;
				color: 				#000;}	
						
#side-navigation {
				width: 				290px;
				text-align: 			left;
				float: 				right;}
						
#side-navigation p {
				font: 					normal 14px/22px verdana, sans-serif;
				color: 				#000; }			
					
#logo {
				width: 				290px;
				margin:				3px 0px 0px 0px;
				float: 				right;}
				
#top-banner {
				width:				485px;
				border-right: 		1px dotted #ccc;}
				
#search {
				width:				790px;
				margin: 				10px 0;
				background: 		#eee;}
					
#search p {
				padding:				0px 0 10px 15px; 
				color:					#000;}	
				
				
				
#searchform {
margin:				10px 0 5px 15px; 
width:600px;font: 					normal 18px/18px verdana, sans-serif;
 

}

#searchbutton {
margin:				10px 0 5px 0; 
font: 					normal 18px/18px verdana, sans-serif;
}
		

				

/* BOXES 
===========================================================*/		
.box-open {
				width: 				788px;
				margin: 				10px 0;
				border-left: 		1px solid #ccc;
				border-right: 		1px solid #ccc;
				float:					left;}
							
.box-closed {
				width: 				788px;
				margin: 				10px 0;
				border: 				1px solid #ccc;}						
				
				
/* CONTENT COLUMN
===========================================================*/		
#content {
				width: 				485px;
				float: 				left;
				border-right: 		1px dotted #ccc;}

#content p { 
				padding:				5px 15px;}

#content h1 {
				font: 					bold 13px/17px verdana, sans-serif;
				padding: 			0 0 5px 15px;}
				
#content h2 {padding: 			10px 0 0 15px;
				font: 					bold 13px/17px verdana, sans-serif;
				color: 				#91420a;}
				
#content h3 {padding: 			0 0 0 15px;
				font: 					bold 13px/17px verdana, sans-serif;}
				
		#content h2 a:link { 	
						color: 				#000;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
						
		#content h2 a:visited { 	
						color: 				#666;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
						
		#content h2 a:hover { 		
						color:					#fff;
						background:		#000;
						border: 				none;}
				

		/* front page featured section =================================*/	
		.featured {
						clear: 				left;
						padding-left:		10px;
						padding-bottom: 	50px;}
	
		.featured img {
						float:					left;
						border-right: 10px solid #fff;}
		
		
		
		#content .featured h3 a:link { 	
						color: 				#000;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
						
		#content .featured h3 a:visited { 	
						color: 				#666;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
						
		#content .featured h3 a:hover { 		
						color:					#fff;
						background:		#000;
						border: 				none;}
		
		#content .featured h4 {
						font: 					normal 11px/14px verdana, sans-serif; 
						color: 				#91420a;}
		
		#content .featured p {
						overflow: 			hidden;
						width:				320px; 
						height: 				35px;
						margin:				0;
						padding:				0;}
						
		/* viewlisting page sections =================================*/	
		#viewlisting-photo {
						padding-left:		15px;}
						
		#viewlisting-photo p{
						margin: 				0; 
						padding: 			0 25px 0 0;}
		
		#viewlisting-photo h1 {margin:0;padding: 0 0 5px 0;}
	
		#viewlisting-photo h3 {margin:0;padding: 10px 0 5px 0;}
		
		#results-table  {
						width:				720px;
						margin: 				0;
						border:				none;
						border-collapse: 	collapse;
						font: 					normal 11px/15px verdana, sans-serif;
						color: 				#000;}
						
		#results-table td { 
						padding:				10px;}
		
		#results-table a:link { 	
						font-weight:		bold;
						color: 				#000;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
												
		#results-table a:visited { 	
						font-weight:		bold;
						color:					#666;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
						
		#results-table a:hover { 		
						color: 				#fff; 
						background-color:#000;
						border:				none;}
						
		tr.gray { 
						color: 				#000;
						background-color:#eee;}	

		/* closed box sections =====================================*/	
		
		.box-text {
						padding:				20px;}
		.box-text p { 
				padding:				5px 15px;}
						
		.box-text h1 {
				font: 					bold 13px/17px verdana, sans-serif;
				padding: 			0 0 5px 0px;}
				
		.box-text h2 {padding: 			10px 0 0 0px;
				font: 					bold 13px/17px verdana, sans-serif;
				color: 				#91420a;}
				
		.box-text h3 {padding: 			0 0 0 0px;
				font: 					bold 13px/17px verdana, sans-serif;}

		
		/* other content sections ===================================*/
		#content .whiterow  {padding: 10px;font: 					normal 12px/14px verdana, sans-serif;color: 				#000;margin: 				0 15px;}
		#content  .whiterow2  {padding: 3px;font: 					normal 12px/14px verdana, sans-serif;color: 				#000;margin: 				0 15px;}
		#content .grayrow  {padding: 10px;font: 					normal 12px/14px verdana, sans-serif;color: 				#000;margin: 				0 15px;background-color:#eee;}
		
				#content .graybox  {
				padding: 10px;
				font: 					normal 12px/16px verdana, sans-serif;
				color: 				#000;
				margin: 				8px 15px 0 15px;
				background-color:#eee;}


		.whiterow span  {
						display:				inline-block;
						float:					left;color:#000;
						width:				130px;font-weight:		bold;
						}
						
		.whiterow2 span  {
						display:				inline-block;
						float:					left;color:#000;
						width:				130px;
						font-weight:		bold;}
	
		.grayrow span  {
						display:				inline-block;
						float:					left;color:#000;
						font-weight:		bold;
						width:				130px;}
		
		
/* SIDEBAR COLUMN
===========================================================*/	
#sidebar {
				width: 				250px;
				padding-right:		30px;
				float: 				right;}

#sidebar h2 {
				
				padding: 			0 0 5px 0;
				font: 					bold 13px/16px verdana, sans-serif;
				color: 				#91420a;}

#sidebar p {
				padding: 			0 0 15px 0;
				font: 					normal 11px/16px verdana, sans-serif;
				color: #000; }
	
#sidebar span  {
				display:				inline-block;
				float:					left;
				width:				100px;}
				
 ul {margin:0; padding:0 0 15px 0; list-style:none; }
 #content ul {margin:0; padding:0 0 15px 15px; list-style:none; }

 li {font: 					normal 12px/18px verdana, sans-serif;}

 li a:link { 
				color:					#000;
				text-decoration: 	none;
				border-bottom: 	1px dotted #666;}
		
 li a:visited { 
				color: 				#666;
				text-decoration: 	none;
				border-bottom: 	1px dotted #666;}
				
 li a:hover {
				color: 				#fff; 
				background-color:#000;
				text-decoration: 	none;
				border:				none;}
				
				
/* FOOTER NAVIGATION
===========================================================*/	

#bottom-navigation {
				text-align:			right;}	

#footer {
				height:				30px;	
				padding: 			25px 0 0 0;}
						
#footer p {
				font-size:				10px;
				color: 					#ccc;}				
				
#copyright {
				margin: 				10px 0 0 0;
				padding-top: 		15px;
				border-top: 		1px solid #ccc;
				text-align: 			left;}
				
#copyright p {
				font-size: 			10px;
				color:					#666;}

#copyright img {
				float:					left;
				padding:				0 10px 0 0;}





.orange {font-size: 12px;
	font-weight: bold;
	color: #600;}




.red { color:#c00; }

.white { color:#fff; }



.highlight { background-color:#ffc; }

small { font-size: 10px; }

.normal { font-weight: normal; }

.rust {color: 				#91420a;}
.v10 { font-size:10px; }

.v11gray { font-size:11px; color:#666; }
.gray {background: #eee;}

.green-link { color: #4F7766;font-weight: bold;}
a.green-link:link {color: #4F7766;font-weight: bold;}
a.green-link:visited {color: #4F7766;font-weight: bold;}
a.green-link:hover {color: #4F7766;font-weight: bold; background-color:	#EEEEEE;}

.text-110 {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 11px;
	font-weight: normal;
	line-height: 15px;
	color: #000; }
.form {font-size: 11px;}

		#search-table  {
						width:				700px;
						margin: 				0;
						border:				none;
						border-collapse: 	collapse;
						font: 					normal 11px/15px verdana, sans-serif;
						color: 				#000;}
						
		#search-table td { 
						padding:				5px;}
		
		#search-table h2 a:link { 	
						font-weight:		bold;
						color: 				#000;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
												
		#search-table h2 a:visited { 	
						font-weight:		bold;
						color:					#666;
						text-decoration: 	none;
						border-bottom: 	1px dotted #666;}
						
		#search-table h2 a:hover { 		
						color: 				#fff; 
						background-color:#000;
						border:				none;}
						
		tr.gray { 
						color: 				#000;
						background-color:#eee;}	
						
#search-table h2 {padding: 			0px;
				font: 					bold 13px/17px verdana, sans-serif;}
				
#search-table h3 {padding: 			0 0 0 22px;
				font: 					bold 13px/17px verdana, sans-serif;
				background:transparent url(http://www.classybikes.com/images/arrow-gray.gif) no-repeat scroll 0pt 50%;	
				}

#search-table .secure h3 {padding: 			0 0 0 22px;
				font: 					bold 13px/17px verdana, sans-serif;
				background:transparent url(httpw://www.classyauto.com/classybikes.com/images/arrow-gray.gif) no-repeat scroll 0pt 50%;	
				}

