@charset "utf-8";

/* CSS Document */
	
	html * {
		margin: 0;
		padding: 0;
		list-style: none;
		text-decoration: none;
	}
	img {
		border: none;
	}
	body {
		text-align: center;
		background: #252525 url(images/bg_body3.jpg) repeat-x scroll left top;
	}

	#container {
		width: 970px;
		margin: 0 auto;
		text-align: left;
		position: relative;
		padding-top: 90px;
	}
	#logo {
		position: absolute;
		left: 10px;
		top: 0px;
		width: 380px;
		height: 100px;
		background: url(images/logo2.png) no-repeat scroll 0px 5px;
	}
	#logo span { display: none; }
	

/* --- NAVIGATION --- */

	#navigation1 {
		position: absolute;
		top: 44px;
		right: 30px;
	}
	#navigation1 li {
		float: left;
		margin-right: 10px;
	}
	#navigation1 li a {
		display: block;
		height: 40px;
	}
	#navigation1 li.current { background: url(images/btn_arrows.png) no-repeat scroll center center; }
	#navigation1 li a span { display: none; }
	
	#navigation1 li.news a { width: 61px; background:url(images/btn_news_off.png) no-repeat scroll center center; }
	#navigation1 li.news a:hover,
	#navigation1 li.news.current a { background-image:url(images/btn_news_on.png) }
	
	#navigation1 li.about a { width: 67px; background:url(images/btn_about_off.png) no-repeat scroll center center; }
	#navigation1 li.about a:hover,
	#navigation1 li.about.current a { background-image:url(images/btn_about_on.png) }
	
	#navigation1 li.photosvideos a { width: 154px; background:url(images/btn_photos_videos_off.png) no-repeat scroll center center; }
	#navigation1 li.photosvideos a:hover,
	#navigation1 li.photosvideos.current a { background-image:url(images/btn_photos_videos_on.png) }
	
	#navigation1 li.contact a { width: 85px; background:url(images/btn_contact_off.png) no-repeat scroll center center; }
	#navigation1 li.contact a:hover,
	#navigation1 li.contact.current a { background-image:url(images/btn_contact_on.png) }
	
	#navigation1 li.buy a { width: 48px; background:url(images/btn_buy_off.png) no-repeat scroll center center; }
	#navigation1 li.buy a:hover,
	#navigation1 li.buy.current a { background-image:url(images/btn_buy_on.png) }

	#navigation2 {
		position: absolute;
		top: 0px;
		right: 50px;
	}
	#navigation2 li {
		display: inline;
		color: #333;
	}
	#navigation2 li a {
		font: .7em Verdana, Arial, sans-serif;
		color: #666;
	}



/* --- FEATURE --- */

	#feature {
		width: 970px;
		height: 230px;
		background: url(images/bg_feature_sema3.png);
		margin-bottom: -10px;
	}
	#feature h2 {
		width: 710px;
		font: bold italic 1.3em/1.5em "Trebuchet MS", Verdana, sans-serif;
		color: #fff;
		position: relative;
		top: 80px;
		left: 240px;
	}
	#feature h2 span {
		font: bold italic 1.9em/.9em "Trebuchet MS", Verdana, sans-serif;
		letter-spacing: -.05em;
	}



/* --- HEADER (for subs) --- */

	#header {
		width: 970px;
		height: 70px;
		margin-bottom: -10px;
		background: url(images/bg_header_blank.png);
		overflow: hidden;
	}
	#header.news{ background: url(images/bg_header_news.png); }
	#header.about { background: url(images/bg_header_about.png); }
	#header.photosvideos { background: url(images/bg_header_photos.png); }
	
	#header h2 { color: #fff; font: bold italic 1.5em/70px "Trebuchet MS", Verdana, sans-serif; padding-left: 70px; margin-left: 20px; }
	#header.news h2 { background: url(images/icon_home.png) no-repeat scroll left center; padding-left: 55px; margin-left: 25px; }
	#header.photosvideos h2 { background: url(images/icon_camera.png) no-repeat scroll left center; }
	#header.about h2 { background: url(images/icon_headunit3.png) no-repeat scroll left center; }
	#header.contact h2 { background:url(images/icon_contact.png) no-repeat scroll left center; }
	#header.buy h2 { background:url(images/icon_cart.png) no-repeat scroll left center; }



/* --- 3 COLUMN LAYOUT --- */

	/* -- Column 1 of 3 -- */

	#threecol1 { width: 225px; float: left; }
	#threecol1 .header { width: 225px; height: 50px; background: url(images/bg_smallbox_header.png); }
	#threecol1 .header span { display: none; }
	
	#threecol1 .supp { margin-top: -10px; }
	
	#threecol1 .header#empty { background: url(images/bg_smallbox_header_empty.png); height: 20px; }
	#threecol1 .header#events { background: url(images/bg_h2_events.png); }
	#threecol1 .header#newphotos { background: url(images/bg_h2_newphotos.png); }
	
	#threecol1 .body { width: 225px; background: url(images/bg_smallbox_footer.png) no-repeat scroll center bottom; padding-bottom: 20px; }
	#threecol1 .body li { background: url(images/bg_smallbox.png); padding: 10px 30px; }
	#threecol1 .body li h3 {	color: #fff; font: bold 1em "Trebuchet MS", Verdana, sans-serif; }
	#threecol1 .body li h3 a { color: #fff; }
	#threecol1 .body li h3 a:hover { color: #fff; border-bottom: 1px solid #e00; }
	#threecol1 .body li p { color: #777; font: .7em/1.7em Verdana, sans-serif; }

	#threecol1 .body li p.boldnote { color: #d11; font: bold italic .8em/2em "Trebuchet MS", Verdana, sans-serif; }

	#threecol1 .body li p a { color: #ccc; font: bold 1em Helvetica, Arial, sans-serif; }
	#threecol1 .body li p a:hover { color: #fff; border-bottom: 1px solid #e00; }
	#threecol1 .body li p a.current { color: #fff; }

	/* -- Column 2 of 3  -- */

	#threecol2 { width: 540px; float: left; margin-left: -10px; }
	#threecol2 .header { width: 540px;	height: 50px; background: url(images/bg_mediumbox_header.png); }
	#threecol2 .header span { display: none; }
	
	#threecol2 .header#news { background: url(images/bg_h2_news.png); }
	
	#threecol2 .body { width: 540px; background: url(images/bg_mediumbox_footer.png) no-repeat scroll center bottom; padding-bottom: 40px; }
	#threecol2 .body li { background: url(images/bg_mediumbox.png); padding: 10px 25px; }
	#threecol2 .body li.alt { background: url(images/bg_mediumbox_alt.png); }
	
	#threecol2 .body li h3 { color: #fff; font: bold 1.1em/1.4em "Trebuchet MS", Verdana, sans-serif; margin: .25em 0; }
	
	#threecol2 .body li p { color: #ccc; font: .7em/1.5em Helvetica, Verdana, sans-serif; margin: .5em 0;  }
	#threecol2 .body li p.bold { font-weight: bold; color: #dfdfdf; }
	#threecol2 .body li p.date { color: #777; }
	#threecol2 .body li.alt p.date { color: #999; }
	#threecol2 .body li p.quote { color: #464646; font: .8em/1.5em Verdana, Arial, sans-serif; padding: 1em; background-color: #eee; }
	#threecol2 .body li p.link { color: #ccc; font: bold .8em/1.5em Helvetica, Arial, sans-serif; margin: .5em 0; }
	#threecol2 .body li p.link a { color: #efefef; }
	#threecol2 .body li p.link a:hover { color: #fff; border-bottom: 1px solid #e00; }

	#threecol2 .body .floatpicleft { float: left; margin: 0 .25em 0 0; }
	#threecol2 .body .floatpicright { float: right; margin: 0 0 0 .25em; }

	/* -- Column 3 of 3 -- */

	#threecol3 { width: 225px; float: left; margin-left: -10px; }
	#threecol3 .header { width: 225px; height: 50px; background: url(images/bg_smallbox_header.png); }
	#threecol3 .header span { display: none; }
	
	#threecol3 .supp { margin-top: -10px; }
	#threecol3 .empty { background: url(images/bg_smallbox_header_empty.png); height: 20px; }
	#threecol3 .header#sohow { background: url(images/bg_h2_sohow.png); }
	
	#threecol3 .body { width: 225px; background: url(images/bg_smallbox_footer.png) no-repeat scroll center bottom; padding-bottom: 20px; }
	#threecol3 .body li { background: url(images/bg_smallbox.png); padding: 10px 30px; text-align: center; }
	#threecol3 .body li p { color: #777; font: .7em/1.7em Verdana, sans-serif; text-align: left; }

	#threecol3 .body li p a { color: #ccc; font: bold 1em Helvetica, Arial, sans-serif; }
	#threecol3 .body li p a:hover { color: #fff; border-bottom: 1px solid #e00; }
	#threecol3 .body li p a.current { color: #fff; }


/* --- 2 COLUMN LAYOUT --- */

	/* -- Column 1 of 2 -- */

	#twocol1 { width: 225px; float: left; }
	#twocol1 .header { width: 225px; height: 20px; background: url(images/bg_smallbox_header_empty.png); }
	#twocol1 .header span { display: none; }
	
	#twocol1 .supp { margin-top: -10px; }
	
	#twocol1 .body { width: 225px; background: url(images/bg_smallbox_footer.png) no-repeat scroll center bottom; padding-bottom: 20px; }
	#twocol1 .body li { background: url(images/bg_smallbox.png); padding: 1px 30px; }
	#twocol1 .body li p { color: #777; font: .7em/1.5em Verdana, sans-serif; text-align: left; margin: .75em 0; }
	#twocol1 .body li p.subp { margin-top: 1px; }
	#twocol1 .body li p.boldnote { color: #d11; font: bold italic .8em "Trebuchet MS", Verdana, sans-serif; }
	#twocol1 .body li p a { color: #ccc; font: bold 1em/1em Helvetica, Arial, sans-serif; }
	
	#twocol1 .body li p noscript { color: red; }
	
	#twocol1 .body li a { color: #aaa; font: bold .9em Helvetica, Arial, sans-serif; }
	#twocol1 .body li a:hover { color: #fff; border-bottom: 1px solid #e00; }
	#twocol1 .body li a.current { color: #fff; }

	/* -- Column 2 of 2 -- */

	#twocol2 { width: 755px; float: left; margin-left: -10px; }
	#twocol2 .header { width: 755px; height: 20px; background: url(images/bg_largebox_header.png); }
	
	#twocol2 .supp { margin-top: -10px; }
	
	#twocol2 .body { width: 755px; background: url(images/bg_largebox.png); text-align: left; padding: 1px 0px; float: left; }
	
	#twocol2 .footer { width: 755px; background: url(images/bg_largebox_footer.png) no-repeat scroll center bottom; clear: left; height: 20px; }
	
	#twocol2 .body p { color: #000; font: .7em/1.5em Verdana, sans-serif; margin: 1em 30px; }

	#twocol2 .body p a { color: #444; font-weight: bold; }
	#twocol2 .body p a:hover { border-bottom: 1px solid #fff; }
	
	#twocol2 .body .floatpicleft { float: left; margin: 0 1em .5em 30px; }
	#twocol2 .body .floatpicright { float: right; margin: 0 30px .5em 1em; }
	
	#twocol2 .body li.photosvideos { padding: 10px 30px; float: left; }
	#twocol2 .body li.photosvideos #photoicon { float: left; margin-right: 5px; }
	#twocol2 .body li.photosvideos #videoicon { float: left; }
	#twocol2 .body li.photosvideos #photoicon a,
	#twocol2 .body li.photosvideos #videoicon a { color: #fafafa; font: bold 2em "Trebuchet MS", Verdana, sans-serif; display: block; width: 345px; padding-top: 250px; text-align: center; }
	#twocol2 .body li.photosvideos #photoicon a { background: url(images/icon_bigphotos.png) no-repeat center 15px; }
	#twocol2 .body li.photosvideos #photoicon a:hover { color: #fff; background-image: url(images/icon_bigphotos_on.png); }
	#twocol2 .body li.photosvideos #videoicon a { background: url(images/icon_bigvideos.png) no-repeat center 15px; }
	#twocol2 .body li.photosvideos #videoicon a:hover { color: #fff; background-image: url(images/icon_bigvideos_on.png); }
	
	#twocol2 .body li.photos { padding: 0; }
	#twocol2 .body li.photos .header { width: 715px; height: 20px; background: url(images/bg_photopicheader.gif); margin: 0 auto; }
	#twocol2 .body li.photos .pic { width: 715px; background: url(images/bg_photopic.gif); display: block; margin: 0 auto; text-align: center; }
	#twocol2 .body li.photos .footer { width: 715px; background: url(images/bg_photopicfooter.gif) no-repeat scroll center bottom; margin: 0 auto; padding-bottom: 25px; padding-top: 1px; }
	#twocol2 .body li.photos .footer p { color: #333; font: .7em/1.4em Helvetica, Arial, sans-serif; text-align: center; }
	
	#twocol2 .body li.videos { padding: 0; }
	#twocol2 .body li.videos .header { width: 715px; height: 20px; background: url(images/bg_photopicheader.gif); margin: 0 auto; }
	#twocol2 .body li.videos .video { width: 715px; background: url(images/bg_photopic.gif); display: block; margin: 0 auto; text-align: center; padding: 5px 0 1px 0; }
	#twocol2 .body li.videos .footer { width: 715px; background: url(images/bg_photopicfooter.gif) no-repeat scroll center bottom; margin: 0 auto; height: 20px; padding-top: 1px; }
	#twocol2 .body li.videos .footer p { color: #333; font: .7em/1.4em Helvetica, Arial, sans-serif; text-align: center; }
	
	#twocol2 .body h3 { margin: 0px 25px; }
	#twocol2 .body h4 { margin: .5em 30px 5px 30px; }
	#twocol2 .body h3#h3ourstory { width: 120px; height: 30px; background: url(images/bg_h3_ourstory.gif); }
	#twocol2 .body h3#h3thesensor { width: 120px; height: 30px; background: url(images/bg_h3_thesensor.gif); }
	#twocol2 .body h3#h3theheadunit { width: 150px; height: 30px; background: url(images/bg_h3_theheadunit.gif); }
	#twocol2 .body h3#h3contactus { width: 120px; height: 30px; background: url(images/bg_h3_contactus.gif); }
	#twocol2 .body h3#h3availability { width: 150px; height: 30px; background: url(images/bg_h3_availability.gif); }
	#twocol2 .body h3#h3orderform { width: 120px; height: 30px; background: url(images/bg_h3_orderform.gif); }
	#twocol2 .body h3 span { display: none; }
	#twocol2 .body h4 { color: #333; font: bold 1em/1.5em "Trebuchet MS", Verdana, sans-serif; }
	
	#twocol2 .body .hr { margin: 5px 30px; border-bottom: 1px solid #999; clear: both; }
	#twocol2 .body .hr hr { display: none; }


	#twocol2 .body #contactform {	margin: 10px 30px; }
	#twocol2 .body #contactform fieldset { margin: 1em 0; padding: .5em 1em; border: 1px solid #ccc; }
	#twocol2 .body #contactform legend { color: #999; font: bold .9em "Trebuchet MS", Verdana, sans-serif; text-transform:uppercase; letter-spacing: .1em; }
	#twocol2 .body #contactform ol li { margin: .5em 0; color: #444; font: .7em "Trebuchet MS", Verdana, sans-serif; }
	#twocol2 .body #contactform ol li label { display: block; margin: 0 0 5px 2px; }
	#twocol2 .body #contactform ol li label.error { display: inline; margin: 0 0 5px 2px; color: #f00; }

	#twocol2 .body #jswarning { background-color: white; border: 5px solid red; margin: 10px 30px; padding: 1.5em 0.5em; }

	#twocol2 .body #orderform { margin: 10px 30px; }
	#twocol2 .body #orderform fieldset { margin: 1em 0; padding: .5em 1em; border: 1px solid #ccc; }
	#twocol2 .body #orderform legend { color: #999; font: bold .9em "Trebuchet MS", Verdana, sans-serif; text-transform:uppercase; letter-spacing: .1em; }
	#twocol2 .body #orderform ol li { margin: .5em 0; color: #444; font: .7em "Trebuchet MS", Verdana, sans-serif; }
	#twocol2 .body #orderform ol li label { display: block; margin: 0 0 5px 2px; }
	#twocol2 .body #orderform ol li label.error { display: inline; margin: 0 0 5px 2px; color: #f00; }
	#twocol2 .body #orderform p { margin: 1em 0; font-size: 1em; }	
	#twocol2 .body #orderform p.bborder { border-bottom: 1px solid #bbb; padding-bottom: .5em; }
	#twocol2 .body #orderform p.tborder { border-top: 1px solid #bbb; padding-top: .5em; }
	#twocol2 .body #orderform p.warning { color: #f00; }
	
	#twocol2 .body #orderform ol#car_information li label { width: 7em; }
	#twocol2 .body #orderform ol li select { width: 10em; color: #666; }
	#twocol2 .body #orderform ol li input#new_tire_size { margin-bottom: .5em; }	


/* --- FOOTER --- */

	#footer {
		clear: both;
		width: 950px;
		border-top: 1px solid #555;
		margin: 10px;
		margin-bottom: 50px;
		text-align: right;
	}
	#footer p {
		font: .65em/.9em Helvetica, Arial, sans-serif;
		color: #666;
		padding: 10px;
	}
	#footer a { 
		color: #777;
	}