@charset "UTF-8";
/* CSS Document */


/* ======= MEYER RESET STYLES ================= */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent; }
	

/* ======= COMMON STYLES ================= */

body {
	background: url(images/bg.png) repeat-x top #f6f9f6;
	font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif;
	text-align: center; }
	
ul, ol {
	margin:20px 0 20px 40px; }

p {
	margin-bottom:15px; }

h1 {
	margin-bottom:15px;
	font-size:1.5em;
	line-height:1.5em; }

h2 {
	margin-bottom:15px;
	font-size:1.5em;
	line-height:1.5em; }

h3 {
	margin:0;
	font-size:0.9em; }

a, a:visited, a:link {
	color:#187ba4;
	text-decoration:none; }

a:hover, a:focus {
	text-decoration:underline; }

a:active {
	text-decoration:none; }

.clear {
	clear:both; }
 

 
/* ======= PAGE LAYOUT ================= */

div#BackgroundWrapper {
	margin:0;
	padding:0;
	width:100%;
	text-align:center; }

div#PageWrapper {
	width: 898px;
	margin:0 auto;
	text-align:left; }

div#Header {
	width:898px;
	height:113px; }

	div#Header #Logo {
		width:195px;
		height:55px;
		float:left;
		margin-top:48px; }
	
	div#Header #TopInfo {
		background:url(images/top-info.png) no-repeat top;
		width:695px;
		height:39px;
		float:left;
		margin-top:60px;
		margin-left:7px; }
	
div#MenuWrapper {
	height:35px; }

	div#MenuWrapper .Left {
		width:6px;
		background:url(images/menu-left.png) no-repeat top left;
		float:left;
		height:35px; }
	
	div#MenuWrapper .Mid {
		background:url(images/menu-bg.png) repeat-x top;
		width:886px;
		float:left;
		height:35px;  }
	
	div#MenuWrapper .Right {
		width:6px;
		background:url(images/menu-right.png) no-repeat top right;
		float:left;
		height:35px;  }

div.BannersWrapper {
	clear:both;
	margin:5px 0 0 0; }

	div.BannersWrapper #TruckLift {
		background:url(images/truck-lift-banner.jpg) no-repeat top;
		width:260px;
		height:368px;
		float:left;
		margin-right:5px; }
	
	div.BannersWrapper #JQueryWrapper {
		width:633px;
		height:368px;
		float:left;}
	
		div.BannersWrapper #JQueryWrapper .Top {
			width:633px;
			height:248px;
			background:url(images/jquery-top-bg.png) no-repeat bottom; }
			
		div.BannersWrapper #JQueryWrapper .Bottom {
			width:633px;
			height:120px;
			background:url(images/jquery-bottom.jpg) no-repeat top; }
		
		div.BannersWrapper img {
			padding-bottom:5px; }

div.FeaturedCategories {
	width:898px;
	margin-bottom:5px;
	padding-top: 5px;
}

	div.FeaturedCategories .Top {
		background:url(images/featured-categories-top.png) no-repeat right;
		height:19px;
		width:898px; }

	div.FeaturedCategories .Middle {
		background:url(images/featured-categories-middle.png) repeat-x;
		height:134px; }
	
		div.FeaturedCategories .Middle img {
			padding:8px 0 10px 0; }
		
		div.FeaturedCategories .Middle .ProductWrapper {
			margin:0 22px; }

			div.FeaturedCategories .Middle .Product {
				background:url(images/featured-categories-separator.png) right no-repeat;
				height:134px;
				float:left;
				padding:0 28px;
				text-align:center;
				display:block; }
				
				div.FeaturedCategories .Middle .Product div {
					clear:both;
					height:85px;
					margin:8px 0 10px 0; }
				
				div.FeaturedCategories .Middle .Product div#car-audio {
					background:url(images/featured-categories-car-audio.png) no-repeat;
					width:62px; }
				
				div.FeaturedCategories .Middle .Product div#car-alarms {
					background:url(images/featured-categories-car-alarms.png) no-repeat;
					width:68px; }
				
				div.FeaturedCategories .Middle .Product div#performance {
					background:url(images/featured-categories-performance.png) no-repeat;
					width:119px; }
				
				div.FeaturedCategories .Middle .Product div#wheels-tires {
					background:url(images/featured-categories-tires-wheels.png) no-repeat;
					width:65px;
					margin-left:10px; }
				
				div.FeaturedCategories .Middle .Product div#gps-navigation {
					background:url(images/featured-categories-gps-navigation.png) no-repeat;
					width:74px;
					margin-left:6px;  }
				
				div.FeaturedCategories .Middle .Product div#sirens-lighting {
					background:url(images/featured-categories-sirens-lighting.png) no-repeat;
					width:55px;
					margin-left:22px; }
			
				div.FeaturedCategories .Middle .Product p {
					font-size:0.75em;
					font-weight:bold; }
				
				div.FeaturedCategories .Middle .Product a, .FeaturedCategories .Middle .Product a:link, .FeaturedCategories .Middle .Product a:visited {
					color:#162d39;
					text-decoration:none; }
				
				div.FeaturedCategories .Middle .Product a:hover, .FeaturedCategories .Middle .Product a:focus {
					color:#005581; }
			
	div.FeaturedCategories .Bottom {
		background:url(images/featured-categories-bottom.png) no-repeat;
		height:6px;
		width:898px; }
	
div#ContentWrapper {
	margin:0 auto;
	width:898px;
	padding:0px;
	display:block; }
	
div#SidePane {
	display:block;
	padding: 0px;
	background:url(images/sidepane-bg.png) repeat-y;
	width:260px;
	text-align:left;
	float:left;}

	div#SidePane span {
		font-size:0.75em;
		position:relative;
		top:9px;
		left:45px;
		width:200px; }
	
	div#SidePane a {
		color:#303030; }
		
	div#SidePane a:hover {
		color:#006d98; }
	
	div#SidePane p {
		color:#fff;
		padding-left:20px;
		position:relative;
		top:-10px; }
	
	div#SidePane #AllProducts {
		background:url(images/all-products.png) no-repeat;
		width:260px;
		height:43px; }
		
	div#SidePane #AllProductsTop {
		background:url(images/all-products-top.png) no-repeat;
		width:260px;
		height:6px; }

div#ContentPane {
	display:block;
	margin-left:5px;
	width:633px;
	float:left;}
	
	div#ContentPane .Top {
		background:url(images/contentpane-top.png) no-repeat top;
		width:633px;
		height:6px; }

	div#ContentPane .Middle {
		font-size:0.75em;
		padding:30px;
		width:573px;
		background:url(images/contentpane-bg.png) repeat-y;
		line-height:20px;
		text-align:left;
		min-height:453px; }
	
	div#ContentPane .Bottom {
		background:url(images/contentpane-bottom.png) no-repeat top;
		width:633px;
		height:6px; }

div#FooterPane {
	margin:15px auto 40px auto;
	padding-top:15px;
	width:898px;
	text-align:center;
	height: 73px;
	color: #162d39;
	font-size: 0.6875em; 
	line-height:16px;
	clear:both; }

	div#FooterPane a, .FooterPane a:visited {
		color:#162d39;
		text-decoration:underline; }
	
	div#FooterPane a:hover, .FooterPane a:focus {
		color: #005581; }

table.side-gallery {
	float:right;
	width:200px;
	margin-left:15px; }

	table.side-gallery p.caption {
		padding-bottom:10px;
		font-size:0.875em;
		color:#515455; }
	
	table.side-gallery img {
		border:1px solid #999c9e; }
		

/* ======= JQUERY ELEMENTS ================= */

.slideshow {
	width:633px;
	height:248px;
	margin:auto;
	overflow:hidden; }
	
.slideshow img {
	margin:0;
	padding:0; }

#car-audio-thumbs {
	height:150px;
	padding:20px;
	margin:5px 0 20px 0; }

.ColorBox {
	float:left;
	margin:1px;
	border:1px solid #999c9e; }
	
	
	
/* ======= LOGOS ================= */


.Logos {
	width:100%;
	margin-bottom:30px;
}

.Logos .Brands {
	text-align: center; }

.Logos .Brands td {
	vertical-align:middle;
	padding-bottom:20px; }

.Logos .TopLeft {
	background:url(images/car-logos/table-top-left.png) top left no-repeat;}
		
.Logos .TopCenter {
	background:url(images/car-logos/table-top.png) top repeat-x;
	height:6px;
	margin:0 6px;}

.Logos .TopRight {
	background:url(images/car-logos/table-top-right.png) top right no-repeat;}

.Logos .BottomRight {
	background:url(images/car-logos/table-bottom-right.png) right no-repeat;}

.Logos .BottomCenter {
	background:url(images/car-logos/table-bottom.png) bottom repeat-x;
	height:6px;
	margin:0 6px;}

.Logos .BottomLeft {
	 background:url(images/car-logos/table-bottom-left.png) left no-repeat;}

.Logos .Left {
	background:url(images/car-logos/table-left.png) left repeat-y;}
	
.Logos .Inner {
	background:#fff;
	margin:0 6px;
	padding:30px 20px 10px 20px;
}
	
.Logos .Right {
	background:url(images/car-logos/table-right.png) right repeat-y;}



/* ======= BUTTONS ================= */

.ProductsButton {
	width:260px;
	height:31px; }
	
.ProductsButton a, .ProductsButton a:visited {
	text-decoration:none;
	width:260px;
	height:31px;
	display:block;
	background-position:left top;
	background-repeat: no-repeat;
	background-image: url(images/btn-sidepane.png); }
	
.ProductsButton a:hover {
	background-position: right top; }

.ProductsButtonNoLink {
	width:242px;
	height:47px;
	background-image: url(images/btn-services.png); }
	
.LearnMore {
	width:90px;
	height:29px;
	position:relative;
	top:319px;
	left:145px; }
	
.LearnMore a, .LearnMore a:visited {
	text-decoration:none;
	width:90px;
	height:29px;
	display:block;
	background-position:left top;
	background-image: url(images/btn-learn-more.png); }
	
.LearnMore a:hover {
	background-position: right top; }


/* ======= SEO MENU ================= */

/******************** Up State *************************/

.SEOMenu {
	margin:0 auto;
	width:898px;
	height:35px;
	font-weight:bold;
	position:relative;
	z-index:9999; }

.SEOMenu ul{
	list-style-type:none;
	padding:0;
	margin:0;
	z-index:3; }

.SEOMenu li{
	list-style-type:none;
	position:relative;
	z-index:2;
	float: left; }

.SEOMenu li.Separator {
	background:url(images/menu-separator.png) no-repeat left;
	width:1px;
	height:35px;
	display:block; }

.SEOMenu table {
	position:absolute;
	border-collapse:collapse;
	left:0;
	top:0; }

.SEOMenu a, .SEOMenu :visited {
	color:#fff;
	text-decoration:none;
	font-size:11px; }

.SEOMenu a b, .SEOMenu :visited b {
	text-align:center;
	display:block;
	height:35px;
	line-height:35px;
	padding:0 10px;
	cursor:hand;
	float: left; }
		
.SEOMenu .CurrentItem a b, .SEOMenu .CurrentItem :visited b, .SEOMenu .ParentItem a b, .SEOMenu .ParentItem :visited b {
	background:url(images/menu-hover.png) left no-repeat;
	color:#c7e9f2; }
	
.SEOMenu :hover, a:hover {
	color:#000;
	white-space:normal; }

.SEOMenu a:hover b {
	color:#c7e9f2;
	background: url(images/menu-hover.png) left no-repeat;
	text-decoration:none;
}
	
.SEOMenu :hover > a b {
	color:#c7e9f2;
	background: url(images/menu-hover.png) left no-repeat;
	text-decoration:none; }

.SEOMenu :visited, .SEOMenu :hover {
	color:#fff;
	text-decoration:none; }

.SEOMenu .CurrentItem a:hover b, .SEOMenu .ParentItem a:hover b {
	color:#c7e9f2;
	background: url(images/menu-hover.png) left no-repeat; }

.SEOMenu .CurrentItem :hover > a b, .SEOMenu .ParentItem :hover > a b {
	color:#c7e9f2;
	background: url(images/menu-hover.png) left no-repeat; }

.SEOMenu ul ul .CurrentItem a:hover b {
	color:#c7e9f2;
	background: transparent; }
	
.SEOMenu ul ul .CurrentItem :hover > a b {
	color:#c7e9f2;
	background: transparent; }


/******************** Flyout *************************/

.SEOMenu ul ul, 
.SEOMenu ul :hover ul ul, 
.SEOMenu ul :hover ul :hover ul ul,
.SEOMenu ul :hover ul :hover ul :hover ul ul{position:absolute; left:-9999px; top:-9999px; width:0; height:0; }
.SEOMenu ul :hover ul {left:0px;top:35px; background:url(images/dropdown-bg.png) no-repeat top; border: 0px solid #fff; white-space:nowrap; width:170px; height:150px; color:#fff;  }
.SEOMenu ul :hover ul li {display:block; height:28px; position:relative; float:left; width:auto; color:#fff; text-transform:none; }
.SEOMenu ul :hover ul li a {display:block; height:28px; width:170px; text-indent:10px; color:#fff; text-decoration:none; font-weight:normal;padding-bottom:8px; }
.SEOMenu ul :hover ul li a:hover {background:url(images/dropdown-hover.png) no-repeat left; color:#fff; width:170px; white-space:nowrap;}
.SEOMenu ul :hover ul:hover ul li a:hover {width:170px;}
.SEOMenu ul :hover ul :hover ul,
.SEOMenu ul :hover ul :hover ul :hover ul,
.SEOMenu ul :hover ul :hover ul :hover ul :hover ul,
.SEOMenu ul :hover ul :hover ul :hover ul :hover ul :hover ul
{left:170px; top:0px;  background: #033c53; color:#030; white-space:nowrap; width:170px; z-index:200; height:auto;}

#FlyoutBottom {
	height:36px;
	background: #033c53;}


/* ======= ETC. ================= */

#map {
	margin-bottom:40px; }

img#bbb-logo {
	float:right;
	margin-top:5px;
	margin-right:30px; }
