@charset "utf-8";

/* FONTS */

@font-face {
    font-family: 'open_sanslight';
    src: url('fonts/OpenSans-Light-webfont.eot');
    src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Light-webfont.woff') format('woff'),
         url('fonts/OpenSans-Light-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'cruiser';
    src: url('fonts/cruiser.eot');
    src: url('fonts/cruiser.eot?#iefix') format('embedded-opentype'),
         url('fonts/cruiser.woff') format('woff'),
         url('fonts/cruiser.ttf') format('truetype'),
         url('fonts/cruiser.svg#cruiser') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* CSS Document */

body {
	width: 100%;
	margin: 0px;
	font-family: 'open_sanslight';
	background: #2e354a;
}

a {
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;	
}

a:link {color: #d92027; text-decoration: none;}
a:visited {color: #d92027; text-decoration: none;}
a:hover {color: #fff; text-decoration: none;}
a:active {color: #d92027; text-decoration: none;}

p {
	padding: 1%;
}

h1 {
	font-family: 'cruiser';
	color: #fff;
	font-size: 48px;
	font-weight: 400;
	line-height: 100%;
	padding: 0px;
	margin: 0px;
	padding-left: 1%;
}

h2 {
	font-family: 'cruiser';
	color: #fff;
	font-size: 32px;
	font-weight: 400;
	line-height: 100%;
	padding-left: 1%;
}

h3 {
	font-family: 'cruiser';
	color: #fff;
	font-size: 26px;
	font-weight: 400;
	line-height: 100%;
	padding: 0px;
	padding-left: 1%;
	margin: 0px;
}

hr {
	border: 0px;
	border-bottom: 1px solid;
	padding-left: 1%;
	padding-right: 1%;
}

.red {
	color: #d92027;
}

.gray {
	color: #fff;
}

.white {
	color: #fff;
}

img {
	margin-bottom: -5px;
}

.button {
	background: #d92027;
	border-radius: 20px;
	margin-left: 1%;
	font-family: 'cruiser';
	font-size: 12px;
	color: #fff !important;
	letter-spacing: 1px;
	padding: 10px 40px 10px 40px;
}

.button:hover {
	background: #fff;
	color: #d92027 !important;
}

header {
	width: 100%;
	padding: 20px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 10;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#logo {
	position: relative;
	float: left;
}

#navContainer {
	position: relative;
	float: right;
}

#nav {
	font-family: 'cruiser';
	font-size: 11px;
	letter-spacing: .5px;
}

#nav a:link {color: #fff; text-decoration: none;}
#nav a:visited {color: #fff; text-decoration: none;}
#nav a:hover {color: #d92027; text-decoration: none;}
#nav a:active {color: #fff; text-decoration: none;}

#nav ul {
	list-style: none;
}

#nav ul li {
	display: inline-block;
	padding-right: 20px;
}

#nav ul li:last-child {
	padding-right: 0px;
}

#mobileButton {
	display: none;
}

.hidden2 {
	display: none;
}

#slideshow {
	width: 100%;
	z-index: 1;
}

#slideshow img {
	width: 100%;
}

#carpartsContainer {
	width: 100%;
	padding-top: 100px;
	padding-bottom: 100px;
	padding-left: 1%;
	padding-right: 1%;
	text-align: center;
	margin: auto;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #2e354a; /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(left top, #4b5263 , #2e354a); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(bottom right, #4b5263, #2e354a); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(bottom right, #4b5263, #2e354a); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to bottom right, #4b5263 , #2e354a); /* Standard syntax */
}

.fluid {
	max-width: 1280px;
	text-align: left;
	margin: auto;
}

.half {
	width: 50%;
	padding: 1%;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.cols5 {
	width: 41.66%;
	padding: 1%;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.forty {
	width: 40%;
	padding: 1%;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.twenty {
	width: 20%;
	padding: 1%;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.seventyfive {
	width: 75%;
	padding: 1%;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.left {
	float: left;
}

.right {
	float: right;
}

#carparts a:link {color: #fff; text-decoration: none;}
#carparts a:visited {color: #fff; text-decoration: none;}
#carparts a:hover {color: #d92027; text-decoration: none;}
#carparts a:active {color: #fff; text-decoration: none;}

.carpartsBox {
	width: 33.3%;
	padding: 1%;
	margin-bottom: 30px;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.carpartsBox img {
	width: 100%;
}

#partsContainer {
	width: 100%;
	padding-top: 100px;
	padding-bottom: 100px;
	padding-left: 1%;
	padding-right: 1%;
	text-align: center;
	margin: auto;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #ededef;
}

#parts h2, h1, h3 {
	color: #23386f;
}

#parts a:link {color: #23386f; text-decoration: none;}
#parts a:visited {color: #23386f; text-decoration: none;}
#parts a:hover {color: #d92027; text-decoration: none;}
#parts a:active {color: #23386f; text-decoration: none;}

.partsBox {
	width: 25%;
	padding: 1%;
	margin-bottom: 30px;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.partsBox img {
	width: 100%;
}

#partsContainer2 {
	width: 100%;
	padding-top: 100px;
	padding-bottom: 100px;
	padding-left: 1%;
	padding-right: 1%;
	text-align: center;
	margin: auto;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #f9f9f9;
}

#parts2 h2, h1, h3 {
	color: #23386f;
}

#parts2 a:link {color: #23386f; text-decoration: none;}
#parts2 a:visited {color: #23386f; text-decoration: none;}
#parts2 a:hover {color: #d92027; text-decoration: none;}
#parts2 a:active {color: #23386f; text-decoration: none;}

.partsBox2 {
	width: 20%;
	padding: 1%;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.partsBox2 img {
	width: 100%;
}

#replacementContainer {
	width: 100%;
	padding-top: 100px;
	padding-bottom: 100px;
	padding-left: 1%;
	padding-right: 1%;
	text-align: center;
	margin: auto;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #495062;
}

#replacement h2, h1, h3 {
	color: #ffffff;
}

#replacement a:link {color: #b2b2b2; text-decoration: none;}
#replacement a:visited {color: #b2b2b2; text-decoration: none;}
#replacement a:hover {color: #ffffff; text-decoration: none;}
#replacement a:active {color: #b2b2b2; text-decoration: none;}

.acc {
	display: none;
	padding: 1%;
}

#inquiryContainer {
	width: 100%;
	padding-top: 100px;
	padding-bottom: 100px;
	padding-left: 1%;
	padding-right: 1%;
	text-align: center;
	margin: auto;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #fff;
}

#inquiry {
	font-size: 12px;
}

#inquiry h1, h2, h3 {
	color: #23386f;
}

#inquiry input, textarea {
	width: 100%;
	border: 1px solid #b7b7b7;
	padding: 1%;
	margin-bottom: 1%;
	font-family: 'open_sanslight';
	font-size: 12px;
	color: #000;
}

#inquiry .button {
	width: auto;
	font-family: 'cruiser';
	border: 0;
	padding: 10px 40px 10px 40px;
	
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;	
}

#inquiry .button:hover {
	background: #1d2232;
	color: #fff !important;
}

.contactInfo {
	font-family: 'cruiser';
	font-size: 22px;
	color: #d92027;
	line-height: 50%;
}

#footerContainer {
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-left: 1%;
	padding-right: 1%;
	text-align: center;
	margin: auto;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #1d2232;
}

#footer {
	color:#fff;
	font-size: 12px;
}

#footerContainer2 {
	width: 100%;
	text-align: center;
	margin: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #292f3d;
}

#footer2 {
	color:#fff;
	font-size: 10px;
}

#footer2 a:link {color: #7c8291; text-decoration: none;}
#footer2 a:visited {color: #7c8291; text-decoration: none;}
#footer2 a:hover {color: #fff; text-decoration: none;}
#footer2 a:active {color: #7c8291; text-decoration: none;}

#contentContainer {
	width: 100%;
	padding-top: 100px;
	padding-bottom: 100px;
	padding-left: 1%;
	padding-right: 1%;
	text-align: center;
	margin: auto;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	background: #2e354a; /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(left top, #4b5263 , #2e354a); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(bottom right, #4b5263, #2e354a); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(bottom right, #4b5263, #2e354a); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to bottom right, #4b5263 , #2e354a); /* Standard syntax */
}

#content {
	color: #ccc;
}

.faq {
	font-family: 'cruiser';
	color: #fff;
	text-transform: uppercase;
	font-size: 18px;
}

.map {
	width: 100%;
	height: 500px;
	padding: 1%;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


/* Mobile */
@media (max-width: 320px) {
	
	#logo {
		max-width: 100px;
	}
	
	#logo img {
		width: 100%;
	}
	
	#nav {
		display: none;
	}
	
	.carpartsBox {
		width: 100%;
	}
	
	.partsBox {
		width: 100%;
	}
	
	.half {
		width: 100%;
	}
	
	.cols5 {
	width: 100%;
	}
	
	.forty {
		width:100%;
	}
	
	.twenty {
		width:100%;
	}
	
	.seventyfive {
		width: 100%;
	}
	
	#slideshow {
		position: relative;
		top: 80px;
	}
	
	#mobileButton {
		display: inline-block;
		position: absolute;
		top: 20px;
		right: 20px;
	}
	
	#mobileButton {
		display: inline-block;
		position: absolute;
		top: 20px;
		right: 20px;
		z-index: 100;
	}
	
	#navContainer {
		position: absolute;
		float: left;
		top: -20px;
		left: 0px;
		width: 100%;
		height: 100%;
		z-index: 99;
	}
	
	#nav {
		display: none;
		
		text-align: center;
		font-size: 18px;
		
		background: rgba(0,0,0,0.85)
	}
	
	#nav ul {
		list-style: none;
		padding: 0px;
		padding-top: 50px;
	}

	#nav ul li {
		display: block;
		padding: 0px;
		padding-bottom: 30px;
	}

	#nav ul li:last-child {
		padding-right: 0px;
		padding-bottom: 150px;
	}
	
	.hidden2 {
		display: inline-block;
	}
}

/* Tablets */
@media (min-width: 321px)and (max-width: 767px) {
	
	#logo {
		max-width: 100px;
	}
	
	#logo img {
		width: 100%;
	}
	
	.carpartsBox {
		width: 50%;
	}
	
	.partsBox {
		width: 50%;
	}
	
	.half {
		width: 100%;
	}
	
	.cols5 {
	width: 100%;
	}
	
	.seventyfive {
		width: 100%;
	}
	
	#mobileButton {
		display: inline-block;
		position: absolute;
		top: 20px;
		right: 20px;
		z-index: 100;
	}
	
	#navContainer {
		position: absolute;
		float: left;
		top: -20px;
		left: 0px;
		width: 100%;
		height: 100%;
		z-index: 99;
	}
	
	#nav {
		display: none;
		
		text-align: center;
		font-size: 18px;
		
		background: rgba(0,0,0,0.85)
	}
	
	#nav ul {
		list-style: none;		
		padding: 0px;
		padding-top: 50px;
	}

	#nav ul li {
		display: block;
		padding: 0px;
		padding-bottom: 30px;
	}

	#nav ul li:last-child {
		padding-right: 0px;
		padding-bottom: 150px;
	}
	
	.hidden2 {
		display: inline-block;
	}
}

/* Small Desktops */
@media (min-width: 768px) and (max-width: 1096px) {
	
	.cols5 {
	width: 50%;
	}
	
	.partsBox {
		width: 33%;
	}
	
}

.nivo-controlNav {
	display: none !important;
}

