﻿/***** BEGIN RESET *****/
@import url("https://use.typekit.net/lzj5ypl.css");
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 {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}

/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

/*-------- BODY STYLES --------*/

body {}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


h1, h2, h3 {
	font-family: 'neutronic', sans-serif;
}

#home p, #financing p, #trade-in p, #about p, #contact p, #thankyou p, footer a, header p, #privacy-policy p {
	font-size: 20px;
	font-weight: 400;
	line-height: 30px;
	font-family: 'neulis-sans', sans-serif;
	color: #2C2C2C;
}

/*--- HERO STYLES ---------------------*/
.home-hero {
	background: url("/siteart/home-hero.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	height: auto;
	background-color: #2C2C2C;
}

.home-hero .heading-lg {max-width: 815px; width: 100%; color: #fff;}

.home-hero .wrapper {padding-top:150px !important;padding-bottom: 180px !important;}
.home-hero .wrapper > div {margin-top: 60px;}

#about .innner-hero {
	background: url("/siteart/innerhero-about.jpg") no-repeat;
	background-position: center;
	background-size: cover;
	padding-top: 80px; 
	padding-bottom: 60px;
	background-color: #2C2C2C;
}

.innner-hero {
	background: url("/siteart/innerhero.jpg") no-repeat;
	background-position: center;
	background-size: cover;
	padding-top: 80px; 
	padding-bottom: 60px;
	background-color: #2C2C2C;
}
.innner-hero .heading-lg {color: #fff!important;margin-bottom: 15px;}

.innner-hero a {color: #fff; font-family: 'neulis-sans', sans-serif; font-size: 18px;}
.innner-hero i {margin-right: 10px;}
.innner-hero a:hover {text-decoration: underline;}

/*---BODY--------------------------------*/
/*col-2*/
.col-2 {background: #EEEEEE; padding-top: 100px; padding-bottom: 100px;}
.col-2 .wrapper {justify-content: space-between;}
.col-2 .wrapper > div:first-child {max-width: 500px; width: 100%; margin-right: 20px;}
.col-2 .wrapper > div:last-child {max-width: 1060px; width: 100%;}
.col-2 .wrapper > div:last-child > div {margin-top: 60px;}

/*col-4*/
.col-4 {background: linear-gradient(to bottom, #EEEEEE 65%, #2C2C2C 45%);}
.col-4 .flex {gap: 20px; justify-content: center;}

.col-4 a {
	display: inline-block;
	max-width: 440px;
	height: 350px;
	overflow: hidden;
    box-sizing: border-box;
    position: relative;
	clip-path: polygon(0% 0%, 100% 0%, 100% 85.71%, 88.64% 100%, 0% 100%);
	background-color: #C32222;
}
.col-4 a:hover img {opacity: .2;}

.col-4 a img {
	width: 100%;
    object-fit: cover;
    object-position: center;
    height: 100%;
	transition: all .4s ease-out;
}

.col-4 a .heading-mdsm {
	position: absolute;
    top: 0;
    left: 0;
    margin: 30px;
    color: #fff;
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.50);
}

/*img-left*/
.img-left {background: #2C2C2C; padding-top: 130px; padding-bottom: 130px;}
.img-left .flex {justify-content: flex-start;align-items: center;}

.img-left .img-left-content {max-width: 700px; width: 100%; margin-left: 120px; padding-right: 15px;}
.img-left .heading-md {color: #fff; margin-bottom: 40px;}
.img-left .heading-md span {color: #fff;}
.img-left p {color: #fff!important; margin-bottom: 70px;}

.img-left .img-height {
	width: 100%;
    max-width: 962px;
    height: 715px;
}

.img-left .img-height img {width: 100%;height: 100%;object-fit: cover;}
#home .img-left .btn-red:hover {background: #fff!important; color: #2C2C2C!important;}

/*contact-card*/
.contact-card {background: linear-gradient(to top, transparent 10%, #2C2C2C 10%);}
.contact-card .card-content {
	clip-path: polygon(2.99% 0%, 100% 0%, 100% 88.04%, 97.01% 100%, 0% 100%, 0% 11.96%);
	background-color: #EEEEEE;
	max-width: 1670px;
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.contact-card .card-content > .flex:first-child {
	padding: 65px 65px 130px;
	justify-content: space-between; align-items: flex-end;
}

.contact-card .contact-card-links {justify-content: space-between; align-items: center; padding: 0 65px 65px;}

.contact-card .contact-card-links .flex {align-items: center;}
.contact-card .contact-card-links a {color: #2C2C2C; font-family: 'neulis-sans', sans-serif; font-size: 25px; margin-left: 30px; margin-top: 3px;}
.contact-card .contact-card-links a:hover {text-decoration: underline;}

/*center-section*/
#home .center-section {
	background: url("/siteart/financing-backgound.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	height: auto;
	background-color: #2C2C2C;
	padding-top: 200px; 
	padding-bottom: 130px;
	margin-top: -130px;
}

#home .center-section .heading-md {color: #fff!important; text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.50); margin-bottom: 40px;}
#home .center-section .h2-span {color: #fff; text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.50);}
#home .center-section p {color: #fff!important; text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.50); margin-bottom: 70px;}

.center-section .wrapper > div, .center-section-inner .wrapper > div {max-width: 825px; width: 100%; margin: 0 auto; text-align: center;}


/*--------PAGES--------------------*/
/*financing*//*thankyou*/
.center-section-inner .wrapper {max-width: 825px; margin: 0 auto; text-align: center;}

.center-section-inner {background: #EEEEEE;padding-top: 100px; padding-bottom: 100px;}
.center-section-inner p {margin-bottom: 70px;}
.center-section-inner .heading-md {margin-bottom: 40px;}

.finance-links {background: #EEEEEE;padding-bottom: 100px;}
.finance-links .flex {justify-content: space-around; max-width : 1300px; flex-wrap: wrap; gap: 40px;}
.finance-links .img-height {max-width: 520px; }
.finance-links .img-height img {width: 100%; height: 100%;transition: transform .2s;}
.finance-links .img-height img:hover {transform: scale(0.90);}

.inventory-button {
	background: url("/siteart/inventory-button.jpg") no-repeat;
	background-color: #2C2C2C;
	background-position: center;
	background-size: cover;
	padding-top: 100px;
	padding-bottom: 100px;
}
.inventory-button .wrapper {max-width: 800px;}
.inventory-button i {margin-left: 40px;}
.inventory-button a {text-align: center;max-width: 800px;margin: 0 auto; width: 100%;}
.inventory-button a .heading-md {color: #fff!important;transition: transform .2s;}
.inventory-button a:hover .heading-md {transform: scale(0.90);}

/*about*/
#about .img-left, #contact .img-left {background: #EEEEEE;padding-top: 100px; padding-bottom: 100px;}
#about .img-left .heading-md, #about .img-left p, #about .img-left .heading-md span, #contact .img-left .heading-md, #contact .img-left p, #contact .img-left .heading-md span {color: #2C2C2C!important;}
#about .img-left p {margin-bottom: 0;}
#about .img-left .p-margin-top {margin-bottom: 70px;}
#about .img-left .img-height {height: 830px;}

#about .center-section-inner p {margin-bottom: 10px;}
#about .center-section-inner {background: #2C2C2C;}
#about .center-section-inner .heading-md, #about .center-section-inner p, #about .center-section-inner .h2-span {color: #fff!important;}
#about .contact-card .contact-card-links a {margin-left: 0; margin-right: 0; font-size: 20px; color: #C32222!important;}
#about .contact-card .card-content > .flex:first-child {padding: 65px 65px 100px;}


.img-gallery {align-items: center;justify-content: center;gap: 20px;margin-top: 50px;padding: 0 15px;}
.img-gallery .img-height {width: 100%;max-width: 440px;height: 350px;}
.img-gallery .img-height img {width: 100%;height: 100%; object-fit: cover;}

/*privacy-policy*/
.our-policy {background: #EEEEEE;padding-top: 100px; padding-bottom: 100px;}
.our-policy .wrapper > div {max-width: 1400px;}
.our-policy .heading-md {margin-bottom: 40px!important;}
.our-policy .heading-sm {margin-top: 50px; margin-bottom: 20px;}
.our-policy p a {color: #C32222;}
.our-policy p a:hover {text-decoration: underline;}

/*trade-in*/
/*contact*/
#contact .img-left a {
	font-size: 20px;
	font-weight: 400;
	line-height: 30px;
	font-family: 'neulis-sans', sans-serif;
	color: #2C2C2C;}
#contact .img-left a:hover {text-decoration: underline;}
#contact .heading-sm {margin-bottom: 20px;}
#contact .img-left p, #contact .img-left .flex > div > div {margin-bottom: 10px!important;}
#contact .img-left p span, #contact .img-left a span {font-weight: 600!important;}
#contact .img-left .contact-info {margin-top: 40px;}
#contact .contact-info .flex {gap: 50px;}
#contact .img-left .contact-info > div:first-child {margin-bottom: 40px;}

#contact .img-left .img-height {height: 850px;}

#contact .inventory-button, #trade-in .inventory-button, #about .inventory-button {padding-top: 160px; margin-top: -100px;}

/*--------FORM STYLES--------------------*/
.form-bg {background: #2C2C2C; padding-top:100px;}

.form-all .heading-md {margin-bottom: 10px; color: #2C2C2C;}
.form-all .heading-sm {text-align: left; margin-top: 20px; margin-bottom: 20px;}
.form-all p {margin-bottom: 40px; margin-top: 15px;}

.form-all {
	position: relative;
	box-sizing: border-box;
	max-width: 1100px!important; 
	width: 100%;
	margin: 0 auto!important;
	text-align: center;
	padding: 80px 100px 160px;
	background: #EEEEEE;
}

 .label {
	font-family: 'neulis-sans', sans-serif;
	text-align: left!important;
	font-weight: 500;
}

.label-row {margin-bottom: 15px;}

.flex-form {
	width: 100%;
	max-width: 1205px;
	padding: 15px;
	margin: 52px auto;
}

.flex-row {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	width: 100%;
}

.form-half {
	display: inline-block;
	width: calc(50% - 8px);
	margin: 15px 15px 15px 0;
}

.form-half input {
	padding: 15px;
	width: 100%;
	border: 1px solid #2C2C2C;
	font-family: 'neulis-sans', sans-serif;
	box-sizing: border-box;
	background: #EEEEEE;
}

.form-2nd-row {margin-right: 0;}

.form-full textarea {
	width: 100%;
	padding: 15px;
	border: 1px solid #2C2C2C;
	box-sizing: border-box;
	margin-bottom: -8px;
	font-family: 'neulis-sans', sans-serif;
	background: #EEEEEE;
}

.form-full {margin: 15px 0 30px 0;}

input::placeholder, textarea::placeholder {
	color: #2C2C2C;
}

/*--------Captcha--------------------*/

.include-captcha{display:none;}

#submit-btn {float: right;}

.CaptchaWhatsThisPanel > a:hover {text-decoration: underline;}

.CaptchaWhatsThisPanel > a, .CaptchaMessagePanel {
	color: #2C2C2C;
	font-family: 'neulis-sans', sans-serif;
}

.CaptchaPanel {text-align: right!important;}

.captcha-button {float: right;}


/*-------- FOOTER STYLES ----------------*/
footer.my-site-footer{background: #2C2C2C; padding-top: 80px; padding-bottom: 80px;}
.my-site-footer .wrapper > div {margin: 0 auto; text-align: center;}
.footer-logo img {max-width: 200px;}

.my-site-footer .footer-links {justify-content: center; gap: 40px; margin-top: 50px; margin-bottom: 30px;flex-wrap: wrap;}
.my-site-footer a {color: #fff!important;}
.my-site-footer a:hover {text-decoration: underline;}
.my-site-footer a:hover i {color: #C32222;}
.my-site-footer .footer-contact {justify-content: center;}

.my-site-footer hr {
	margin-left: 30px;
    margin-right: 30px;
    margin-top: 0;
    margin-bottom: 0;
    border: 1px #fff solid;
}

/*-------- COMMON STYLES ----------------*/
.wrapper {
    margin: 0 auto;
    max-width: 1830px;
    padding: 0 15px;
}

.flex {display: flex}

/*headings*/

.heading-lg {font-size: 90px; font-weight: 700; text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.50);}
.h1-span {font-size: 50px; font-weight: 400;}

.heading-md {font-size: 60px; font-weight: 600; color: #2C2C2C;}
.h2-span {font-size: 30px; font-weight: 400;color: #2C2C2C;}

.heading-mdsm {font-size: 45px; font-weight: 600;color: #2C2C2C;}

.heading-sm {font-size: 30px; font-weight: 700;}

.p-margin-top {margin-top: 30px;}

/*buttons*/
.btn-red {
	display: inline-block;
    color: #fff;
    background: #C32222;
    width: 225px;
    padding: 17px;
    font-family: 'neulis-sans', sans-serif;
    font-size: 25px;
    font-weight: 700;
    text-align: center;
    transition: all .4s ease-out;
	border: none;
}
.btn-red:hover {background: #2C2C2C;}

#home .home-hero .btn-red {box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.50);}
#home .home-hero .btn-red:hover {color: #2C2C2C;background: #fff;}

.btn-white {
	display: inline-block;
    color: #2C2C2C;
    background: #fff;
    width: 225px;
    padding: 17px;
    font-family: 'neulis-sans', sans-serif;
    font-size: 25px;
    font-weight: 700;
    text-align: center;
    transition: all .4s ease-out;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.50);
}
.btn-white:hover {background: #2C2C2C; color: #fff!important;}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.list-container-flexrow .view-listing-details-link, .view-listing-details-link, .faceted-search-content .selected-facets-container .selected-facet, .list-content .list-error-container .info button:not(.login-button) {background: #C32222!important; transition: all .4s ease-out;}
.list-container-flexrow .view-listing-details-link:hover, .view-listing-details-link:hover, .list-content .list-error-container .info button:not(.login-button):hover {background: #2C2C2C!important;}
.list-top-section .list-listings-count, .list-content .price-container .price, .listing-prices__retail-price {color: #C32222!important;}

/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1540px) {
	.col-4 .flex {flex-wrap: wrap;}
}

@media only screen and (max-width: 1430px) {
	.contact-card .contact-card-links {flex-wrap: wrap;gap: 30px;}
}

@media only screen and (max-width: 1230px) {
	.img-left .img-left-content {margin-left: 30px;}
}

@media only screen and (max-width: 1130px) {
	.img-left .flex {flex-wrap: wrap;}
	.img-left .img-height, #about .img-left .img-height,#contact .img-left .img-height {height: 300px; max-width: 1200px;}
	.img-left .img-left-content {padding-left: 15px; margin-left: 0; max-width: 100%;}
}

@media only screen and (max-width: 1100px) {
	.home-hero .wrapper {padding-top: 80px !important;padding-bottom: 130px !important;}
}

@media only screen and (max-width: 830px) {
	.contact-card .card-content > .flex:first-child {flex-wrap: wrap;gap: 60px;}
}

@media only screen and (max-width: 800px) {
	.col-2 .wrapper {flex-wrap: wrap;}	
	.col-2 .wrapper > div:first-child {margin-right: none; margin-bottom: 40px;}
	.my-site-footer .footer-contact  {flex-direction: column; gap: 25px; margin-top: 80px;}
	.my-site-footer hr {display: none;}
	.img-gallery {flex-wrap: wrap;}
	.img-gallery .img-height {max-width: 800px;height: 150px;}
}

@media only screen and (max-width: 740px) {
	#contact .contact-info .flex {gap: 30px;}
	#contact .img-left .contact-info > div:first-child {margin-bottom: 30px}
}

@media only screen and (max-width: 730px) {
	.heading-lg {font-size: 50px;}
	.h1-span {font-size: 25px;}
	.heading-md {font-size: 35px;}
	.h2-span {font-size: 20px;}
	.heading-mdsm {font-size: 30px;}
	.heading-sm {font-size: 25px;}	
	.contact-card .card-content > .flex:first-child, #about .contact-card .card-content > .flex:first-child {padding: 65px 20px 80px;}
	.contact-card .contact-card-links {padding: 0 20px 65px;}
	.form-all {padding: 50px 20px 130px;}
}

@media only screen and (max-width: 530px) {
	.contact-card .contact-card-links .flex {flex-direction: column; gap: 20px; align-items: flex-start;}
	.contact-card .contact-card-links a {margin-left: 0;}
}

@media only screen and (max-width: 500px) {
	.home-hero .wrapper {padding-top: 28px !important;padding-bottom: 80px !important;}
	.col-4 a {height: 190px; width: 100%;}
	.img-left .img-height {height: 200px;}
	.flex-row {flex-direction: column;}
	.form-half {width: 100%; margin: 15px 0;}
	.inventory-button i {margin-left: 20px;}
}

@media only screen and (max-width: 430px) {
	.contact-card .contact-card-links a {font-size: 20px;}
	.inventory-button a .heading-md {font-size: 30px;}
}
@media only screen and (max-width: 380px) {
	.my-site-footer .footer-links {flex-direction: column; gap: 25px;}
	.inventory-button a .heading-md {font-size: 40px;}
	.heading-lg {font-size: 45px;}
}

@media only screen and (max-width: 370px) {
	.our-policy p {font-size: 18px!important;}
}

@media only screen and (max-width: 350px) {
	#contact .img-left a, #contact .img-left p {font-size: 18px!important;}
	.btn-red {width: 200px;}
}

@media only screen and (max-width: 340px) {
	.heading-lg {font-size: 45px;}
	.contact-card .contact-card-links a {font-size:18px;}
	.our-policy p a {font-size: 16px!important;}
	#about .inventory-button {margin-top: -110px!important;}
	.heading-lg {font-size: 42px;}
}






