/***** BEGIN RESET *****/
@import url('https://fonts.googleapis.com/css2?family=Ruda:wght@400..900&display=swap');
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;  
} 

/*-------- COLORS --------*/
:root {
  --red: #ec0909;
  --grey: #F3F3F3;
  --dark-grey: #040404;
}

/***** 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;
}

h1, h2, h3 {
	font-family: 'Ruda', sans-serif;
}

#home p, #thankyou p, #service p, #contact p, .my-site-footer p, .my-site-footer li,.my-site-footer a, .inner-hero p  {
	font-family: 'Ruda', sans-serif;
	font-size: 24px;
	color: var(--dark-grey);
	line-height: 36px;
}

/*-------- BODY STYLES --------*/

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*--- HERO STYLES ---------------------*/
.home-hero {background-color: var(--dark-grey); position: relative;}
.home-hero .video-height {height: 900px; width: 100%;}
.home-hero video {opacity: .5; width: 100%; height: 100%; object-fit: cover;}

.home-hero .wrapper {position: absolute; top: 230px; left: 0; right: 0;}
.home-hero .heading-lg {color: #fff; text-align: center;}
.home-hero p {color: #fff!important; font-weight: 800; text-align: center; margin-bottom: 60px; margin-top: 40px;}
.home-hero a {color: #fff; font-weight: 800; text-decoration: underline; transition: all .4s ease-out;}
.home-hero a:hover {color: var(--red)!important;}
.home-hero .flex {justify-content: center;}
.home-hero .flex > div {display: flex; gap: 30px; background: #fff; border-radius: 15px; padding: 20px;}
.home-hero .flex i {color: var(--dark-grey); font-size: 24px; transition: all .4s ease-out;}
.home-hero .flex i:hover {color: var(--red)!important;}

.inner-hero {padding-top: 50px!important; padding-bottom: 50px!important; gap: 30px; flex-wrap: wrap; align-items: center;}
.inner-hero a {color: var(--dark-grey); font-size: 24px; font-family: 'Ruda', sans-serif; line-height: 35px; font-weight: 800; transition: all .4s 
ease-out;}
.inner-hero a:hover {color: var(--red);}
.inner-hero hr {margin: 0; border: #040404 solid 1px; height: 30px;}

/*---BODY--------------------------------*/
/*---links---*/
.links {background: var(--red);}
.links .flex {justify-content: center; gap: 80px; padding-top: 80px!important; padding-bottom: 80px!important; flex-wrap: wrap;}
/*---col-2---*/
.col-2 {padding-top: 100px!important; padding-bottom: 100px!important; gap: 50px; justify-content: center;}
.col-2 .grey-box {background: var(--grey); padding: 25px; border-radius: 15px; gap: 20px; max-width: 765px; width: 100%; flex-direction: column; align-items: center;}
.col-2 .grey-box .img-height img {width: 136px; border-radius: 15px; justify-content: center;}
.col-2 .grey-box p {margin-top: 20px;}
.col-2 .grey-box ul {margin-left: 15px;}
.col-2 .grey-box li {font-size: 24px; line-height: 35px;  font-family: 'Ruda', sans-serif;}
.col-2 .grey-box .btn-top {margin-top: 30px; width: 80%; margin: 0 auto; padding-top: 20px; margin: 0 auto;}
/*---center---*/
.center-section {padding-bottom: 100px!important;}
.center-section .flex {justify-content: center; align-items: center;}
.center-section .heading-mdlg {width: 250px; text-align: center;}
.center-section hr {
	border-bottom: #040404 solid 2px;
	width: 100%; 
	max-width: 650px;
	border-top: 0; 
	border-left: 0;
	border-right: 0;
}
.center-section p {text-align: center; margin-top: 20px!important; max-width: 1628px; margin: 0 auto;}
.center-section p span {font-weight: 800;}

/*--------PAGE STYLES--------------------*/
/*---thankyou---*/
#thankyou .center {padding-top: 20px!important; padding-bottom: 100px!important;}
#thankyou .center .heading-mdlg, #thankyou .center p {text-align: center; max-width: 700px; margin: 0 auto;}
#thankyou .center .heading-mdlg {margin-bottom: 20px;}
#thankyou .center > div {margin: 40px auto 0; text-align: center;}

/*---contact---*/
.col-2-map {justify-content: center; gap: 50px; padding-bottom: 100px!important;}
.col-2-map .img-height {width: 100%; height: auto; max-width: 800px;}
.col-2-map .img-height iframe {border-radius: 15px;}

.col-2-map .grey-box {background: var(--grey); border-radius: 15px; padding: 50px; max-width: 800px; width: 100%;}
.col-2-map .grey-box .heading-md {margin-bottom: 20px;}
.col-2-map .grey-box a {color: var(--dark-grey); font-size: 24px; font-family: 'Ruda', sans-serif; transition: all .4s ease-out;}
.col-2-map .grey-box a:hover {color: var(--red);}
.col-2-map .grey-box div:nth-child(2) {margin-top: 40px; margin-bottom: 40px;}

/*---service---*/
#service .btn-black:hover, #contact .btn-black:hover, #thankyou .btn-black:hover {background: var(--red)!important; border: #ec0909 solid 4px;}
.img-right {padding-bottom: 100px!important; padding-top: 20px!important; justify-content: space-between; align-items: center; gap: 50px;}
.img-right .content-left {max-width: 800px;}
.img-right .content-left > div {margin-top: 30px;}
.img-right .content-left .heading-mdlg {margin-bottom: 20px;}
.img-right .img-height {max-width: 900px; width: 100%; height: 550px;}
.img-right .img-height img {width: 100%; height: 100%; object-fit: cover; border-radius: 15px;}

.col-3 {justify-content: center; gap: 20px; padding-bottom: 100px!important;}
.col-3 .grey-box {background: var(--grey); padding: 40px 30px; border-radius: 15px; max-width: 550px; width: 100%;}
.col-3 .heading-md {text-align: center; margin-bottom: 20px;}
.col-3 p {text-align: center;}

.img-left {padding-bottom: 100px!important; gap: 50px; justify-content: space-between; align-items: center;}
.img-left .img-height {height: 900px; width: 100%; max-width: 900px;}
.img-left .img-height iframe {border-radius: 15px;}

.contact-box {justify-content: center; padding-bottom: 100px!important;}
.contact-box .box-red {
	display: inline-block;
    color: #fff;
    background: var(--red);
    max-width: 700px;
	width: 100%;
    padding: 80px;
    font-family: 'Ruda', sans-serif;
    text-align: center;
    transition: all .4s ease-out;
    border-radius: 15px 0 0 15px;
}
.contact-box .box-black {
	display: inline-block;
    color: #fff;
    background: var(--dark-grey);
    max-width: 700px;
	width: 100%;
    padding: 80px;
    font-family: 'Ruda', sans-serif;
    text-align: center;
    transition: all .4s ease-out;
    border-radius: 0 15px 15px 0;}

.contact-box .heading-md a {color: #fff!important;}

.contact-box .box-red:hover {background: var(--dark-grey);}
.contact-box .box-black:hover {background: var(--red);}

/*--------FORM STYLES--------------------*/
.form-all .heading-mdlg {margin-bottom: 10px; color: var(--dark-grey);}
.form-all-center .heading-mdlg {margin-bottom: 10px; color: var(--dark-grey)!important;}
.form-all-center p {max-width: 600px; margin: 0 auto 40px;}
.form-all p {max-width: 820px; margin-bottom: 40px;}

.form-all {
	box-sizing: border-box;
	max-width: 850px!important;
	min-width: 500px;
	width: 100%;
}

.form-all-center {
	max-width: 1200px!important; 
	text-align: center;
	margin: 0 auto 100px!important;
	padding-top: 20px !important;
	padding-bottom: 100px!important;
	box-sizing: border-box;
}

.label {
	font-family: 'Ruda', sans-serif;
	text-align: left!important;
	font-weight: 500;
	font-size: 20px;
}

.label-row {margin-bottom: 15px;color: var(--dark-grey);}
.flex-row {display: flex;width: 100%;}
.form-half {display: inline-block;width: calc(50% - 8px);margin: 15px 15px 15px 0;}

.form-half input {
	padding: 15px;
	width: 100%;
	border: none;
	font-family: 'Ruda', sans-serif;
	box-sizing: border-box;
	background: var(--grey);
	font-size: 20px;
	color: var(--dark-grey);
}

.form-2nd-row {margin-right: 0;}

.form-full textarea {
	width: 100%;
	padding: 15px;
	border: none;
	box-sizing: border-box;
	margin-bottom: -8px;
	font-family: 'Ruda', sans-serif;
	background: var(--grey);
	font-size: 20px;
	color: var(--dark-grey);
}

.form-full {margin: 15px 0 30px 0;}

select {
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}

/*--------Captcha--------------------*/

.include-captcha{display:none;}
#submit-btn {float: right;}
.CaptchaWhatsThisPanel > a:hover {text-decoration: underline;}
.CaptchaWhatsThisPanel > a, .CaptchaMessagePanel {color: var(--dark-grey);font-family: 'Ruda', sans-serif;}
.CaptchaPanel {text-align: right!important;}
.captcha-button {float: right;}


/*-------- FOOTER STYLES ----------------*/
.my-site-footer .logo-footer {display: flex;justify-content: center;}
.my-site-footer .logo-footer .img-height {max-width: 200px;}
.my-site-footer .logo-footer .img-height img {width: 100%; margin: 0 auto -105px; box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.50);
	border-radius: 100px;}

.my-site-footer .bg-black {padding-top: 170px; padding-bottom: 140px;}

.my-site-footer p, .my-site-footer li, .my-site-footer a {color: #fff; font-weight: 800; transition: all .4s ease-out;}
.my-site-footer a:hover {color: var(--red)!important;}
.my-site-footer li, .my-site-footer .bg-black .wrapper > div:first-child > div > p {margin-bottom: 10px;}
.my-site-footer li, .my-site-footer .bg-black .wrapper > div:first-child > div .flex {gap: 400px;}
.my-site-footer .times li {font-weight: 400!important; text-align: right;}

.my-site-footer .bg-black .wrapper > div:last-child {justify-content: space-between; gap: 20px; margin-top: 120px;}
.my-site-footer .bg-black .wrapper > div:first-child {justify-content: space-between;}

.my-site-footer .bg-red {padding-top: 30px; padding-bottom: 30px;}
.my-site-footer .bg-red p {text-align: center;}

.logo-footer-2 {display: flex;justify-content: center; gap:15px;}
.logo-footer-2 .img-height-2 {max-width: 200px;display: flex;justify-content: center; gap:15px;}
.logo-footer-2 .img-height-2 img {width: 100%; margin: 0 auto -105px;}

.logo-footer-3 {display: flex;justify-content: center;}
.logo-footer-3 .img-height-3 {max-width: 200px;}
.logo-footer-3 .img-height-3 img {width: 100%; margin: 0 auto -105px;}

/*-------- UNIVERSAL STYLES ----------------*/
.wrapper {
	padding: 0 15px; 
	margin: 0 auto;
	max-width: 1830px;
}

.flex {display: flex;}
.bg-black {background: var(--dark-grey);}
.bg-red {background: var(--red);}

/*---Headings---*/
.heading-lg {font-size: 96px; font-weight: 900; color: var(--dark-grey); text-transform: uppercase;}
.heading-mdlg {font-size: 48px; font-weight: 900; color: var(--dark-grey); text-transform: uppercase;}
.heading-md {font-size: 32px; font-weight: 900; color: var(--dark-grey); text-transform: uppercase;}

/*---Buttons---*/

.btn-black {
    display: inline-block;
    color: #fff;
    background: var(--dark-grey);
    width: 300px;
    padding: 24px;
    font-family: 'Ruda', sans-serif;
    font-size: 25px;
    font-weight: 600;
    text-align: center;
    transition: all .4s ease-out;
    border: #040404 solid 4px;
    border-radius: 15px;
}

.btn-black:hover {background: transparent!important; border: #fff solid 4px;}

.btn-black-bg {
    display: inline-block;
    color: #fff;
    background: var(--dark-grey);
    width: auto;
    padding: 24px;
    font-family: 'Ruda', sans-serif;
    font-size: 25px;
    font-weight: 600;
    text-align: center;
    transition: all .4s ease-out;
    border: #040404 solid 4px;
    border-radius: 15px;
}

.btn-black-bg:hover {background: transparent!important; border: #040404 solid 4px; color: var(--dark-grey);}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

.list-top-section .list-listings-count, .list-content .price-container .price, .parts-list-content .parts-title-and-breadcrumbs .parts-listings-count, .parts-list-content .error-message, .listing-prices__retail-price {color: var(--red)!important;}

.dealer-contact__details_right-col span {color: var(--dark-grey)!important;}

.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), .view-all-link {background: var(--red)!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, .detail__cta-buttons button:hover, .view-all-link:hover, .dealer-contact__buttons button:hover, .detail-contact-bar button:hover {background: var(--dark-grey)!important;}

/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 1700px) {
	.links .flex {gap: 30px;}
	.center-section .heading-mdlg {width: 600px;}
}

@media only screen and (max-width: 1200px) {
	.col-2 .grey-box {flex-wrap: wrap;}
	.col-2 {gap: 20px;}
	.my-site-footer .bg-black .wrapper > div:first-child > div .flex {gap: 200px;}
	.col-2 .grey-box .btn-top {width: 50%;}
}

@media only screen and (max-width: 1150px) {
	.col-3 {flex-wrap: wrap;}
	.col-3 .grey-box {max-width: 100%;}
}

@media only screen and (max-width: 1100px) {
	.heading-lg {font-size: 80px;}
	.contact-box .box-red, .contact-box .box-black {padding: 80px 30px;}
}

@media only screen and (max-width: 1000px) {
	.heading-lg {font-size: 60px;}
	.home-hero .video-height {height: 700px;}
	.home-hero .wrapper {top: 130px;}
	.col-2 {flex-wrap: wrap;}
	.col-2 .grey-box {max-width: 100%;}
	.my-site-footer .bg-black .wrapper > div:last-child {flex-direction: column;}
}

@media only screen and (max-width: 900px) {
	.my-site-footer .bg-black .wrapper > div:first-child > div .flex {gap: 50px;}
	.img-right {flex-wrap: wrap;}
	.img-right .img-height {height: 200px;}
}

@media only screen and (max-width: 850px) {
	.img-left,.contact-box {flex-wrap: wrap;}
	.img-left .img-height {height: 200px;}
	.form-all {min-width: 100px;}
	.contact-box .box-red {border-radius: 15px 15px 0 0;}
	.contact-box .box-black {border-radius: 0 0 15px 15px;}
}

@media only screen and (max-width: 730px) {
	.heading-lg {font-size: 36px;}
	.heading-mdlg {font-size: 30px;}
	.heading-md {font-size: 28px;}
	.home-hero p {font-size: 17px!important; margin-bottom: 40px; margin-top: 20px;}
	.home-hero .video-height {height: 500px;}
	.col-2 .grey-box .btn-top {width: 59%;}
	
	.label, .form-half input, .col-2-map .grey-box a {font-size: 17px!important;}
	#home p, #thankyou p, #service p, #contact p, .col-2 .grey-box li, .my-site-footer p, .my-site-footer li,.my-site-footer a {font-size: 17px!important;}
	.btn-black, .btn-black-bg, .inner-hero a, .inner-hero p {font-size: 20px!important;}
	
	.links .flex {padding-top: 50px!important; padding-bottom: 50px!important;}
	.col-2 {padding-top: 80px!important; padding-bottom: 80px!important;}
	.contact-box, .img-left, .col-3, .img-right, .col-2-map, #thankyou .center {padding-bottom: 80px!important;}
	.form-all-center {margin: 0 auto 90px!important; padding-bottom: 90px!important;}
}

@media only screen and (max-width: 700px) {
	.col-2-map {flex-wrap: wrap; gap: 20px;}
	.col-2-map .img-height {height: 200px;}
}

@media only screen and (max-width: 630px) {
	.home-hero .video-height {height: 550px;}
}

@media only screen and (max-width: 600px) {
	.form-half {width: 100%; margin: 15px 0;}
	.flex-row {flex-wrap: wrap;}
}

@media only screen and (max-width: 545px) {
.logo-footer-2 .img-height-2 {max-width: 150px;}
}

@media only screen and (max-width: 530px) {
	.my-site-footer .bg-black .wrapper > div:first-child {flex-direction: column; gap: 50px;}
	.my-site-footer .bg-black .wrapper > div:last-child {margin-top: 50px;}
	.my-site-footer .bg-black {padding-bottom: 100px;}
	.col-3 .grey-box {padding: 30px 20px;}
	.contact-box .heading-md {font-size: 20px;}
	.contact-box .box-red, .contact-box .box-black {padding: 40px 10px;}
}

@media only screen and (max-width: 420px) {
	.home-hero .wrapper {top: 80px;}
	.home-hero .video-height {height: 600px;}
	.btn-black {width: 220px;}
	.col-2-map .grey-box {padding: 30px 10px;}
}

@media only screen and (max-width: 370px) {
	.my-site-footer .bg-black .wrapper > div:first-child > div .flex {gap: 15px;}
	.contact-box .heading-md {font-size: 17px;}
}

@media only screen and (max-width: 355px) {
.logo-footer-2 .img-height-2 {max-width: 100px;}
	.logo-footer-2 { margin: 0 auto 40px;}
}

@media only screen and (max-width: 350px) {
	.my-site-footer p, .my-site-footer li, .my-site-footer a {font-size: 15px!important;}
	.col-2 .grey-box .btn-top {width: 94%;}
}