/* Import fonts */
@import url(http://fonts.googleapis.com/css?family=Monda:400,700);
@font-face {
	font-family:'Cantarell';
	src:url('Cantarell-Regular-webfont.eot');
	src:url('Cantarell-Regular-webfont.svg#CantarellRegular') format('svg'),
url('Cantarell-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('Cantarell-Regular-webfont.woff') format('woff'),
url('Cantarell-Regular-webfont.ttf') format('truetype');
	font-weight:400;
	font-style:normal;
}
@font-face {
	font-family:'Cantarell';
	src:url('Cantarell-Bold-webfont.eot');
	src:url('Cantarell-Bold-webfont.svg#CantarellBold') format('svg'),
url('Cantarell-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('Cantarell-Bold-webfont.woff') format('woff'),
url('Cantarell-Bold-webfont.ttf') format('truetype');
	font-weight:700;
	font-style:normal;
}
@font-face {
	font-family:'Cantarell';
	src:url('Cantarell-Oblique-webfont.eot');
	src:url('Cantarell-Oblique-webfont.svg#CantarellOblique') format('svg'),
url('Cantarell-Oblique-webfont.eot?#iefix') format('embedded-opentype'),
url('Cantarell-Oblique-webfont.woff') format('woff'),
url('Cantarell-Oblique-webfont.ttf') format('truetype');
	font-weight:400;
	font-style:italic;

}
@font-face {
	font-family:'Cantarell';
	src:url('Cantarell-BoldOblique-webfont.eot');
	src:url('Cantarell-BoldOblique-webfont.svg#CantarellBoldOblique') format('svg'),
url('Cantarell-BoldOblique-webfont.eot?#iefix') format('embedded-opentype'),
url('Cantarell-BoldOblique-webfont.woff') format('woff'),
url('Cantarell-BoldOblique-webfont.ttf') format('truetype');
	font-weight:700;
	font-style:italic;
}

/* Universal styles */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
	display:block;
}

audio,
canvas,
video {
	display:inline-block;
	*display:inline;
	*zoom:1;
}

audio:not([controls]) {
	display:none;
	height:0;
}

[hidden] {
	display:none;
}

html {
	font-size:100%;
	-webkit-text-size-adjust:100%;
	-ms-text-size-adjust:100%;
}

body{
	color:#737373;
	background:#f1f1f1 url(_img/body-bg.png) repeat-y center;
	margin:0;
	padding:0;
	font-family:'Cantarell', Helvetica, Arial, sans-serif;
	text-align:center;
}

html,
button,
input,
select,
textarea {
	font-family:sans-serif;
}

a{
	color:rgb(0,0,255);
	text-decoration:none;
	-webkit-transition:color .25s ease-in-out, border-color .25s ease-in-out;
	-moz-transition:color .25s ease-in-out, border-color .25s ease-in-out;
	-ms-transition:color .25s ease-in-out, border-color .25s ease-in-out;
	-o-transition:color .25s ease-in-out, border-color .25s ease-in-out;
	transition:color .25s ease-in-out, border-color .25s ease-in-out;
}

a:focus {
	outline:thin dotted #eee;
}

a:active,
a:hover {
	outline:0;
}

h1 {
	font:bold 2em/40px 'Monda', sans-serif;
	margin:0 0 0.67em;
}

h2 {
	font-size:1.5em;
	margin:0 0 0.83em;
}

h3 {
	font-size:1.17em;
	margin:0 0 1em;
}

h4 {
	font-size:1em;
	margin:0 0 1.33em;
}

h5 {
	font-size:0.83em;
	margin:0 0 1.67em;
}

h6 {
	font-size:0.67em;
	margin:0 0 2.33em;
}

abbr[title] {
	border-bottom:1px dotted;
}

b,
strong {
	font-weight:700;
}

blockquote {
	margin:0  0 1em;
}

dfn {
	font-style:italic;
}
hr {
	-moz-box-sizing:content-box;
	box-sizing:content-box;
	height:0;
}

p,
pre {
	margin:0 0 1em;
}

code,
kbd,
pre,
samp {
	font-family:monospace, serif;
	_font-family:'courier new', monospace;
	font-size:1em;
}

pre {
	white-space:pre;
	white-space:pre-wrap;
	word-wrap:break-word;

}

q {
	quotes:none;
}

q:before,
q:after {
	content:'';
	content:none;
}

small {
	font-size:80%;
}

sub,
sup {
	font-size:75%;
	line-height:0;
	position:relative;
	vertical-align:baseline;
}

sup {
	top:-0.5em;
}

sub {
	bottom:-0.25em;
}

dl,
menu,
ol,
ul {
	margin:0 0 1em;
}

menu,
ol,
ul,
dd {
	padding:0 0 0 2em;
}

nav ul,
nav ol {
	list-style:none;
	list-style-image:none;
}

img {
	border:0;
	-ms-interpolation-mode:bicubic;
}

svg:not(:root) {
	overflow:hidden;
}


form {
	margin:0;
}


fieldset {
	border:1px solid rgb(0,0,255);
	margin:0 2px;
	padding:0.35em 0.625em 0.75em;
}

legend {
	border:0;
	padding:0;
	white-space:normal;
	*margin-left:-7px;
}

button,
input,
select,
textarea {
	font-size:100%;
	margin:0;
	vertical-align:baseline;
	*vertical-align:middle;
}

button,
input {
	line-height:normal;
}

button,
select {
	text-transform:none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance:button;
	cursor:pointer;
	*overflow:visible;
}

button[disabled],
html input[disabled] {
	cursor:default;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing:border-box;
	padding:0;
	*height:13px;
	*width:13px;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border:0;
	padding:0;
}

textarea {
	overflow:auto;
	vertical-align:top;
}



/* Universal Layout Styles */

.inner-container{
	width:960px;
	margin:0 auto;
	text-align:left;
}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

.inline-list{
	list-style:none;
}
.inline-list li{
	display:inline-block;
	*float:left;/* Mimic inline-block IE7 */
}

.table{
	display:table;
}

.table-cell{
	display:table-cell;
}

nav li a{
	color:rgb(106,106,106);
}

nav ul{
	margin:0;
	padding:0;
}

/* Ordered Layout Styles */

#top-text{
	background:#f1f1f1;
	height:126px;
	margin:0;
	font:normal .75em/20px 'Helvetica', sans-serif;
	text-align:center;
}

#header{
	background-color:rgb(255,255,255);
	background-color:rgba(255,255,255,.9);
	*background-color:rgb(255,255,255); /* IE7 requires this to be seperate */
	position:fixed;
	z-index:10;
	top:20px;
	width:100%;
	border:1px solid rgb(106,106,106);
	border-color:rgba(106,106,106,.25);
	border-left:none;
	border-right:none;
}

#header h1{
	background:none;
	display:none;
	height:106px;
	width:240px;
	float:left;
	margin:0;
	padding:0;
	overflow:hidden;
}

#header h1 a{
	display:block;
	height:100%;
	width:100%;
	text-indent:-999em;
}

.nav-height{
	background:url(_img/header-bg.png) top no-repeat;
	height:65px;
	padding-top:40px;
}

.nav-height > .table{
	width:100%;
}

.nav-height > .table .table-cell{
	border-bottom:2px solid rgb(0,0,255);
	*border:none; /* Fix double border - IE7 */
}

.nav-main{
	display:table-cell;
}

.nav-main ul{
	float:right;
	text-transform:capitalize;
}

.nav-main li a:hover{
	color:rgb(0,0,255);
}

.nav-main li{
	margin:0 25px 2px 0;
	*padding-bottom:2px;
	vertical-align:middle;
}

.nav-main li a{
	font:700 1em 'Monda', sans-serif;
	font-family:Arial/9; /* IE8 hack to display better font */
	border-bottom:2px solid rgb(0,0,255);
	text-transform:uppercase;
}

.nav-main li a:hover{
	border-bottom-color:rgba(237,28,36,.1);
}

#products-drop-down:after{
	content:' \25BC';
}

#nav-products{
	width:100%;
	overflow:hidden;
	display:none;
	border-top:1px solid rgb(106,106,106);
	border-top-color:rgba(106,106,106,.25);
}

.nav-multi-column{
	display:table;
	box-sizing:border-box;
	-moz-box-sizing: border-box;
	padding:5px 40px 15px;
}

.nav-multi-column > li{
	display:table-cell;
	*float:left; /* Mimic display:table-cell in IE7 */
}


.nav-multi-column > li > a{
	color:rgb(0,0,255);
	display:block;
	margin:0 1em .5em 0;
	border-bottom:2px solid rgb(106,106,106);
	border-bottom-color:rgba(106,106,106,.5);
	font:700 1em/2.5em 'Monda', sans-serif;
	font-family:Arial/9; /* IE8 hack to display better font */
	font-weight:700;
}

.nav-multi-column > li > a:hover{
	border-bottom-color:rgba(237,28,36,.1);
}

.nav-multi-column > li li:before{
	content:'\25A0';
	padding-right:1em;
}

.nav-multi-column > li a:hover{
	color:rgb(0,0,255);
}

.slider-container{
	width:100%;
	min-width:960px;
	overflow:hidden;
	position:relative;
}

#slider{
	height:240px;
	list-style:none;
	padding:0;
	text-align:center;
	display:none;
}

#slider li{
	background-size:320px 240px;
	width:320px;
	height:240px;
	float:left;
}

#slider li a {
	display:block;
	width:320px;
	height:40px;
	padding-top:200px;
	overflow:hidden;
	font:700 2em/40px 'Monda', sans-serif;
	text-align:left;
}

#slider li a, .photo-list li a{
	color:rgb(255,255,255);
	color:rgba(255,255,255,.5);
	*color:rgb(255,255,255); /* IE7 fix */
	filter:alpha(opacity=50) progid:DXImageTransform.Microsoft.Glow(Color=#000000,Strength=2); /* IE8/7 fix */
}

	

.slide-bed-liner{
	background-image:url(_img/slides/bed-liner.jpg);
}
.slide-chrome-accesories{
	background-image:url(_img/slides/chrome-accesories.jpg);
}
.slide-custom-interiors{
	background-image:url(_img/slides/custom-interiors.jpg);
}
.slide-fender-flare{
	background-image:url(_img/slides/fender-flare.jpg);
}
.slide-floor-liners{
	background-image:url(_img/slides/floor-liners.jpg);
}
.slide-grille-guard{
	background-image:url(_img/slides/grille-guard.jpg);
}
.slide-mud-flaps{
	background-image:url(_img/slides/mud-flaps.jpg);
}
.slide-paint-protection{
	background-image:url(_img/slides/paint-protection.jpg);
}
.slide-roof-rack{
	background-image:url(_img/slides/roof-rack.jpg);
}
.slide-running-boards{
	background-image:url(_img/slides/running-boards.jpg);
}
.slide-spoiler{
	background-image:url(_img/slides/spoiler.jpg);
}
.slide-tonneau{
	background-image:url(_img/slides/tonneau.jpg);
}
.slide-tool-box{
	background-image:url(_img/slides/tool-box.jpg);
}
.slide-vehicle-graphic{
	background-image:url(_img/slides/vehicle-graphic.jpg);
}
.slide-visor{
	background-image:url(_img/slides/visor.jpg);
}
.slide-window-tint{
	background-image:url(_img/slides/window-tint.jpg);
}

#contact-info{
	color:rgb(255,255,255);
	background:rgb(0,0,255);
	clear:both;
	font-size:.875em;
}
#contact-info ul{
	padding:.25em 40px;
	box-sizing:border-box;
	-moz-box-sizing: border-box;
}
#contact-info li{
	margin-left:1em;
	padding-left:1em;
	border-left:1em solid rgb(255,255,255);
	border-left-color:rgba(255,255,255,.5);
	line-height:1em;
}
#contact-info li:first-child{
	margin-left:0;
	padding-left:0;
	border-left:none;
}
/* Over ride Google Voice and Skyp links styles for phone numbers */
#contact-info a, #contact-info .gc-cs-link{
	color:#fff;
	text-decoration:none;
}

#content > section{
	float:left;
	width:560px;
	padding:40px;
}
#content > section > h1{
	border-bottom:2px solid rgb(0,0,255);
	line-height:40px;
}
#content > aside{
	float:right;
	width:240px;
	padding:40px;
}

#content > aside > h1{
	font-size:1.5em;
	line-height:40px;
}

.photo-list{
	padding:0;
}

.photo-list li{
	background-size:240px 180px;
}

.photo-list li a {
	color:rgba(255,255,255,.5);
	display:block;
	width:240px;
	height:20px;
	padding-top:160px;
	overflow:hidden;
	font:700 1em/20px 'Monda', sans-serif;
}

footer{
	background:#d6d6d6;
	padding:2em 0 6em;
	text-align:center;
}

footer .inner-container{
	width:640px;
	padding-right:320px;
	text-align:center;
}

footer .footer-nav{
	margin-bottom:2em;
	padding-left:0;
}

footer .footer-nav li:before{
	content:' \007C ';
}

footer .footer-nav li:first-child{
	background:none;
}

footer .footer-nav li:first-child:before{
	content:'';
}

footer .footer-nav a{
	margin:0 .5em;
	font-size:.875em;
	text-transform:uppercase;
}

@media screen and (max-width:960px) {
	body{
		background:#fff;
	}

	.inner-container{
		width:100%;
	}

	#top-text{
		display:none;
	}
	
	#header{
		position:relative;
		height:auto;
		top:0;
	}

	.nav-height{
		background-position:-40px -10px;
		height:auto;
		padding-top:85px;
	}
	.nav-height > .table > .table-cell{
		display:none;
	}

	.nav-main{
		background:rgb(255,255,255);
		border-top:1px solid rgba(106,106,106,.5);
		padding:.25em 0 .5em;
		text-align:center;
	}

	.nav-main ul{
		float:none;
	}

	.nav-main li{
		height:auto;
		margin-right:.25em;
	}
	
	.nav-multi-column{
		padding:5px;
	}
	
	.nav-multi-column > li > a{
		height:2em;
		overflow:hidden;
	}
	
	.nav-multi-column > li li{
		margin-bottom:.5em;
	}
	
	.nav-multi-column > li li:before{
		content:'\25A0 ';
		padding-right:0;
	}

	.slider-container{
		min-width:320px;
	}
	
	#content section{
		width:auto;
		padding:.5em;
		float:none;
	}
	
	#content aside{
		background:#f1f1f1;
		border:1px solid rgba(106,106,106,.5);
	}

	#contact-info{
		min-height:.5em;
	}

	#contact-info ul{
		display:none;
	}
	
	footer .inner-container{
		width:auto;
		padding:1em .5em;
	}
	 
	footer .footer-nav li:before{
		content:'';
	}
}

@media screen and (max-width:600px) {	
	.nav-multi-column{
		display:block;
		padding:0;
	}
	.nav-multi-column > li{
		display:block;
		width:45%;
		padding:2%;
		float:left;
	}
	
	#content aside{
		display:none;
	}
}