/***** BEGIN RESET *****/
@import url("https://use.typekit.net/xlf4yui.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;  
} 

/*-------- COLORS --------*/
:root {
  --dark-red: #C21015;
  --red: #DD313A;
  --dark-grey: #383A3C;
  --grey: #D8D8D8;
  --light-grey: #F2F2F2;
  --blue: #3B598D;
}

/***** 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 {font-family: 'roboto-condensed', sans-serif;}
h2, h3, h4 {font-family: 'roboto', sans-serif;}

#home p, #thankyou p, #service p, #mobile-service p, #contact p, #parts p, #location p, #news-specials, #powered-trailers p, #points-12 p, #drivers-and-sleep p, #winterize-trucks p, #fleet-productivity p, #zero-emissions p, .inner-hero p, #TNT-Acquisition p  {
	font-family: 'roboto', sans-serif;
	font-size: 17px;
	color: var(--dark-grey);
	line-height: 35px;
}

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

body {

}

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


hr{border:#000 1px solid;}

/*--- HERO STYLES ---------------------*/
.home-hero {
	background: url("/siteart/home-hero.jpg") no-repeat;
	background-position: center;
	background-size: cover;
	background-color: var(--dark-grey);
	height: auto;
	position: relative;
	z-index: 1;
}
.home-hero > div {background: linear-gradient(90deg, rgba(42, 42, 42, 0.70) 0%, rgba(42, 42, 42, 0.60) 100%);}
.home-hero .hero-content {padding-bottom: 400px!important; padding-top: 260px!important; }
.home-hero .heading-lg {max-width: 900px; width: 100%; text-align: center; margin: 0 auto;}
.home-hero .heading-lg span {font-weight: 300;}
.home-hero .btn-top {gap: 15px; flex-wrap: wrap; justify-content: center;}

.background-color {background: var(--dark-grey);}

.search-form {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -70px;
	z-index: 2;
}
.form-background {background: var(--red); padding: 30px 15px!important; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); border-radius: 10px;}

.search-form .flex-row {
    display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
}
.search-form  .form-half {
    display: inline-block;
    max-width: 450px;
    width: 100%;
    margin: 15px 15px 15px 0;
    border: none;
}

.search-form .form-half input, .search-form  .form-half select {
	display: inline-block;
    padding: 15px !important;
    max-width: 450px;
    width: 100%;
    background: #fff;
    border: none;
    font-family: 'roboto', sans-serif;
    font-size: 17px;
    box-sizing: border-box;
    color: var(--dark-grey);
}

input::placeholder, textarea::placeholder {
	 color: var(--dark-grey);
}

.inner-hero {background: url("/siteart/stats-background.jpg") no-repeat; background-position: center; background-size: cover; background-color: var(--dark-grey); }
.inner-hero > div {background: linear-gradient(90deg, rgba(42, 42, 42, 0.70) 0%, rgba(42, 42, 42, 0.60) 100%); }
.inner-hero .padding-top {padding-top: 400px;}
.inner-hero .blue-background {background: rgba(59,89,141,.9); padding: 30px 0;}
.inner-hero .flex {display: flex; align-items: center; gap: 30px; flex-wrap: wrap;}
.inner-hero hr {margin: 0; border: #fff solid 1px; height: 30px;}
.inner-hero a {font-size: 17px; font-family: 'roboto', sans-serif; font-weight: 700; color: #fff!important;}
.inner-hero p {color: #fff!important;}
.inner-hero a:hover {text-decoration: underline;}

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

/*---col-5---*/
.col-5 {
	background: url("/siteart/stats-background.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	background-color: var(--dark-grey);
	hight: auto;
}
.col-5 > div {background: rgba(59,89,141,.9);}
.col-5 .flex {justify-content: center; padding-top: 120px!important; padding-bottom: 70px!important; gap: 100px;}
.col-5 .heading-lg {margin-bottom: 15px; text-align: center;}
.col-5 p {color: #fff!important; text-align: center;}

/*---col-2-img---*/
.col-2-img {margin-top: 10px;}
.col-2-img .img-height {max-width: 50%; width: 100%; height: 300px;position: relative; background-color: var(--dark-grey);transition: all .4s ease-out;}
.col-2-img .img-height img {width: 100%; height: 100%; object-fit: cover;}
.col-2-img .img-height div {background: linear-gradient(180deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.40) 100%);width: 100%; position: absolute; top: 0; left: 0; right: 0; height: 300px;}
.col-2-img .img-height .heading-md {position: absolute; bottom: 55px; left: 55px; text-transform: uppercase; color: #fff;}
.col-2-img .img-height i {margin-left: 30px;}

.col-2-img .img-height:hover {background-color: var(--blue);}
.col-2-img .img-height:hover img {opacity: .1;}
.col-2-img .img-height:hover div {background: transparent;}

/*---inventory-links---*/
.inventory-links {padding-top: 130px!important; padding-bottom: 130px!important; max-width: 1750px!important;}
.inventory-links .heading-mdlg {text-align: center; margin-bottom: 65px;}
.inventory-links .heading-mdsm {margin-top: 10px;}
.inventory-links .heading-mdsm, .inventory-links p {color: #fff!important;}
.inventory-links hr {border:1.5px solid #fff!important; width: 50px; margin-left: 0;}

.inventory-links > .flex {gap: 10px; justify-content: center;}
.inventory-links > .flex .flex {gap: 10px;}
.inventory-links .grid-left {width: 100%;}
.inventory-links .img-height {max-width: 605px; width: 100%; height: 350px; position: relative; background-color: var(--dark-grey); transition: 0.4s ease-out;}
.inventory-links .img-height img {width: 100%; height: 100%; object-fit: cover;}
.inventory-links .img-height .gradient {width: 100%; position: absolute; top: 0px; left: 0px; right: 0px; height: 350px; background: linear-gradient(rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.4) 100%);}
.inventory-links .img-height div:last-child {position: absolute; bottom: 35px; left: 40px; margin-right: 30px;}
.inventory-links .grid-left > div:first-child {margin-bottom: 10px;}
.inventory-links .img-height-tall, .inventory-links .img-height-tall .gradient {height: 710px!important;}

.inventory-links .img-height:hover {background-color: var(--red);}
.inventory-links .img-height:hover img {opacity: .1;}
.inventory-links .img-height:hover div {background: transparent;}

/*---col-3-blue---*/
.col-3-blue {background: var(--light-grey);}
.col-3-blue .wrapper {max-width: 1750px!important;padding-top: 120px!important; padding-bottom: 120px!important;}
.col-3-blue .blue-box {max-width: 600px; width: 100%; background: var(--blue); border-radius: 5px; padding: 50px 20px;}
.col-3-blue .blue-box div {display: flex;justify-content: center; flex-direction: column;}
.col-3-blue .heading-mdsm {margin-bottom: 5px;}
.col-3-blue .heading-mdsm, .col-3-blue p {color: #fff!important; text-align: center;}
.col-3-blue i {font-size: 35px; color: #fff; border: 1px solid #fff; border-radius: 60px; padding: 23px 20px; margin: 0 auto 40px;}
.col-3-blue .flex {gap: 15px;justify-content: center;}
.col-3-blue .flex:first-child {margin-bottom: 15px;}
.col-3-blue .flex .blue-box:last-child i {padding: 20px 20px;}

/*---txt-left---*/
.txt-left {max-width: 1750px!important; padding-top: 130px!important; padding-bottom: 100px!important; align-items: center; gap: 60px;}
.txt-left hr {border: 1.5px solid #D8D8D8; width: 40px; margin-left: 0; margin-top: 30px; margin-bottom: 20px;}
.txt-left p {max-width: 900px;}
.txt-left .img-height {height: 460px;}

/*---col-3-grey---*/
.col-3-grey {max-width: 1750px!important; padding-bottom: 150px!important;}
.col-3-grey .heading-mdlg {text-align: center; margin-bottom: 60px;}
.col-3-grey .flex {gap: 20px; justify-content: center;}
.col-3-grey > div:nth-child(2) {margin-bottom: 20px;}
.col-3-grey .grey-box {max-width: 600px; width: 100%; background: var(--light-grey); border-radius: 2px; padding: 50px 40px 80px; border: solid 1px #3B598D; position: relative;}
.col-3-grey .grey-box div {display: flex;justify-content: center; flex-direction: column;}
.col-3-grey hr {border: 1.5px solid #D8D8D8; width: 55px; margin-top: 15px; margin-bottom: 12px;}
.col-3-grey .heading-mdsm {color: var(--red);}
.col-3-grey .heading-mdsm, .col-3-grey p {text-align: center;}
.col-3-grey .color-red {color: var(--dark-red);}

.col-3-grey a {color: var(--dark-red); text-align: center; font-family: 'roboto', sans-serif; position: absolute; bottom: 50px; left: 0; right: 0;}
.col-3-grey a:hover {text-decoration: underline;}
.col-3-grey a i {margin-left: 14px;}

/*---col-2---*/
.col-2 {gap: 60px; align-items: center; padding-bottom: 130px!important;}
.col-2 .blue-background {background: var(--blue); padding: 70px 60px 70px 130px; border-radius: 0 10px 10px;width: 100%; max-width: 560px;min-width: 520px;}
.col-2 .blue-background .heading-mdsm, .col-2 .blue-background a, .col-2 .blue-background p, .col-2 .blue-background h3 {color: #fff!important;}
.col-2 .blue-background .heading-mdsm {margin-bottom: 30px;font-family: 'roboto-condensed', sans-serif!important;}
.col-2 .blue-background a {font-size: 17px; font-family: 'roboto', sans-serif;}
.col-2 .blue-background a:hover {text-decoration: underline;}
.col-2 .general-contact p {margin-bottom: 20px; margin-left: 30px;}
.col-2 .blue-background p span {font-weight: 500;}
.col-2 .general-contact {margin-bottom: 40px;}
.col-2 .general-contact div {margin-bottom: 20px;}
.col-2 .blue-background i {margin-right: 10px;}
.col-2 .blue-background .flex {gap: 20px; justify-content: space-between; background: rgba(255, 255, 255, .2); padding: 30px; border-radius: 5px; align-items: center;}
.col-2 .blue-background .flex > div > div:first-child {margin-bottom: 10px;}
.col-2 .blue-background h3 {font-size: 23px!important; font-family: 'roboto-condensed', sans-serif!important; font-weight: 500;}
.col-2 .blue-background > div > div:last-child {margin-top: 15px;}

.col-2 > div:last-child {max-width: 800px; padding-right: 15px;}
.col-2 .heading-mdlg {margin-bottom: 30px;}

/*---review-slider---*/
.center-slider {background-color: var(--light-grey);}

.center-slider .heading-mdlg {text-align: center;padding-top: 100px;}

.center-slider .hero-slide-wrap {
	max-width: 1300px;
	width: 100%;
	margin: 0 auto;
}

.center-slider .testimonial {
	position: relative;
	overflow: hidden;
	width: 100%;
	box-sizing: border-box;
	transition: .4s ease;
	margin: 0 auto; 
	max-width: 800px;
	padding: 50px 0;
}

.center-slider .testimonial .title {font-weight: 700!important; text-transform: uppercase;}
.center-slider .testimonial p {text-align: center;}

.center-slider .slide-text {
	height: 100%;
	padding-top: 50px;
	padding-bottom: 100px;
	margin: 0 80px;
}

.center-slider .slide-text div {height: 100%; background: #fff;}
.center-slider .slide-text .slick-slide {margin-left: 10px;margin-right: 10px;}

/*--------PAGE STYLES--------------------*/
/*---service---*/
#service .col-3-grey .flex, #mobile-service .col-3-grey .flex {margin-bottom: 20px;}
#service .col-3-grey .no-margin, #mobile-service .col-3-grey .no-margin {margin-bottom: 0!important;}
#service .col-3-grey .grey-box, #mobile-service .col-3-grey .grey-box {padding: 50px 15px;}

.col-2-contact {padding-bottom: 130px!important; align-items: center; gap: 60px;}
.col-2-contact .img-height {height: 550px; max-width: 750px; width: 100%;}
.col-2-contact .img-height iframe {border-radius: 0 10px 10px;}
.col-2-contact > div:last-child {min-width: 561px; padding-right: 15px;}
.col-2-contact .heading-mdlg {margin-bottom: 30px;}
.col-2-contact .flex {gap: 80px;}
.col-2-contact h3 {font-size: 20px; color: var(--dark-grey); margin-bottom: 20px; text-transform: uppercase;}
.col-2-contact .contact {margin-bottom: 30px;}
.col-2-contact .contact > div {margin-bottom: 10px;}
.col-2-contact .contact > div a {color: var(--dark-grey); font-size: 17px;  font-family: 'roboto', sans-serif;line-height: 35px;}
.col-2-contact .contact > div a:hover {text-decoration: underline;}
.col-2-contact .contact i {margin-right: 10px;}

.form-bg {gap: 30px; padding-top: 130px!important;justify-content: space-between;}
.form-bg .content-left {max-width: 800px;}
.form-bg .heading-lg {color: var(--dark-grey); margin-bottom: 30px; text-transform: uppercase;}
.form-bg .heading-lg span {font-weight: 300;}
.form-bg hr {border: 1.5px solid #D8D8D8; width: 40px; margin-left: 0; margin-top: 30px; margin-bottom: 20px;}

/*---mobile-service---*/
.grey-bg {padding-bottom: 120px !important; padding-top: 120px !important; background: var(--light-grey);}
.grey-bg .flex {gap: 30px; justify-content: space-between;max-width: 1750px !important;}
.grey-bg .blue-box, .form-bg .blue-box {max-width: 600px;width: 100%;background: var(--blue);border-radius: 5px;padding: 50px 20px; margin-bottom: 20px;box-sizing: border-box;}
.grey-bg .flex > div:last-child {width: 100%; max-width: 640px;}
.grey-bg .blue-box .heading-mdsm, .form-bg .blue-box .heading-mdsm {text-align: center;color: #fff !important;margin-bottom: 5px;}
.grey-bg .blue-box p, .form-bg .blue-box p {text-align: center; color: #fff !important;}
.grey-bg hr { border: 1.5px solid #D8D8D8; width: 40px; margin-left: 0; margin-top: 30px; margin-bottom: 20px;}

/*---parts---*/
#parts .heading-lg, #location .heading-lg {color: var(--dark-grey); margin-bottom: 30px; text-transform: uppercase;}
#parts .heading-lg span, #location .heading-lg span {font-weight: 300;}
#parts .grey-bg .wrapper > div:first-child {max-width: 850px;}
#parts .grey-bg {background: #fff!important;}
#parts .col-2-contact .img-height {height: 750px;}
#parts .col-2-contact > div:last-child {min-width: 924px;}

/*---location---*/
#location .grey-bg {background: #fff!important; padding-bottom: 0!important;}
#location .grey-bg .wrapper > div:first-child {max-width: 850px; width: 100%;}
.map-alone {height: 400px;}

/*---contact---*/
#contact .col-3-grey .grey-box {padding: 50px 40px;}
.col-3-grey .margin-top {margin-top: 20px;}
#contact .col-3-grey a {position: relative; bottom: 0; line-height: 35px;;}
#contact .col-3-grey p {margin-bottom: 20px;}

/*---news-specials---*/
.center-txt {padding-top: 130px!important; padding-bottom: 130px!important; max-width: 800px!important;}
.center-txt .heading-lg {color: var(--dark-grey); text-align: center; margin-bottom: 30px;}
.center-txt .heading-lg span, .center-txt-news .heading-lg span {font-weight: 300;}
.center-txt p {text-align: center;}
.center-txt .btn-top {margin: 30px auto 0; text-align: center;}

.img-left .flex, .img-right .flex {justify-content: space-between; align-items: center; gap: 40px;padding: 80px 15px;}
.img-left .img-height, .img-right .img-height {max-width: 900px; height: 500px; width: 100%;}
.img-right {background: var(--light-grey);}
.img-left .img-height img, .img-right .img-height img {width: 100%; height: 100%; object-fit: cover;}
.img-left .content-right, .img-right .content-left {max-width: 850px;}
.img-left .color-red, .img-right .color-red {margin-bottom: 25px; margin-top: 10px;}


/*---news-specials-individual---*/
.center-txt-news {max-width: 1250px!important; text-align: center;}
.center-txt-news .heading-lg {color: var(--dark-grey)!important; }
.center-txt-news hr {border: 1.5px solid #D8D8D8; width: 40px; margin-top: 30px; margin-bottom: 20px;}
.center-txt-news .list-2nd-row {margin-top: 20px;}
.center-txt-news .list-top {margin-top: 40px;}
.padding-bg {padding-top: 130px!important; padding-bottom: 130px!important;}
.padding-sm {padding-bottom: 100px!important;}
.center-txt-news .heading-mdlg {margin-bottom: 20px;}
.center-txt-news .heading-mdsm {margin-top: 30px;text-transform: none!important;}

.side-by-side-list h3, .side-by-side-list-bg h3, .side-by-side-list h4 {font-size: 17px; font-weight: 600; margin-bottom: 10px;}
.side-by-side-list, .side-by-side-list-bg {gap: 20px; justify-content: center;}
.side-by-side-list > div, .side-by-side-list-bg > div {max-width: 600px; width: 100%; text-align: center; background: var(--light-grey); padding: 20px; border-radius: 2px; border: #3B598D solid 1px;}
.side-by-side-list .color-red, .side-by-side-list-bg .color-red {font-weight: 700;}

#zero-emissions .side-by-side-list-bg {flex-wrap: wrap;}
#zero-emissions .side-by-side-list-bg > div {max-width: 100%;}

#TNT-Acquisition .color-red {font-weight: 700;}

/*---thankyou---*/
#thankyou .center-txt {padding-bottom: 130px!important;}

/*--------FORM STYLES--------------------*/
.form-all .heading-md {margin-bottom: 10px; color: var(--dark-grey);}
.form-all-center .heading-lg {margin-bottom: 10px; color: var(--dark-grey)!important;}
.form-all-center .heading-lg span {font-weight: 300!important;}
.form-all-center p {margin-bottom: 40px;}
.form-all p {max-width: 820px; margin-bottom: 40px;}

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

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

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

.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: 'roboto', sans-serif;
	box-sizing: border-box;
	background: var(--light-grey);
	font-size: 17px;
	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: 'roboto', sans-serif;
	background: var(--light-grey);
	font-size: 17px;
	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: 'roboto', sans-serif;}
.CaptchaPanel {text-align: right!important;}
.captcha-button {float: right;}


/*-------- FOOTER STYLES ----------------*/
.my-site-footer{background: var(--blue); padding-top:80px!important; padding-bottom: 110px!important;}
.my-site-footer .wrapper {justify-content: space-between; gap: 50px; display: flex; flex-wrap: wrap;}
.my-site-footer .wrapper .flex {gap: 36px;}
.my-site-footer .footer-heading {color: #fff!important; font-weight: 600; font-family: 'roboto-condensed', sans-serif!important; font-size: 22px!important; margin-bottom: 40px;}
.my-site-footer li {margin-bottom: 20px;}
.my-site-footer a {color: #fff; font-size: 17px; font-family: 'roboto', sans-serif;}
.my-site-footer a span {font-weight: 500;}
.my-site-footer a:hover {text-decoration: underline;}

.footer-item{
	flex: 1 1 262px;
	min-width: 262px;
}

.no-wrap{
	white-space: nowrap;
}

/*-------- UNIVERSAL STYLES ----------------*/
.wrapper {
	padding: 0 15px; 
	margin: 0 auto;
	max-width: 1830px;
}
.flex {display: flex;}
.btn-top {margin-top: 35px;}
.color-red {color: var(--dark-red)!important;}
.p-top {margin-top: 20px;}

/*---Headings---*/
.heading-lg {font-size: 45px; color: #fff; font-weight: 700;}
.heading-mdsm {font-size: 25px; font-weight: 500; text-transform: uppercase;}
.heading-md {font-size: 28px; font-weight: 700;}
.heading-mdlg {font-size: 32px; font-weight: 600; color: var(--dark-grey);text-transform: uppercase;}
.heading-mdlg span {font-weight: 400;}

/*---Buttons---*/
.btn-red {
	display: inline-block;
    color: #fff;
    background: var(--red);
    width: 220px;
    padding: 15px;
    font-family: 'roboto', sans-serif;
    font-size: 17px;
    font-weight: 500;
    text-align: center;
    transition: all .4s ease-out;
    border: 3px solid #DD313A;
    border-radius: 30px;
}

.btn-red:hover {background: var(--blue); border: 3px solid #3B598D;}
.btn-outline:hover {background: #fff; color: var(--dark-grey);}

.btn-outline {
	display: inline-block;
    color: #fff;
    background: transparent;
    width: 220px;
    padding: 15px;
    font-family: 'roboto', sans-serif;
    font-size: 17px;
    font-weight: 500;
    text-align: center;
    transition: all .4s ease-out;
    border: 3px solid #fff;
    border-radius: 30px;
}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.list-listings-count, .list-content .price-container .price, .listing-prices__retail-price {color: var(--blue)!important;}
.dealer-contact__phone a span, .dealer-contact__details_right-col button span {color: var(--dark-red)!important;}


.view-listing-details-link, .faceted-search-content .selected-facets-container .selected-facet, .list-content .list-error-container .info button:not(.login-button) {background: var(--red)!important; border-radius: 30px!important; transition: all .4s ease-out;}
.view-listing-details-link:hover, .detail__cta-buttons button:hover, .dealer-contact__buttons button:hover, .detail-contact-bar button:hover, .list-content .list-error-container .info button:not(.login-button):hover {background: var(--blue)!important;}

.detail-contact-bar button, .contact-options a {background: var(--blue)!important; border-radius: 30px!important;}
.detail-contact-bar button:hover, .contact-options a:hover {background: var(--red)!important; transition: all .4s ease-out;}

/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1580px) {
	.col-2 .blue-background {padding: 70px 15px!important;}
}

@media only screen and (max-width: 1230px) {
	#parts .col-2-contact {flex-wrap: wrap;}
	#parts .col-2-contact .img-height {height: 250px; max-width: 100%;}
	#parts .col-2-contact .img-height iframe {border-radius: 0;}
	#parts .col-2-contact > div:last-child {padding-left: 15px;min-width: 100px;}
	.col-2-contact .flex {flex-wrap: wrap;}
}

@media only screen and (max-width: 1150px) {
	.col-5 .flex {gap: 40px;}
}

@media only screen and (max-width: 1000px) {
	.inventory-links > .flex {flex-wrap: wrap;}
	.inventory-links .img-height-tall, .inventory-links .img-height-tall .gradient, .inventory-links .img-height, .inventory-links .img-height .gradient {height: 300px!important;}
	.inventory-links .img-height-tall {max-width: 100%;}
}

@media only screen and (max-width:980px) {
	#parts .col-2-contact .flex {gap: 20px;}
}

@media only screen and (max-width: 950px) {
	.search-form {bottom: -280px;}
	.search-form .flex-row {flex-direction: column;}
	.search-form .form-half {margin: 15px 0; max-width: 950px;}
	.search-form .form-half input, .search-form .form-half select {max-width: 950px;}
	.search-form #submit-btn {width: 100%;}
	.search-form .btn-outline {width: 100%;}
	.col-5 {margin-top: 330px;}
	.col-5 .flex {padding-top: 70px!important;}
	.col-3-grey .flex {flex-wrap: wrap;}
	.col-3-grey .grey-box {max-width: 100%; padding: 50px 15px 80px;}
	#contact .col-3-grey .grey-box {padding: 15px;}
	#service .col-3-grey .grey-box, #mobile-service .col-3-grey .grey-box {padding: 15px;}
	.col-2, .col-2-contact {gap: 20px;}
	.side-by-side-list-bg {flex-wrap: wrap;}
	.side-by-side-list-bg > div {max-width: 100%;}
}

@media only screen and (max-width: 900px) {
	.col-5 .flex {flex-direction: column;}
	.col-5 .flex {flex-wrap: wrap;}
	.col-2 {flex-wrap: wrap; gap: 50px;}
	.col-2 > div:last-child {padding-left: 15px;}
	.col-2 .blue-background {max-width: 100%;min-width: 100px; border-radius: 0;}
	.form-bg {flex-wrap: wrap;gap: 80px;}
	.form-all {max-width: 100%!important; min-width: 100px;}
	.grey-bg .flex {flex-wrap: wrap; gap: 50px;}
	.grey-bg .blue-box, .grey-bg .flex > div:last-child, .form-bg .blue-box {max-width: 100%;}
}

@media only screen and (max-width: 850px) {
	.col-2-contact {flex-wrap: wrap; gap: 50px;}
	.col-2-contact .img-height {max-width: 100%; height: 250px;}
	.col-2-contact .img-height iframe {border-radius: 0;}
	.col-2-contact > div:last-child {min-width: 100px; padding-left: 15px;}
}

@media only screen and (max-width: 730px) {
	.col-2-img {flex-wrap: wrap; gap: 10px;}
	.col-2-img .img-height {max-width: 100%; height: 200px;}
	.col-2-img .img-height div {height: 200px;}
	.col-3-blue .flex {flex-wrap: wrap;}
	.col-3-blue .blue-box {padding: 35px 15px;}
	.img-left .flex {flex-direction: column;}
	.img-right .flex {flex-direction: column-reverse;}
	.img-left .img-height, .img-right .img-height {height: 250px;}
}

@media only screen and (max-width: 700px) {
	.txt-left .img-height {display: none;}
	.side-by-side-list {flex-wrap: wrap;}
}

@media only screen and (max-width: 600px) {
	.heading-lg {font-size: 35px;}
	.home-hero .heading-lg span {font-size: 30px;}
	.heading-md {font-size: 22px;}
	.heading-mdlg {font-size: 26px;}
	.col-2 .blue-background a, .col-2 .blue-background p {font-size: 15px!important;}
	.col-2 .blue-background .flex {flex-wrap: wrap;}
	.center-slider .slide-text {margin: 0 10px;}
	.col-2-contact .flex, #parts .col-2-contact .flex {flex-direction: column; gap: 0px;}
	.map-alone {height: 250px;}
	.inner-hero .padding-top {padding-top: 300px;}
	
	.home-hero .hero-content {padding-top: 250px!important; padding-bottom: 150px!important;}
	.col-3-blue .wrapper, .inventory-links, .grey-bg, .padding-bg, .center-txt {padding-bottom: 100px!important; padding-top: 100px!important;}
	.txt-left, .form-bg, #location .grey-bg {padding-top: 100px!important;}
	.padding-sm {padding-bottom: 80px!important;}
	.col-2, .col-3-grey, .col-2-contact, #thankyou .center-txt {padding-bottom: 100px!important;}
	.my-site-footer {padding-bottom: 80px!important;}
}

@media only screen and (max-width: 500px) {
	.inventory-links > .flex .flex {flex-wrap: wrap;}
	.inventory-links .img-height-tall, .inventory-links .img-height-tall .gradient, .inventory-links .img-height, .inventory-links .img-height .gradient {height: 250px!important;}
	.my-site-footer .wrapper .flex {gap: 50px;}
	.flex-row{flex-direction: column;}
	.form-half {width: 100%; margin: 15px 0;}
}

@media only screen and (max-width: 340px) {
	.heading-lg {font-size: 30px;}
	.home-hero .heading-lg span {font-size: 25px;}
	.col-2-img .img-height .heading-md {bottom: 30px; left: 15px;}
	.my-site-footer .wrapper .flex {gap: 25px;}
}