/***** BEGIN RESET *****/

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 --------

*/

/***** 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 {font-family: obviously, sans-serif !important;font-size: 15px;

}

h1,h2,h3,h4,h5,h6 {font-family: eurostile, sans-serif !important;}

p {font-family: obviously, sans-serif !important;font-size: 15px !important;}
 
a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border: none;background: #cccccc40;height: 1px;margin: 5% 0;}

/*--- HEADER STYLES ---------------------*/
header {border: 1px solid #e8e8e8;}
.flex-head {justify-content: space-between;padding: 10px 0;}
.socials a span {font-size: 18px !important;}
a.facebook-ico, a.twitter-ico, .mail-ico {color: #000;}
.top-bar {justify-content: flex-end;gap: 20px;font-family: eurostile, sans-serif !important;}
.logo img {width: 100%;max-width: 200px;min-width: 150px;}
.right-head {display: flex;flex-direction: column;justify-content: space-between;}
.phone-head a {font-weight: 800;letter-spacing: 1px; transition: .3s all;color: #000;}
.phone-head a span {
    opacity: .5;
	transition: .3s all;
}
.phone-head a:hover span {
    opacity: 1;
}
.socials a i {transition: .3s all;}
.socials a:hover .yellow-txt {color: #000;}
.socials a:hover .fa-brands,.socials a:hover .fa-solid {color: #fff;}
/*---BODY--------------------------------*/
.page-wid {
    max-width: 1400px;
    margin: 0 auto;
	width: 90%;
}

.page-wid a {
    font-weight: 500;
    color: #000;
    letter-spacing: 1px;
	transition: .3s all;
}

.page-wid a:hover {color:#ffc619}
.relative{position: relative;}
.wid90{width:90%;margin: 0 auto;}
.flex-container {
	display: flex;
}
.grid-container {display: grid;}
.right-align{text-align: right !important;}
.yellow-txt {
    color: #ffc619;
}
.center {
	text-align: center;
}
.align-center{align-items: center;}
.opacity-txt {color: #fff;}
#pad-xl {
    padding-top: clamp(70px, 5%, 90px);
    padding-bottom: clamp(70px, 5%, 90px);
}

#pad-top{padding-top: clamp(70px, 5%, 90px);}
#pad-l-top{padding-top: clamp(20px, 5%, 40px) !important;}
#pad-bottom{padding-bottom: clamp(70px, 5%, 90px);}
#pad-l {
    padding-top: clamp(20px, 5%, 40px) !important;
    padding-bottom: clamp(20px, 5%, 40px) !important;
}

.sub-breadcrumbs a,.sub-breadcrumbs {font-family: obviously, sans-serif !important;color: #fff; text-transform: uppercase;font-size: 15px;letter-spacing: 1px;font-weight: 500;}

/* HERO */
.hero {background:url("/siteart/hero.jpg") no-repeat;background-size: cover;background-position: center center;display: flex;justify-content: flex-end;max-height: 100%;min-height: 500px;}
.herowrap {padding: 40px 0;width: 85%;margin: 0 auto;color: #fff;}

.hero-text {width: 50%;background: rgba(0,0,0,0.80);margin-top: 15%;display:flex;align-items: center;}
.herowrap h1 {font-size: 54px;text-transform: uppercase;line-height: 1;margin-bottom: 20px;letter-spacing: 1px;}
.herowrap h1 span{display: block;}
.hero-search {
	margin-top: 40px;
}

.hero-search form {
    display: flex;
    border-radius: 90px !important;
    background: #fff;
    overflow: hidden;
	border: none !important;
}

.hero-search input {
    flex: 1;
    padding: 15px 20px;
	font-size: 13px !important;
    box-sizing: content-box;
    border: none;font-family: obviously, sans-serif !important;}

.hero-search button {
    box-sizing: content-box;
    min-width: 60px;
    border: none;
    border-radius: 90px;
    background: #ffc619;
    font-size: 18px;
	cursor: pointer;
	transition: .3s all !important;
}

.hero-search button:hover {background: #000;color:#ffc619}

/*---BRAND SECTION---*/
.grey-bg {background: #f8f8f8;}
.grid-brands {
    grid-template-columns: repeat(6, 1fr);
    gap:20px;
}

.brand-section .wid90{}
a.brands {background-color: #fff;
opacity: 0.8;
background-image: radial-gradient(#ddd 1.1px, #fff 1.1px);
background-size: 22px 22px;border-radius: 3px;text-align: center;padding: 25px;border: 1px solid #eee;transition:.3s all;color:#000;}
a.brands h3 {text-transform: uppercase;font-size: 22px;font-weight: 800;letter-spacing: 1px;}
a.brands:hover {box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;}
.grid-brands img {max-width: 100%;width: 100%;}
.brand-section h2 {text-transform: uppercase;font-weight: 900;text-align: center;font-size: 48px;}
.brand-section p {text-align: center;}

a.brands p {font-size: 15px !important ;margin-top: 10px;}
a.brands p:after {content:'\f0a9';font-family: "Font Awesome 6 Free";color:#ffc619;margin-left: 5px;font-weight: 900;}



/*  scrolling inventory
------------------------------------------------*/
section.inv-categories {
    overflow: hidden;
}

section.inv-categories h2 {
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 1px;
	margin-bottom: 10px;}

.cat-slider {
    margin-left: 5%;
    overflow: hidden;
}
.cat {margin: 5px;border-radius: 3px;overflow: hidden;transition: .3s all;max-height: 250px;}
.cat img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.cat {position: relative;}

.overlay {position: absolute;top: 0;bottom: 0;left: 0;right: 0;display: flex;align-items: flex-end;justify-content: center;z-index: 99999;background: rgba(0,0,0,0.45);transition: .3s all;}
.cat h3 {
    padding-bottom: 30px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 900;
	text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}

.cat:hover .overlay {
    background: rgba(0,0,0,0.1);
}
.slide-btn, .slide-cats {
   position: absolute;
    top: -25%;
    right: 0;
    display: flex;
    gap: 10px;
}
/*  home
------------------------------------------------*/
.home-wrap {
    align-items: center;
    gap: 5%;
}
.home-txt {
    padding-top: 40px !important;
}
.home-txt h2 {
    font-size: 38px;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 1px;
    margin-bottom: 20px;
}
.home-img,.home-txt{flex: 1;}
img.team-pic {
    max-width: 95%;
    width: 100%;
    margin: 0 auto !important;
}
.home-img {
    text-align: right;
}

img.dot-bg {
     position: absolute;
    top: -5%;
    left: 0;
    max-width: 100%;
    height: 50%;
}

section.home-service {background: url("../siteart/servicebg.jpg") no-repeat;background-size: cover;background-position: center center;display:flex;justify-content: flex-start;}
.home-service .herowrap {
    padding: 50px 0;
}
.home-service h2 {
    text-transform: uppercase;
    font-size: 34px;
    line-height: 1.1;
    margin-bottom: 20px;
    letter-spacing: 0;
}

.home-service p {
    margin-bottom: 40px;
}
/*  scrolling inventory
------------------------------------------------*/
.subhero {
    overflow: hidden;
    object-fit: contain;
    position: relative;
    min-height: 200px;
    max-height: 600px;
    height: 60vh;
}

.subhero img {max-width: 100%;
    width: 100%;
    object-fit: cover;
    height: 100%;}
.subhero-overlay {
    position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	align-items: center;
    color: #fff;
	justify-content: center;
	background: rgba(14,14,14,0.75);
}

.subtext {
    text-align: center;
    width: 50%;
}

.subtext hr {
    border: none;
    background: #ffc619;
    height: 10px;
    max-width: 90px;
    margin: 20px auto;
}


/*  ABOUT
------------------------------------------------*/
.sub-contact{background: url("/siteart/servicebg.jpg"), no-repeat;background-size:cover !important;background-position: center 60%;}
.contact-us h3{font-size: 28px;margin-bottom: 20px;}


/*  ABOUT
------------------------------------------------*/
.sub-about{background: url("/siteart/about-hero.jpg"), no-repeat;background-size:cover !important;background-position: center 70%;}

/*  RENTAL
------------------------------------------------*/
.sub-rental{background: url("/siteart/rentals-banner.jpg"), no-repeat;background-size:cover !important;background-position: center 20%;}
/*  SERVICE
------------------------------------------------*/
.sub-service {background: url("/siteart/service-hero.jpg"), no-repeat;background-size:cover !important;background-position: 50% 22%;}
.grid-service {grid-template-columns: repeat(3, 1fr);gap: 15px;grid-auto-rows: minmax(100px, auto);}
.service-box {border: 1px solid #e8e8e8;background: #f8f8f8;padding: 20px;font-size: 15px;}

.service-icon img{width: 100%;max-width: 100%;}

.service-box h2 {font-size: 18px;text-transform: uppercase;letter-spacing: 1px;}
.service-icon {background: rgb(255 198 25 / 70%);color: #000;padding: 10px;font-size: 22px;border: 1px solid #ffc619;width: auto !important;width: 30px !important;height: 30px;display: flex;align-items: center;justify-content: center;margin: 0 0 10px;}

.subtext h1 {font-size: 48px;margin-bottom: 10px;}

.repair-truck {align-items: center;gap: 80px;}
.repair-txt {flex: 1;position: relative;}
.repair-txt h2{text-transform: uppercase;font-weight: 900;letter-spacing: 1px;font-size: 28px;margin-bottom: 20px;}
.main-img{max-width: 100%;width: 95%;object-fit: cover;height: 100%;}

.about-dot {height: 30% !important;top: -5% !important;}
.repair-txt img.dot-bg {left: unset;right: 0;height: 50%;top: -10%;opacity: 1;}

.about-flex {align-items: flex-start !important;}

/*  NEW PARTS
------------------------------------------------*/
.parts-pg .brand-section {margin-top: 40px !important; margin-bottom: 40px !important;}
.parts-hero {background: url("/siteart/parts-hero.jpg") no-repeat !important; background-position: center !important; background-size: cover !important;}
.parts-banner {background: linear-gradient(180deg, rgba(33,33,33,1) 0%, rgba(33,33,33,0.85) 0%),url("../siteart/parts-img.jpg") no-repeat;background-position: center !important;background-size:cover !important;color:#fff;}
.parts-banner strong {
    font-weight: 800;
	border-bottom: 4px solid #ffc619;
	margin-bottom: 5px;
}
.parts-banner h2 {
    font-size: 36px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 15px;
}
/*  scrolling inventory
------------------------------------------------*/
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
 
.scrolling{
    width:100%;
    height:92px;
}
/*--------BUTTONS--------------------*/
button {cursor: pointer;}
.button-wrap {
    display: flex;
    gap: 20px;
    margin-top: 40px;
}

.thanks .button-wrap {justify-content: center;}
.light-btn {
    background: #e5e5e5;
	cursor: pointer;
    border: 1px solid #e5e5e5;
    padding: 10px 15px;
    font-size: 20px;
    color: #000;
    transition: .4s all;
}
.light-btn:hover {
     background: #fff;
}
.dark-btn {
    background: #000;
	cursor: pointer;
    border: 1px solid #000;
    padding: 10px 15px;
    font-size: 20px;
    color: #fff;
    transition: .4s all;
}
.dark-btn:hover {
    color: #ffc619;
}
.view-all button {
    border: none;
    background: #fff;
    font-family: obviously, sans-serif !important;
    font-size: 16px;
    font-weight: 500;
	cursor: pointer;
    transition: .4s all;
}

.view-all button:hover {letter-spacing: 1px;}
.view-all {
    margin: 15px auto !important;
}
button.black-round {
    padding: 20px 30px;
    border: 1px solid #000;
    border-radius: 90px;
    background: #000;
    color: #fff;
    font-weight: 900;
    letter-spacing: 1px;
    font-family: obviously, sans-serif !important;
	line-height: 1;
}
button.grey-round {
	line-height: 1;
    padding: 20px 30px;
    border: 1px solid #e5e5e5;
    border-radius: 90px;
    background: #e5e5e5;
    color: #000;text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 1px;
    font-family: obviously, sans-serif !important;
}
button.yellow-round {
	line-height: 1;
    padding: 20px 30px;
    border: 1px solid #ffc619;
    border-radius: 90px;
    background: #ffc619;
    color: #000;text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 1px;
    font-family: obviously, sans-serif !important;
}

.mobile-show,.mobile-hide{display: none;}


/* Underline From Center */
.hvr-underline-from-center {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  overflow: hidden;
}
.hvr-underline-from-center:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 51%;
  right: 51%;
  bottom: 0;
  background: #ffc619;
  height: 4px;
  -webkit-transition-property: left, right;
  transition-property: left, right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before {
  left: 0;
  right: 0;
}

/*-------- FOOTER STYLES ----------------*/
footer {background: #000 !important;padding: 40px 0;}

.flex-foot {    justify-content: space-between;}
.foot-col a {font-family: eurostile, sans-serif !important;color: #fff;font-size: 16px !important;font-weight: 600 !important;letter-spacing: 1px;transition:.3s all;}
.foot-col a:hover {color: #ffc619 !important;}
.foot-socials a { color: #000 !important;}
.foot-socials a {font-size: 18px !important;opacity: .3;transition: .3s all;}
.foot-socials a span {font-size: 18px;}
.foot-socials a:hover {opacity: 1;}
.foot-nav ul {display: flex;gap: 40px;line-height: 1.5;}

p.fin-calc {
    font-size: 10px !important;
}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.listing-top-right a, .lower-detail-data-left button, .send-email-btn, .media-buttons a, .media-buttons button, .faceted-search, .listing-dealer-info a, .view-listing-details-link, .main-detail-data .contact-options a, .fin-calc-btn-mobile, .selected-facet, .page-nav, .apply-button, .back-button, .calculator-btn, .mobile-done-button {
    -moz-border-radius: 90px !important;
    -o-border-radius: 90px !important;
    -webkit-border-radius: 90px !important;
    border-radius: 90px !important;
}
.list-top-section .list-title .list-title-text {font-family: eurostile, sans-serif !important;text-transform: uppercase !important;letter-spacing: 1px !important;font-weight: 800 !important;}
.view-listing-details-link,.faceted-search-content .selected-facets-container .selected-facet {background: #ffc619 !important; border-color: #ffc619 !important;color: #000 !important;    font-weight: 500 !important;}

p.fin-calc,.faceted-search-content .selected-facets-container .selected-facet {
    font-size: 10px !important;
}
.list-content .listing-description,.faceted-search-content .selected-facets-container .selected-facet,.faceted-search-content .faceted-section-box .faceted-option-checkbox-container .option-name,.faceted-search-content .faceted-section-head .faceted-section-title {    font-family: obviously, sans-serif !important;}
.list-content .list-listing .dealer-name,.list-content .listing-portion-title {letter-spacing: 1px !important;}
.linking-container a {
    font-size: 12px !important;
    line-height: 0 !important;
}
.dealer-contact__name p, .dealer-contact__phone, .dealer-contact__location p {
    font-size: 12px !important;
}
/*----------.linking-container RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1350px) {
	.herowrap h1 {font-size: 46px;}
	.grid-brands {grid-template-columns: repeat(4, 1fr);}
	.parts-banner h2 {line-height: 1.25 !important;font-size: 28px;}
	.parts-banner strong {display: block;width:fit-content;margin:0 auto;}
	
}
@media only screen and (max-width: 1100px) {
	.herowrap h1 {font-size: 42px;}
	.home-service h2 {font-size: 28px;}
	.hero-text {margin-top: 15%;}
	img.dot-bg {height: auto !important;}
	p {font-size: 15px !important;}
	.rental-pg .grid-service {grid-template-columns: repeat(2, 1fr);}
	.repair-truck {flex-wrap: wrap; gap: 30px;}
	.repair-truck div {flex-basis: 100%;}
	.subtext{width: 90%;}
}

@media only screen and (max-width: 969px) {
	.top-bar .socials {display: none !important;}
	.navigation {text-align: right !important;}
	.logo img {max-width: 100%; height: 100px !important;}
	.socials { width: 90%;margin: 0 auto;text-align: left;}
	.mobile-hide{display: block;}
	.herowrap span{display: none;}
	.hero .hero-text{display: none;margin: 0 !important;}
	.hero{flex-direction: column;background-position: center 80% !important;height: 45vh;min-height: 350px;}
	.hero-search { margin-top: 0;}
	.mobile-hero h1{text-transform: uppercase;line-height: 1;margin-bottom: 20px;letter-spacing: 1px;font-weight: 900;font-size: 36px;}
	.mobile-hero .hero-text {width: 100%;background: rgba(0,0,0,1);display: flex;align-items: center;margin-top: 0 !important;}
	.mobile-hero .herowrap{width: 90% !important;}
	.home-img {display: none;}
	.home-txt h2 {font-size: 28px;}
	.inv-categories {padding: 0 !important;}
	
	.contact-us .grid-service {grid-template-columns: repeat(1, 1fr);}
	.contact-us .service-box {display: flex;padding: 0;background: none;border: none;gap:20px;}
	    .grid-brands {
			grid-template-columns: repeat(3, 1fr);}
	a.brands h3 {font-size: 18px;}
	a.brands p {
		font-size: 14px !important;}
	.brand-section h2 {font-size: 36px;}
	
}

@media only screen and (max-width: 825px) {
	.three-flex {flex-wrap: wrap;}
}

@media only screen and (max-width: 800px) {
	.home-service {flex-wrap:wrap;}
	.mobile-show {display: block;flex-basis: 100%;}
	.mobile-hero div#pad-xl,.home-txt {
    padding: 20px 0 !important;
}
	.home-service .hero-text{margin-top: 0 !important;width: 100%;background: #000;flex-basis: 100%;}
	.mobile-service img {max-width: 100%;width: 100%;}
	.slide-btn, .slide-cats {positioN: unset;}
	section.inv-categories h2 {margin: 0 !important;}
	span.slide-btn.slide-cats {
    padding: 15px 0 !important;
}
	.grid-brands {grid-template-columns: repeat(3, 1fr);}
}
@media only screen and (max-width: 570px) {
	.foot-col:last-of-type {order: -1;}
	.flex-foot {flex-wrap:wrap;gap: 30px;}
	.foot-col {flex-basis: 100%;}
	.button-wrap {flex-wrap:wrap;}
	.hero{height: 25vh;min-height: 150px;}
	.mobile-hero h1 {font-size: 32px;}
	.grid-brands {grid-template-columns: repeat(2, 1fr);}
}


@media only screen and (max-width: 500px) {
	.service-icon {margin-bottom: 0;}
	.service-box{display: flex;align-items:center;gap:10px;}
	.grid-service {grid-template-columns: repeat(1, 1fr);}	
	.parts-banner h2 {line-height: 1.25 !important;font-size: 22px;}
	.parts-banner strong {border: none !important;}
	
}
@media only screen and (max-width: 420px) {
	.top-bar {display: none !important}
	.flex-head {align-items: center;}
	.logo img {width: 100px !important;height: auto !important;}
		.cat-slider {
    width: 90%;
    margin: 0 auto !important;
}.service-box h2 {
    font-size: 16px;
	}
	.contact-us .grid-service {gap:30px;}
	.contact-us .service-box {flex-wrap:wrap;gap: 10px;}
	.contact-us .service-box span {flex-basis: 100%;}
	.hero-search form {flex-wrap: wrap;background: transparent;border-radius: 0 !important;gap:10px;}
	.hero-search input {border-radius: 90px;flex-basis:100%;}
	.hero-search button {padding: 10px;flex-basis:100%;}
	.grid-brands {
		grid-template-columns: repeat(1, 1fr);}
	
}

@media only screen and (max-width: 360px) {
	.foot-nav ul {flex-wrap:wrap;gap: 0;}
	.foot-nav span{flex-basis: 100%;border-radius: 90px;}
}