@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
/***** 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;  
} 
html {scroll-behavior: smooth;}
p {
	font-family: "Roboto", sans-serif !important;
}

body {    font-family: "Roboto", sans-serif !important;}
/*-------- COLORS --------
red: #00164d
*/




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

.clear {clear: both}


/*--- HEADER STYLES ---------------------*/
#learnmore,#job-opening-jump {scroll-margin-top: 130px;}
header#fixed-head {
    position: fixed;
	background: #fff;
	transition: 0.4s;
	width: 100%;
	top: 0;
	z-index: 999;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	
}


.logo {
	flex: 1;
}

.logo img {
    max-width: 100%;
    width: 400px;
    min-width: 300px;
    transition: 0.4s;
    display: inline-block;
    vertical-align: middle;
}

.right-side {
	flex: 1;
	display: flex;
    align-items: center;
    gap: 15px;
	justify-content: flex-end;
}

.social-icons {
    display: flex;
    gap: 8px;
    font-size: 16px !important;
}

.social-icons a {
	color: #af1616;
	transition: .3s all;
}

.social-icons a:hover {
	color: #222;
}

.main-header {
	background: #fff;
	justify-content: space-between;
	-ms-align-items: center;
	align-items: center;
}


.flex-wrap {
	display: flex;
}

#fullwidth {
    position: absolute;
    width: 100%;
    left: 0;
	transition: 0.4s;
    right: 0;
}

.bottom-header {
    text-align: right;
    display: absolute;
    max-width: 1280px !important;
    width: 90%;
    margin: 0 auto;
}

nav.top-links {
    padding: 0;
    display: inline-block;
    margin: 0;
    width: 100%;
    position: relative;
}

nav.top-links ul {
    margin: 0;
    padding: 0;
	text-align: right !important;
}

nav.top-links ul li {
    display: inline-block;
    margin: 0;
    list-style-type: none;
    width: auto;
}


nav.top-links ul li a {
    display: block;
    text-decoration: none;
    color: #000;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    padding: 10px;
    margin: 0;
    text-align: center;
    -webkit-transition: .4s ease-in;
    -moz-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    transition: .2s ease-in;
    font-family: 'Roboto Condensed', sans-serif;
}

nav.top-links ul li a:hover {
	color: #8c9da5;
}

/*---NEW HOME PAGE ---*/

.hero-home {
	background: url("/siteart/hero-new.jpg") no-repeat;
	background-size: cover;
	min-height: 130px;
    padding: 12% 0;
    background-position: 50% 40%;
	    margin-top: 3%;
}

.grey-bg {
    background: #f1f1f1;
}

.cat-boxes {
   width: 90%;
    margin: 0 auto;
    padding: 40px 0;
    display: flex;
    justify-content: space-between;
    gap: 30px;
}

a.cat {
   display: flex;
	justify-content: center;
	align-items: center;
    padding: 20px;
    background: #fff;
    flex: 1;
	color: #000;
	transition: .6s all;
}

a.cat:hover {
  box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
	color: #000;
}

a.cat:hover .cat-content img{
	filter: brightness(0);
} 

.cat-content {
    display: flex;
    flex-direction: column;
    gap: 30px;
    text-align: center;
    align-items: center;
}

h3.cat-title {
    text-transform: uppercase;
    font-weight: 900;
    font-style: italic;
    font-size: 18px;
    font-family: 'Roboto Condensed', sans-serif;
	letter-spacing: 1px;
	color: #282828!important;
}

.cat-content img {
    max-width: 100%;
    width: 180px;
	transition: .6s all;
}

.page-wid {
	max-width: 1280px !important;
	width: 90% !important;
	margin: 0 auto;
}

.home-links.flex-wrap {
    flex-wrap: wrap;
    padding: 40px 0;
    /* gap: 1%; */
    gap: 15px;
	justify-content: center;
}


.link-content {
    width: 85%;
    margin: 0 auto;
    height: auto !important;
	z-index: 99999;
	text-shadow: 2px 3px 5px rgba(0,0,0,0.4);
}

.short-link {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.home-links a {
    padding: 30px 0;
}

.link-content h2 {
    font-size: 28px;
    text-transform: uppercase;
    line-height: 32px;
}




a.h-links.work-link,a.h-links.location-link,.short-link,a.bottom-link.repair-link {
   flex-basis: 32%;
    width: 100%;
    color: #fff;
}


.bottom-long-link.specials-link {
        flex-basis: 65%;
    color: #fff;
}


a.h-links.work-link {
    height: 250px;
}

a.h-links{
	color: #fff !important;
}

.h-links {
    flex-basis: 100%;
	color: #fff;
	position: relative !important;
}


.h-links:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(34,34,34,0.6);
    transition: .6s all;
}


a.h-links:hover:before {
	background: rgba(255,255,255,0.0);
}


.link-content {
	position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
	z-index: 99999;
	height: auto !important
}

span.small-txt {
    font-size: 22px;
    margin-bottom: 10px;
    display: inline-block;
    font-weight: 400;
}




a.h-links p {
	text-transform: uppercase;
	font-size: 15px;
	font-family: 'Roboto Condensed', sans-serif;
}
a.bottom-link, a.bottom-long-link {
    height: 135px;
}

.specials-link .link-content {
    display: flex;
	    align-items: center;
        justify-content: space-between !important;
    flex-direction: row !important;
	    bottom: 0;
    top: 0;
}

.short-link .link-content {
    justify-content: center !important;
}
.work-link {
	background: url("/siteart/home-img/career-img.jpg") no-repeat;
	background-size: cover;
	background-position: 44% 75%;
}

.location-link {
	background: url("/siteart/home-img/location-img.jpg") no-repeat;
	background-size: cover;
	background-position: 25% 75%;
}

.fin-link {
	background: url("/siteart/slides/slide5.jpg") no-repeat;
	background-size: cover;
	background-position: 25% 75%;
}

.review-link {
	background: url("/siteart/home-img/leave-review-img.jpg") no-repeat;
	background-size: cover;
	    background-position: 25% 60%;
}

.repair-link {
	background: url("/siteart/home-img/service-img.jpg") no-repeat;
	background-size: cover;
	    background-position: 25% 60%;
}

.specials-link {
	background: url("/siteart/home-img/parts-img.jpg") no-repeat;
	background-size: cover;
	background-position: 25% 38%;
}

.link-content span {
    flex: 1;
}

.link-content p {
    font-size: 16px;
    font-style: italic;
}




.bottom-long-link a {
	padding: 0!important;
}

.bottom-long-link.specials-link h2 {
    font-size: 36px;
    line-height: 40px;
}

.home-text {
	background: url("/siteart/home-img/home-text.jpg") no-repeat;
	    padding: 80px 0;
    background-size: cover;
    background-position: 25% 50%;
	
	color: #fff;
}

.specials-link .link-content .blue-buttons {
	width: 100% !important;
}
.red-buttons {
	color: #fff;
    background: #af1616;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
    font-style: italic;
    transition: .3s ease;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid #af1616;
    cursor: pointer;
    font-size: 16px;
    padding: 10px 20px;
	    max-width: 300px;
}

.red-buttons:hover {
	background: #ddd;
	color: #000;
	border: 1px solid #ddd;
}

.grey-buttons {
	color: #000;
    background: #ddd;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
    font-style: italic;
    transition: .3s ease;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid #ddd;
    cursor: pointer;
    font-size: 16px;
    padding: 10px 20px;
	    max-width: 300px;
}

.grey-buttons:hover {
	background: #000;
	color: #fff;
	border: 1px solid #000;
}
.black-buttons {
	color: #fff;
    background: #000;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
    font-style: italic;
    transition: .3s ease;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid #000;
    cursor: pointer;
    font-size: 16px;
    padding: 10px 20px;
	    max-width: 300px;
}

.black-buttons:hover {
	background: #f1f1f1;
	color: #000;
	border: 1px solid #f1f1f1;
}

.blue-buttons {
	color: #fff;
    background: #00164d;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
    font-style: italic;
    transition: .3s ease;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid #00164d;
    cursor: pointer;
    font-size: 16px;
    padding: 10px 20px;
}

.blue-buttons:hover {
	background: #000;
	border: 1px solid #000;
}

.grey-btn {
	color: #212121;
    background: #ddd;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
    font-style: italic;
    transition: .3s ease;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid #ddd;
    cursor: pointer;
	font-size: 16px;
    padding: 10px 20px;
}

.grey-btn:hover {
	background: #000;
	border-color: #000;
	color: #fff;
}

.home-text .red-buttons:hover {
	background: #ddd;
	border: 1px solid #ddd;
}
.link-content .red-buttons {
	width: 100% !important;
	 font-size: 18px;
    padding: 10px 0;
}

.home-text .red-buttons {
	    margin: 10px 0 0;
    font-size: 16px;
	padding: 10px 15px;
}

.location-wrap,.career-wrap {
    flex-wrap: wrap;
    gap: 60px;
	   
}

.location-wrap {
	 padding: 60px 0;
}


.career-wrap {
	padding: 60px 0 !important;
	align-items: center;
}

.half-page {
	flex: 1;
}

.flex-select {
	display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
    justify-content: center;
}


.contact-btn {
	    display: block;
    width: 100%;
	
}

.contact-btn .blk-btn {
	background: #ffffff;
    float: none !important;
    width: auto !important;
    color: #000;
    padding: 10px;
    justify-content: space-between;
    align-items: center;
    display: flex;
    font-size: 18px !important;
    margin: 0 !important;
    box-sizing: border-box;
}

.half-page h2,div#learnmore h2 {
	font-size: 28px;
    font-weight: 700;
    font-style: italic;
    letter-spacing: 1px;
    color: #fff;
    line-height: 32px;
    text-transform: uppercase;
    margin-bottom: 15px;
}

div#learnmore h2 {color: #000;}

span#blacktxt {
    color: #000 !important;
	
}

.location-wrap span#blacktxt {
	font-size: 28px !important;
}

.career-wrap span#blacktxt {
	margin-bottom: 15px;
}

.half-page img {
	width: 500px;
	max-width: 100%;
}

.career-btn {
	    display: inline-block;
    padding: 10px 20px;
    color: #fff;
    font-style: italic;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    float: none;
    text-align: center;
    transition: .3s ease;
	font-size: 16px !important;
	background: #00164d;
	border: 1px solid #00164d;
	font-family: 'Roboto Condensed', sans-serif;
	cursor: pointer;
}

.career-btn:hover {background:#000;border-color: #000;}



.dark-bg {
	background: #282828;
	color: #fff;
}

#grey-txt {
	color: #7A7A7A;
}

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

body {font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; font-size:16px; line-height: 24px; overflow-x:hidden;

}

a:link, a:visited, a:active {text-decoration:none;color:#5D6A70; transition: .3s ease;}
a:hover {text-decoration:none;color:#212121}


hr{border:#000 1px solid;}

h1 {font-style: italic; text-transform: uppercase;}
h1, h2, h3, h4 {font-family: 'Roboto Condensed', sans-serif;}

.heading {font-style: italic; text-transform: uppercase; font-size: 2em;}
.subheading {font-family: 'Roboto Condensed', sans-serif; font-size: 1.5em;}
.heading-xl {text-transform: uppercase; font-size: 3em; line-height: 1;}



.blue-text { color: #8c9da5}
.white-text { color: #fff}
.lt-text {font-weight: 200;}

.top {width: 100%;
	float: right;
	-ms-transform: skew(-40deg, 0deg);
    -webkit-transform: skew(-40deg, 0deg);
    transform: skew(-40deg, 0deg); 
}
.top ul {float:right; margin-right:15px;}
.top ul li {display: inline-block;font-family: 'Roboto Condensed', sans-serif; }
.top ul li a{ color:#000;font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; padding:10px 8px;}
.top .socials {float: right;margin-right:45px;}
.top .socials a{display: inline-block; color:#C22033; font-size:22px; margin: 0 3px; transition: .3s ease;}
.top .socials a:hover{display: inline-block; color:#212121; font-size:22px; margin: 0 3px;}
.stick{position: fixed; top: 0; width: 100%; background:#fff; z-index: 99999999999; box-shadow: 0 0 10px 0 rgba(0,0,0,.2); transition: all .3s linear}
.stick .header{display: none;}
.push{height: auto;}
/* SLIDESHOW */


.hero-slider .slider{position:relative; width: 100%; z-index:0; background: #333; overflow:hidden;min-height: 400px;}
.hero-slider .slide_group{position:relative;width:100%;}
.hero-slider .slide{display:none; position: absolute; width:100%; height:auto; max-height: 600px;}
.hero-slider .slide img{display: block; position: relative; width: 100%; height: auto;}
.hero-slider .slide video{position: relative; width: 100%; height: auto;}


.hero-slider .slide:first-child{display:block;}
.hero-slider .slide_buttons{text-align:center;position:absolute;z-index: 9;top: 92%; left: 0; right: 0;}
.hero-slider a.slide_btn{font-size:48px;color:#af1616;margin:0 1px;-webkit-transition:all 0.4s ease-in-out;-moz-transition:all 0.4s ease-in-out;-ms-transition:all 0.4s ease-in-out;-o-transition:all 0.4s ease-in-out;transition:all 0.4s ease-in-out;}
.hero-slider .slide_btn.active, .slide_btn:hover{font-size:48px;color:rgba(255,255,255,0.60);cursor:pointer;}

.hero-slider .slide .slide-link{position:absolute; width: 100%; max-width: 700px; padding: 0 25px; box-sizing: border-box; font-weight: 700; color: #fff; top: 40px; z-index: 30; text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25); line-height: normal; text-align: right; right: 25px;}
.hero-slider .slide .slide-link .link-text h2{font-size: 45px; text-transform: uppercase; color: #fff;}
.hero-slider .slide .slide-link .link-text p{font-size: 16px; color: #fff; margin: 5px 0;font-weight: 300;  width: 100%; text-align: right;  padding: 10px 0;}
.hero-slider .slide .button-link a{display:block; margin: 15px 0; background: #212121; padding: 15px; text-transform: uppercase; text-align: center; text-decoration: none; box-sizing: border-box; color: #fff; max-width: 230px;font-family: 'Roboto Condensed', sans-serif; font-style: italic; transition: .3s ease; float: right;}
.hero-slider .slide .button-link a:hover{ background: #af1616; }

.hero-slider {
    position: relative;
    margin-top: 60px;
background: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.13209033613445376) 100%), url("/siteart/Slides/slide1.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.slidehome {
	margin-bottom: 0 !important;
    overflow: hidden;
}
.slidehome .slick-slide {
    filter: brightness(.6);
    min-height: 350px !important;
}

.slidehome .slick-track,.hero-slider {
	
   height: 600px !important;
}
.slick-track {
	
}
.hero-text {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    max-width: 1280px !important;
    width: 90% !important;
}

.hero-text h1 {
    font-size: 68px;
    line-height: 1;
    margin-bottom: 30px;
	text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}

.button-wrap {
    display: flex;
    justify-content: center;
    gap: 20px;
}

 span.small-hero {
    font-size: 32px;
    font-weight: 500;
    margin-top: 10px;
    display: block;
}

.slide img {
    filter: brightness(0.5);
}

video#bgvid {
  object-fit: cover;
  width: 100%;
  height:710px;
  top: 0;
  left: 0;
	background-position: center center;
}

.hp-slideshow {width: 100%; margin: 0 auto;background: #f1f1f1; padding: 65px 0;border-top:1px solid #000;}


.slide1 {
	background: url("/siteart/Slides/slide1.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	background-color:black;
}

.slide2 {
	background: url("/siteart/slides/slide2.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.slide3 {
	background: url("/siteart/Slides/slide4.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.slide4 {
	background: url("/siteart/Slides/slide5.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.slide5 {
	background: url("/siteart/Slides/slide9.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.slide6 {
	background: url("/siteart/Slides/slide10.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.slide7 {
	background: url("/siteart/Slides/slide11.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.slide8 {
	background: url("/siteart/Slides/slide12.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}
/* FIXED FORM */
.mailing-list-mobile {background: #212121; margin: 0 auto; text-align: center; padding: 10px 0;display: none;}
.mailing-list-mobile h1 {font-size: 25px; line-height: 35px; letter-spacing: 1px; color:#fff; text-align: center;}
.mailing-list-mobile .red-btn {float: none; width: 100%; text-align: center; display: inline-block; vertical-align: middle;}
.container-bnr {background: #212121; padding: 10px 0; position: fixed; left:0;  width: 100%; bottom: 0px;z-index: 999999;}
.mailing-list {width: 80%; margin: 0 auto; display: inline-block;}
.mailing-list h1 {font-size: 30px; letter-spacing: 1px; color:#fff; text-align: center; display: inline-block; vertical-align: middle; }
.mailing-list .red-btn {float: left; width: 100%; text-align: center; display: inline-block; vertical-align: middle;}
.mailing-title {display: inline-block; width: 40%; vertical-align: middle;}
.mailing-btn {width: 50%; display: inline-block; vertical-align: middle;}


/*ELECTRIFICATION PAGE*/
.button-wrapper {
    display: flex;
    gap: 20px;
}

.button-wrapper a {
    flex: 1;
}


.electric-page hr {
    border: none;
    margin-top: clamp(70px, 5%, 90px);
	margin-bottom:clamp(70px, 5%, 90px);
    height: 1px;
    background: #eaeaea;
}

.electric-wrap h2,.electric-cta h2 {
  text-align: center;
  font-size: 32px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 900;
  margin-bottom: 20px;
	line-height: 1.25;
}

.model-bar {
 display: flex;
gap: 15px;
justify-content: center;
max-width: 900px;
margin: 30px auto;
}

.electric-btn {
  padding: 10px;
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
	font-family: 'Roboto Condensed', sans-serif;
font-size:18px;
flex: 1;
	transition: .3s all;
	cursor: pointer;
	color: #5B5B5B;
	    max-width: 250px;
}

.model-wrap p {font-weight: 400 !important;}

.electric-btn:hover {
	
	color: rgba(0,0,0,1.0);
}

.electric-btn.peterbiltselect,.electric-btn.volvoselect,.electric-btn.mackselect,.electric-btn.battleselect {

	color: rgba(0,0,0,1.0);
  border-bottom: 3px solid #af1616;
}
.model-title {
  display: flex;
    align-items: center;
    margin: 20px 0;
}

.model-title img {
     max-width: 100%;
    width: 125px;
}

.volvo-model .model-title img {
    max-width: 100%;
    width: 90px;
}

.model-title h3 {
	text-transform: uppercase;
    font-size: 36px;
    letter-spacing: 1px;
    font-weight: 900;
}

.main-model {
  display: flex;
  justify-content: space-between;
  align-content: stretch;
}

.model-info-right .model-title {
	justify-content: flex-end;
}

.model-info {
  flex: 1;
  margin-right: -5%;
  z-index: 9;
}

.model-info-right {
  flex: 1;
  margin-left: -5%;
  z-index: 9;
}

.model-info span,.model-info-right span {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.model-slide {
  flex-basis: 60%;
}

.model-slide img {
  max-width: 100%;
  width: 100%;
height: 100%;
    object-fit: cover;
    object-position: 15%;	
}

.model-txt {
    padding: 50px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
	
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.model-txt a {
	display: inline-block;
}
.model-txt a,.model-txt .blue-buttons {
	width: 200px !important;
	max-width: 100%;
	margin-top: 30px;
}
.model-txt h4 {
  font-size: 22px;
  text-transform: uppercase;
}

.mack-model .model-title img {
    filter: brightness(0) invert(0);
}
.battle-motors .model-title {
    flex-wrap: wrap;
    gap: 15px;
}


.battle-motors .model-title img {
    max-width: 100%;
    width: 150px;
}

.battle-motors h3 {
    flex-basis: 100%;
    text-align: right;
}

.grid-container {
    grid-template-columns: repeat(4, 1fr);
    display: grid;
    gap: 20px;
	    margin-top: 30px;
}

.grid-cta {
    text-align: left;
       padding: 60% 0;
	    position: relative;
	cursor: pointer;
}


.cta-wrap {
    width: 80%;
    margin: 0 auto;
    font-size: 18px;
    line-height: 1.25;
    text-transform: uppercase;
    font-weight: 500;
	position: absolute;
    top: 60%;
    left: 0;
    right: 0;
    display: flex;
    gap: 10px;
	    font-style: italic;
    letter-spacing: 1px;
	align-items: flex-start;
}

.grid-cta:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgb(0 0 0 / 30%);
    transition: .6s all;
}

.grid-cta:hover:before {
    background: #00164d;
	color: #fff;
}

a.grid-cta {
	color: #fff !important;
}

.e-calc {
	background: url("../siteart/home-img/finance-img.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}



.e-incentives {
	background: url("../siteart/electrification/mack/Mack MD Electric 2.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.e-charge {
	background: url("../siteart/electrification/ev-lineup-abb-all-units.jpg") no-repeat;
	background-size: cover;
	background-position: 15% 50%;
}

.e-demo {
	background: url("../siteart/financeinfo.jpg") no-repeat;
	background-size: cover;
	background-position: center;
}

.electric-cta a {
    color: #fff;
    font-weight: 700;
	transition: .3s all;
}

.electric-cta a:hover {
	color:#af1616;
}

/*MAILING LIST Notification*/
.container-bnr {
	width: 100%;
	float:left;
	z-index:9999;
	height: auto;
	text-align:center;
	bottom:0px;
	text-align: center;
}

.bnr {
	width:100%; 
	min-width: 800px;
	height:auto; 
	background-size: cover;
	color:#000; 
	text-align:center; 
	box-sizing: border-box;
	z-index:10; 
	bottom:15px;
	margin-bottom: -15px;
	overflow: hidden;
	margin: 0 auto;
}
.bar-right {
	display: inline-block; 
	vertical-align: top;
	background: url(siteart/bar2.jpg) no-repeat;
	background-size: cover;
	height: 50px;
	width: 50px;
	text-align: center;
	box-sizing: border-box;
	padding: 18px 0px 0px 0px;
}
.bar-right:hover {
	opacity: .6;
}

.bar-right img {
width:25px;	
}

.bar-right img:hover {
	cursor: pointer;
}

.hide { 
	display:none;
}


.closeNow { 
	right: -50000px;
}


.topbutton a{
width:60%;
float:left;
background:#000;
margin:0 0% 0 25%;
text-align:center;
color:#fff;	
font-family: 'Montserrat', san-serif;
font-weight:500;
font-size:32px;
border:3px solid #000;
-webkit-transition: all .2s ease; /* Safari and Chrome */
    -moz-transition: all .2s ease; /* Firefox */
    -ms-transition: all .2s ease; /* IE 9 */
    -o-transition: all .2s ease; /* Opera */
    transition: all .2s ease;
}

.topbutton img {
width:100%;
float:left;	
}

.topbutton a:hover {

}

/*End Slide Down Notification*/ 
 
.top-banner-closed {
    padding: 10px 20px;
    font-size: 22px;
    line-height: 1.5;
    font-weight: 800;
    text-align: center;
    background: #222;
    color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
    text-transform: uppercase;
}

.top-banner-closed a {
    font-size: 22px !important;
    font-weight: 800 !important;
    color: #fff;
	text-decoration: underline;
	transition: .3s all;
}

.top-banner-closed a:hover {
	color: #af1616;
	text-decoration: none;
}
/*-------- NEW CAREER PAGE --------*/
.career-pg {padding-bottom: 0 !important;display: block !important;}
.half-pg h2,.career-pg h2 {text-transform: uppercase;font-weight: 900;letter-spacing: 1px;font-style:italic;font-size: 28px;line-height: 1.25;}
.half-pg img {max-width: 100%;width: 100%;}
.flex-career {display: flex;gap:5%;flex-wrap:wrap;align-items: center;}
.dark-wrap {
    background: #000;
}
.career-bar {
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.career-page {
    padding: 20px 0;
    text-align: center;
    font-size: 24px;
    letter-spacing: 1px;
    line-height: 1.5;
    background: #000;
    color: #fff;
    border-bottom: 1px solid #eee;
}

ul.career-list li {
    list-style: none;
    line-height: 1.5;
    margin-bottom: 15px;
}

.slide-career {height: 250px !important;overflow: hidden;}
.career-slide img {height: 100% !important;width: 100% !important;object-fit: cover;}
ul.career-list strong {letter-spacing: 1px;display: block;font-weight: 900;}
.technician-section h4 {font-size: 24px;margin-bottom: 10px !important;display: block;}
.technician-section h3 {text-transform: uppercase;}
.testimonial-slide .slick-track,.career-slide .slick-track{height: auto !important;}
.career-width {max-width: 1050px;margin: 0 auto;}
.career-pg hr {border: none; background: #ddd;height: 1px; width: 100%;margin: 0 !important;}
button.career-option {
    flex: 1;
    padding: 15px 0;
    text-transform: uppercase;
    font-family: 'Roboto Condensed', sans-serif;
    letter-spacing: 1px;
    font-size: 18px;
    cursor: pointer;
    background: #000;
    color: #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    border-top: 0;
    border-bottom: 0;
}
.width.flex-button {display: flex;justify-content: center;gap: 10px !important;}
.width.flex-button a {flex-basis: 100%;}.width.flex-button a div {width: 100%;margin: 0 !important;padding: 10px 0;}

button.career-option.tablink.career-select {background: #8c9da5;color:#fff }
.half-pg {flex: 1;}
.vid-wrap {box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px; display: flex;}

.vid-wrap video {
    height: 100%;
    width: 100%;
}
.employee-test {background-color: #fff;background-image: url("/siteart/cubes.png");}
.employee-test .width {max-width: 100%; margin: 0 auto;}
.testimonial-slide .slick-slide,.career-slide .slick-slide {min-height: auto !important;filter: none !important;}
.flex-testimony {margin: 5px; display: flex;box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px;padding: 20px;box-sizing: border-box;gap: 5%;background: #fff !important;align-items: center;}

.emp-img {flex: 1;}
.emp-testimony {flex: 2;}
.emp-img img,.career-slide img {
    max-width: 100%;
    width: 100%;
}
.employee-test h2 {
    font-size: 28px;
    text-align: center;
    margin-bottom: 20px;
}

.employee-test h3 {font-size: 18px !important;text-transform: uppercase;color: #333 !important;}
span#lg-text i {
    font-size: 28px;
    color: #ddd;
}
.about-goals {max-width: 900px;margin: 0 auto;}
.career-tab h3 {font-size: 28px;color:#00164d;}
.life-img h2 {padding: 20px 0;}
.life-img {background: #8c9da5;color: #fff;}

.flexer {display:flex;gap: 20px;align-items: stretch;}
/*---BODY--------------------------------*/
#padding25 {padding:25px 0;}
#padding50 {padding:50px 0;}
.width {width:70%; margin: 0 auto;}
.width-90 {width:90%; margin: 0 auto;}
.blk {color:#000;}
.generic-buttonwrap {display: flex;gap: 30px;}
.center {text-align: center;}
/*----------MFG CALL OUT BUTTONS HP----------------------*/
.mf-ql { margin-top:-130px;width: 100%; padding-bottom: 3%;z-index: 99; position: relative;}
.mf-ql .ql {display: inline-block; width: 22%; text-align: center; vertical-align: middle;}
.mf-ql .ql #mack-img { background: url(/siteart/Cut-out-btn-hover/westernpeterbilt-types-mack.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql #mack-img:hover { background: url(/siteart/Cut-out-btn-hover/westernpeterbilt-types-mack-hover.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql #volvo-img { background: url(/siteart/Cut-out-btn-hover/westernpeterbilt-types-volvo.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql #volvo-img:hover { background: url(/siteart/Cut-out-btn-hover/westernpeterbilt-types-volvo-hover.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql #hino-img { background: url(/siteart/Cut-out-btn-hover/westernpeterbilt-types-hino.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql #hino-img:hover { background: url(/siteart/Cut-out-btn-hover/westernpeterbilt-types-hino-hover.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql #peterbilt-img { background: url(/siteart/Cut-out-btn-hover/peterbilt-cutout.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql #peterbilt-img:hover { background: url(/siteart/Cut-out-btn-hover/peterbilt-cutout-hover.png) no-repeat; background-position: center center; background-size: contain;  margin: 0 auto; height: 200px}
.mf-ql .ql h2 {font-size: 25px; letter-spacing: 2px; font-weight: 800; text-transform: uppercase;color:#000; font-style: normal; line-height: 30px;}
.mf-ql .ql h3 {font-size: 16px; letter-spacing: 2px; font-weight: 800; text-transform: uppercase;color:#000; font-style: italic; line-height: 22px;}
.new-btn, .used-btn {width: 100px; padding: 10px 0; text-align: center; display: inline-block;  vertical-align: middle;font-family: 'Roboto Condensed', sans-serif;  margin:10px auto; font-style: italic; font-weight: 800;} 
.new-btn {background: #00164d; color:#fff; transition: .3s ease;}
.new-btn:hover {background: #003464; color:#fff; transition: .3s ease; letter-spacing: 1px;}
.used-btn {background: #C22033; color:#fff; transition: .3s ease;}
.used-btn:hover {background: #ccc; color:#00164d; letter-spacing: 1px;}

.sub-ql {padding: 50px 0; border-top:1px solid #000;}
.col-5 {display: inline-block; vertical-align: middle; width: 30%; background:#00164d; padding: 20px 10px; margin: 1% .5%; transition: .3s ease; text-align: center; border-bottom: 3px solid #8c9da5}
.col-5 p {color:#fff; text-transform: uppercase; font-style: italic; letter-spacing: 1px; font-weight: 700; font-family: 'Roboto Condensed', sans-serif; font-size: 18px; line-height: 25px;}

.col-5:hover {background: #ddd;}
.col-5-1 {display: inline-block; vertical-align: middle; width: 30%; background:#C22033; padding: 20px 10px; margin: 1% .5%; transition: .3s ease; text-align: center; border-bottom: 3px solid #8c9da5}
.col-5-1 p {color:#00164d; text-transform: uppercase; font-style: italic; letter-spacing: 1px; font-weight: 700; font-family: 'Roboto Condensed', sans-serif; font-size: 18px; line-height: 25px;}

.col-5-1:hover {background: #ddd;}
/*------------------------------------*/

/*---SERVICE LANDING--------------------------------*/
.service-links {
	justify-content: space-between;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 20px;
}

.service-link {
    flex-basis: 24%;
	flex-grow: 1;
	padding: 30px;
	position: relative;
	
}

.part-link {
    flex-basis: 40% !important;
}

.link-1 {
	background: url("/siteart/home-img/location-img.jpg") no-repeat;
	background-size: cover;
	background-position: 25% 55%;
}

.link-2 {
	background: url("/siteart/home-img/parts-special-img.jpg") no-repeat;
	background-size: cover;
	background-position: 25% 55%;
}
.link-3 {
	background: url("/siteart/Locations/dobbs-tacoma-trp.jpg") no-repeat;
	background-size: cover;
	background-position: 25% 40%;
}
.link-4 {
	background: url("/siteart/bodyshop.jpg") no-repeat;
	background-size: cover;
	background-position: 25% 35%;
}

.plink1 {
	background: url("/siteart/parts-dept-hero.jpg") no-repeat;
	background-color:#000;
	background-size: cover;
	background-position: 25% 50%;
}

.plink2 {
	background: url("/siteart/home-img/leave-review-img.jpg") no-repeat;
	background-color:#000;
	background-size: cover;
	background-position: 25% 50%;
}
.plink3 {
	background: url("/siteart/home-img/career-img.jpg") no-repeat;
	background-color:#000;
	background-size: cover;
	background-position: 25% 80%;
}
.plink4 {
	background: url("/siteart/home-img/parts-img.jpg") no-repeat;
	background-color:#000;
	background-size: cover;
	background-position: 25% 60%;
}

.service-link .link-content {
    text-align: center;
}

.service-link .link-content {
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	position: absolute;
	color: #fff;
	z-index: 99 !important;
}

a.service-link {
	height: 200px !important;
}

a.service-link p {
	text-transform: none !important;
	margin-top: 15px;
	font-size: 16px;
}
a.link-1:hover:before,a.link-4:hover:before,a.plink1:hover:before,a.plink4:hover:before  {
	background: #A6A6A6;
}

a.link-1:before,a.link-4:before,a.plink1:before,a.plink4:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(166,166,166,0.65);
    transition: .6s all;
}

a.link-2:before,a.link-3:before,a.plink2:before,a.plink3:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(51,51,51,0.85);
    transition: .6s all;
}


a.link-2:hover:before,a.link-3:hover:before,a.plink2:hover:before,a.plink3:hover:before {
	background: #333;
}
/*---PARTS LANDING PAGE---*/

.parts-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 15px !important;
}

.parts-wrapper a div {
    max-width: 100% !important;
    margin: 0 !important;
    width: fit-content !important;
    width: 100% !important;
}
.parts-wrapper a {
    flex-grow: 1;flex-basis: 33%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}


.parts-bar {
    display: flex;
    gap: 8px;
}

.part-location h3 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    margin-bottom: 20px;
    font-size: 24px;
    line-height: 1;
}

.part-location {
    background: rgba(255,255,255,0.4);
    padding: 20px;
}

.parts-btn {
	    flex-grow: 1;
    padding: 10px;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
    font-style: italic;
    transition: .3s ease;
    text-align: center;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    font-size: 16px;
	background: #ddd;
	color: #000;
}

.parts-btn:hover {
	background: #fff;
	color: #000;
}

.parts-bar {
    display: flex;
    gap: 5px;
}

.flex-parts-request a {
    flex-basis: 22%;
    flex-grow: 1;
	cursor: pointer;
}

.flex-parts-request {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

button.location-buttons {
    font-family: 'Roboto Condensed', sans-serif;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0px;
    font-size: 16px;
    background: #fff;
	color: #000;
	width: 100%;
	padding: 10px;
	border: none;
	cursor: pointer;transition: .3s ease;
}

button.location-buttons:hover {
	background: #000;
	color: #fff;
}

.locationselect {
	color: #fff;
    background: rgba(255,255,255,0.40);
    
}

.locationselect:hover {
	color: #fff;
    background: rgba(255,255,255,0.40);
}

.review-page select#foo-3 {
    background: #f8f8f8;
    color: #000;
    border: 1px solid #eee;
    background-image: url("../siteart/Icons/chevron-down.svg");
	background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1em;box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
}

.review-page select#foo-3 option {
     font-size: 16px;
    display: block;
	line-height: 1 !important;
    background: #f8f8f8;
    color: #000;
    border: 1px solid #eee;
}
   
/*-----MANU LOGOS---------------------*/
.blk-bg {background: #000;}
.manu-logos {display: flex; flex-direction: row; padding: 25px 0; width: 100%; margin: 0 auto;}
.m-logo {align-items: center; justify-content: flex-start; width:20%; margin:1% 0;}





.red-btn {width:65%; float:right; margin:10px 0; font-size:18px; text-align: left; color:#fff; padding:10px 0; background:#C22033;font-family: 'Roboto Condensed', sans-serif; font-weight: bold; letter-spacing: 1px; font-style: italic; transition:.3s ease;}
.red-btn:hover {background:#8c9da5;}
.white {display: inline-block; color:#fff;}
#transparentline {background: rgba(255,255,255,.70); width:60%;  max-width:300px; height: 20px; text-align: center;margin:0 auto;margin-top:-15px; }

.blk-angle {background: #000; width: 100%; display: inline-block;}
.blk-angle .width-90 {margin: 0 auto;}
.gray1 {background:#212121; border:1px solid #212121}
.gray2 {background:#181818; border:1px solid #181818}
.gray3 {background:#131313; border:1px solid #131313}
.gray4 {background:#0e0e0e; border:1px solid #0e0e0e}
.gray1, .gray2, .gray3, .gray4 {display: inline-block; padding:20px 0; border-radius: 20px; font-size:20px; font-style: italic; font-weight: 700; color:#fff;margin: 0 15px; font-family: 'Roboto Condensed', sans-serif; margin-top:90px; width:22%; transition:.3s ease;}
.gray1:hover, .gray2:hover, .gray3:hover, .gray4:hover { border:1px solid #fff; transition:.3s ease;}
.red {color:#00164d; font-size:22px; font-style: italic;font-family: 'Roboto Condensed', sans-serif; font-weight: bold; display: inline-block;}
.lt {color:#fff; font-weight: 300; display: inline-block; font-family: 'Roboto Condensed', sans-serif;font-style: italic;}
.white {color:#fff;}
.road {background:url(../siteart/road.png) no-repeat; background-color:#000; background-position: center;height:350px; display: inline-block; width: 100%; text-align: center; background-size: cover; }
.ql {display: inline-block; width:16%; text-align: center; margin: 0 auto; margin-top:80px; }
.ql img {width:100%; height: 100%;}
.ql h2 {color:#fff; letter-spacing: 1px; font-style: italic; font-size: 20px;}
.ql-3 {display: inline-block; width:30%; text-align: center; margin: 0 auto;  margin:50px 1% }
.ql-3 img {width:100%; height: 100%;}
.ql-3 h2 {color:#fff; letter-spacing: 1px; font-style: italic; font-size: 20px;}
.space {height:100px; margin-top:0;display: inline-block;}
.flex-container {display: flex; flex-direction: row; background:#212121;width: 100%; align-items: center;}
.left-img {background:url(../siteart/volvo-blue.jpg) no-repeat; width:100%; max-width:870px;align-items: center; background-size: contain; padding:109px 40px;}
.left-img h4 {font-size:28px; line-height: 35px;  color:#fff; align-items: center; text-align: left; font-weight: 300;}
.left-img h1 {font-size:60px; line-height: 70px; font-style: italic; color:#fff; align-items: center; }
.right-text .width p {color:#fff; letter-spacing: 1px; text-align: justify}
.right-text {width: 140%;}
.search-bg {background:url(../siteart/metalplate.png); background-position: center; width: 100%; display: inline-block;}

.map {position: absolute; width: 35%; right:0; margin-top:-380px;}

.loc-stretch .landing-left a {
    color: #fff !important;
    font-size: 20px;
    font-weight: 800;
}

.map h3 {letter-spacing: 2px;}
.map h4 {padding: 10px 0; font-size: 16px; }
.map .red-btn { padding:10px 15px; top:0; margin:5px 0; width: 95%;}
.map .blk-btn { padding:10px 15px; top:0;margin:5px 0 }
.blk-btn {width:95%; float:right; margin:10px 0; font-size:18px; text-align: left; color:#fff; padding:10px 0; background:#000;font-family: 'Roboto Condensed', sans-serif; font-weight: bold; letter-spacing: 1px; font-style: italic; transition:.3s ease;}
.blk-btn:hover {background:#8c9da5;}
.blk-btn-long { width: 44%;  float:left; margin:5px 5px; font-size:18px; text-align: left; color:#fff; padding:10px 20px; background:#000;font-family: 'Roboto Condensed', sans-serif; font-weight: bold; letter-spacing: 1px; font-style: italic; transition:.3s ease;}
.blk-btn-long:hover {background:#8c9da5;}
.state-select {width: 100%; margin: 0 auto;background:#aaaaaa; float: right;}
.state-select select{background:#aaaaaa; width: 100%; box-sizing: border-box;padding: 10px; color:#fff; font-size: 18px; font-weight: bold; text-transform: uppercase; letter-spacing: 1px; font-style: italic;font-family: 'Roboto Condensed', sans-serif; margin: 0 auto;  border:0;
 display: block;
    appearance: none;
    background-image: url("/siteart/Icons/chevron-down-solid (1).svg");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1em;

}
.state-select select option {background: #000; font-style: normal; font-size: 15px; line-height: 22px;}
.state-select select option:hover {background: #ccc;}

.cta-btm {padding:50px 0;}
.cta-btm h2 { font-size:30px; font-style: italic; letter-spacing: 1px;}
.cta-btm h1 { font-size:38px; font-weight: 700; font-style: italic; letter-spacing: 1px; color:#00164d; line-height: 45px;}
.cta-btm p { padding:25px 0; text-align: justify;width:80%;}
.cta-left {width:60%; display: inline-block;}
.cta-right {width:38%; display: inline-block; vertical-align: middle;}
.cta-right img {width: 100%;}
.cta-btm .blk-btn {background:#000; display: inline-block; padding:8px 15px;color:#fff; font-style: italic; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; width:200px; float: left; text-align: center; transition:.3s ease;}
.cta-btm .blk-btn:hover {background:#ddd;}

#padding50 {padding:50px 0;}
#padding100 {padding:100px 0;}
.flex-container .left-site {flex:1; background:#212121;}
.flex-container .left-site p {padding:25px 0;}
.right-site {
        flex: 1;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.right-site img {
    object-position: center;
    flex-shrink: 0;
    min-width: 100%;
    min-height: 100%;
}
.dealerinfo {align-items: unset;}
.dealerinfo .left-site {display: flex;align-items: center;}
.dealerinfo .left-site .width {padding: 5% 0;}
.dealer-img img {object-fit: cover !important;
    height: 100% !important;
    width: 100% !important;}
.trp-txt {
	padding: 30px 0;
}

.red-btn-no-float {background:#C22033; padding:10px 25px; color:#fff; text-align: center;font-style: italic; font-weight: bold; float: none; font-size: 18px;letter-spacing: 1px; transition:.2s ease;display: inline-block;}
.red-btn-no-float:hover {background:#000;}

/*SHOWROOM*/
.border-top {border-top:1px solid #000;}
.model-wrapper {margin: 0 auto;  padding:60px 0; text-align: center;}
.model-wrapper h1{ padding:15px 0; text-align: left; font-style: italic;margin-bottom:15px; color:#00164d; border-bottom:1px solid #000; font-size:25px;}
.models {display: inline-block; width:16%; border-bottom:1px solid #fff; padding:15px 15px 20px 15px; margin: 5px 5px;transition:.2s ease; text-align: center;}
.models-2 {display: inline-block; width:20%; margin: 5px 5px;padding:25px 15px;transition:.2s ease; text-align: center;}
.models:hover {border-bottom:5px solid #fff; padding:15px 15px;}
.models img {width:100%;}
.models-2 img {width:100%;}
.models-2 h2 {letter-spacing: 1px; text-transform: uppercase; color:#000; font-style: italic; pading:15px 0; text-decoration: none}
.models h3 {letter-spacing: 1px; text-transform: uppercase; color:#fff; font-style: italic}
.white-btn {display: inline-block; background:#fff; text-align: center; color:#000; font-size:14px; padding:5px 10px; margin: 5px 0; transition:.2s ease;}
.white-btn:hover {background: #B9B9B9}

/* DEALER INFO*/
.col-3 h3 {color:#00164d; font-size: 18px;}
.col-3 {width: 30%; display: inline-block; vertical-align: top; margin:0 1.5%;}
.col-3 p {text-align: justify; font-size: 16px; line-height: 24px; font-weight: 500;}
.col-3 .blk-btn {background:#000; display: inline-block; padding:8px 15px;color:#fff; font-style: italic; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; width:200px; float: left; text-align: center; transition:.3s ease;}
.col-3 .blk-btn:hover {background:#ddd;}
.parts-4#mission {background: url(../siteart/mission.jpg) no-repeat; background-color:#000;  background-size: cover;display: inline-block; width: 50%; padding:80px 0; text-align: center; height: 145px;}
.parts-4#vision {background: url(../siteart/vision.jpg) no-repeat;  background-color:#000; background-size: cover; display: inline-block; width: 50%;  padding:80px 0; text-align: center; height: 145px;}

.loc-dealerinfo {background: rgba(240,240,240,1.00); padding: 25px 0;}
.dealer-2 {display: inline-block; vertical-align: top; padding: 100px 0; width: 45%; margin: 2% 2%; text-align: center;}
.dealer-2 h2 {text-transform: uppercase; letter-spacing: 1px; line-height: 30px; padding: 15px 0;}
.dealer-2 img {mtext-align: center; margin: 0 auto; padding: 15px 0;width: 100% !important;}
.dealer-2 p {min-height: 100px; padding: 15px 0;}
/* CAREERS */
.job-2 {margin: 0 auto; text-align: center; padding: 25px 0; display: inline-block; width: 100%;}
.team {display: inline-block; width: 30%; padding:15px 15px; border:1px solid #F5F5F5; margin:3px 0px;}
.team h3 {color:#00164d; font-style: italic;}
.values {display: inline-block; padding:5px 15px; color:#fff; border:1px solid #ddd; margin:5px 2px;font-family: 'Roboto Condensed', sans-serif; letter-spacing: .5px; }
.white-bg#careers p {font-family: 'Roboto Condensed', sans-serif; letter-spacing: .5px; }
h2#job-openings {padding:25px 0; border-bottom:1px solid #ddd; text-align: center; margin-bottom: 25px;}
.job-2 a .red-btn-no-float {margin: 5px 0;}

/* INVENTORY */ 
.inv-padding {height: 25px;}
.width-90 {width: 90%; margin: 0 auto;}
.sub-hero { max-height: 250px;
    overflow: hidden;
    border-bottom: 5px solid #fff;}
.sub-hero img {     width: 100%;
    min-height: 130px;
    object-fit: cover;
	filter: brightness(0.45);
    object-position: center;}
.inv-bg {background:#ddd;padding:2% 0; display: inline-block;}
.inv-bg h1 {color:#000; font-size:2em; font-style: italic; letter-spacing: 1px; padding:15px 0; text-transform: uppercase;}
.inv-bg h2 {color:#000; font-size:25px; font-style: italic; letter-spacing: 1px; padding:10px 0; text-transform: uppercase}
.inv-bg p {color:#000; letter-spacing: .5px;}
.inv-bg a {color:#000; font-weight: bold; }
.inv-bg a:hover {color:#ddd; font-weight: bold;}
.blk-bg {background:#000; width: 100%;display: inline-block;}

/*PARTS*/
.parts-bg {padding:25px 0; display: inline-block; width: 100%;}
.parts-bg h1 {border-bottom:1px solid #000; padding:25px 0; }
.parts-bg .width p {padding:25px 0; }
.parts-flex {margin-top:25px; background: #bbb;}
.parts-4 h2 {font-size:30px; line-height: 45px; color:#fff;}
.parts-4 p {width: 100%;font-family: 'Roboto Condensed', sans-serif; font-weight: 500; letter-spacing: 1px;font-size:16px; color:#fff;}
.parts-4 {float:left; vertical-align: top;  width:50%;}
#department {background: url(../siteart/Parts/parts-dept.jpg) no-repeat; background-size: cover; }


#parts-counter {background: url(../siteart/Parts/parts-counter.jpg) no-repeat; background-size: cover; }


#all-makes {background: url(../siteart/Parts/parts.jpg) no-repeat; background-size: cover; }


#service-request {
	background: url(../siteart/Service/service-img1.jpg) no-repeat;
    text-align: center;background-size: cover;
}

#service-specials {
	background: url(../siteart/Service/service-specials.jpg) no-repeat;
    text-align: center;background-size: cover;
}

#specials {background:#212121; display: inline-block;width: 50%;  padding:100px 0; text-align: center; }

#mechanics {
	background: url("../siteart/home-img/service-img.jpg") no-repeat;
 text-align: center;background-size: cover;
}


#service-request:hover:before,#service-specials:hover:before  {
	background: #A6A6A6;
}

#service-request:before,#service-specials:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(166,166,166,0.65);
    transition: .6s all;
}

#mechanics:before,#department:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0,22,77,0.60);
    transition: .6s all;
}


#mechanics:hover:before,#department:hover:before {
	background: #00164d;
}

.parts-bg .blk-btn {background:#000; display: inline-block; padding:8px 15px;color:#fff; font-style: italic; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; width:200px; float: left; text-align: center; transition:.3s ease;margin:0 10px;}
.parts-bg .blk-btn:hover {background:#ddd;} 
.gray-space {background:url(../siteart/pattern.png) repeat; height: 120px; margin-bottom:-52px; width: 100%;}
.img-bg { background: url(/siteart/road-bg.jpg) no-repeat; background-color:#000; background-size: cover; background-attachment: fixed; width: 100%; padding:50px 0; }
.white-bg {background: #fff;display: inline-block; width:100%; }
.white-bg-specials {background:#F0F0F0;display: inline-block; padding:25px 0; width:100%;  border-top:2px solid #212121;}
.white-bg h1 {color:#000; font-size:2em; font-style: italic; letter-spacing: 1px; padding:0 0 15px 0; text-transform: uppercase; border-bottom:1px solid #000;}
.white-bg p{padding:15px 0;}
.special {width:29%;  background:#fff;display: inline-block; vertical-align: top; text-align: left; margin: 3% 20px; }
.special img {width: 100%;box-shadow: 6px 6px 7px 1px rgba(128, 128, 128, 0.55) ; }
.red-btn-sml {display: inline-block; background: #00164d; padding:10px 0; width: 120px; text-align: center; color:#fff;font-family: 'Roboto Condensed', sans-serif;  margin:5px 5px;}
.border-line {width: 100%; height: 1px; background: #000;}




.trp {text-align: center; margin: 0 auto; width: 100%;}
.trp img { text-align: center; max-width: 300px; width: 100%; padding: 15px 0;}
.flex-stretch {display: flex; flex-direction: row; align-items: stretch}
.about-trp {background: url(/siteart/TRP/TRPServiceBay6.jpg); background-color:#000; margin: 1% 1%; background-size: cover; }
.about-trp h3 {color:#fff;  font-size: 24px;}

.trp-parts {background: url(/siteart/TRP/PB_Tech_NewBelt_RedTruck.jpg); background-color:#000; margin: 1% 1%; background-size: cover; }
.trp-parts h3 {color:#fff;  font-size: 24px;}

.trp-catalogue {background: url(/siteart/TRP/TRPBusService1.jpg); background-color:#000; margin: 1% 1%; background-size: cover; }
.trp-catalogue h3 {color:#fff;  font-size: 24px;}
.trp-arrow {color:#fff; font-size: 24px;}
.trp-arrow .fa-arrow-alt-circle-right{color:#8c9da5;  font-size: 30px; }


.about-trp,.trp-parts,.trp-catalogue {
	position:relative;
	flex: 1;
	padding: 10% 0;
	max-height: 400px;
}

.about-trp:hover:before,.trp-parts:hover:before,.trp-catalogue:hover:before  {
	background: #00164d;
}

.about-trp:before,.trp-parts:before,.trp-catalogue:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgb(0 0 0 / 30%);
    transition: .6s all;
}

span.overlay-txt {
   position: absolute;
    top: 65%;
    left: 10%;
    right: 0;
	width: 90%;
	display: flex;
	align-items: center;
	gap: 10px;
}

/*-FLEET SELECT--*/
.fleet-video {background-image: url("/siteart/fleetselect/videos-fleet.jpg"); background-repeat: no-repeat;background-color: #000;}
.fleet-catalog {background-image: url("/siteart/fleetselect/fleet-catalog.jpg"); background-repeat: no-repeat;background-color: #000;}
.fleet-info {background-image: url("/siteart/fleetselect/fleet-info.jpg"); background-repeat: no-repeat;background-color: #000;}

.grid-container.grid-videos {grid-template-columns: repeat(3, 1fr);}
.video h2 {font-size: 18px;text-align: center;text-transform: uppercase;margin-bottom: 5px;}
.flex-wrap.flex-bulletin {flex-wrap: wrap;text-align: center;gap:15px;}
a.bulletin {background: #eee;padding: 20px;flex-basis: 28% !important;border-radius: 3px;color: #333;border: 1px solid #e8e8e8;flex:1;transition:.4s ease;}
a.bulletin:hover {background: #333;color:#eee;border: 1px solid #111;}
a.bulletin p {padding: 0;transition:.4s ease;}
a.bulletin h2 {margin-bottom: 10px; font-size: 22px;transition:.4s ease;}
/*--------Search Inventory Styles--------*/
#searchparts {width:100%; padding:25px 0;}
#searchkeyword {width:100%; margin:10px auto;}

#searchinventory {text-align:left; padding:60px 10px; }

.searchfieldtopwrap {float:left; width:80%;}
.searchfieldtop {width:49%; float:left; margin-right:11px; background:#fff; padding:11px 0;}
.searchfieldwrap {float:left; width:65%; }

#searchparts .searchfield {background:#fff; padding:11px 8px; border:2px solid #fff; color: #fff; text-align:left;}
#searchform input.text {color:#00164d; padding:11px 10px; width:91%;}
#searchform select {color:#fff; padding:10px 10px; width:97%;}
.search-box{border:none;font-family: 'Montserrat', sans-serif; font-weight:300; text-transform:uppercase;}
#searchform input.button,
#searchform input.button:focus{
	background: #00164d; /* For browsers that do not support gradients */
	color:#fff; 
	text-transform:uppercase;
	text-decoration:none; 
	font-weight:700; 
	width:195px;
	font-size:14px;
	text-align:center;
	margin:0 auto;
    padding:15px 0;
    border: none;
    line-height:14px;
}
form input.text, form textarea, form .textajaxuniquetext, form select
#searchform input.button:hover {
	background: #fff; /* For browsers that do not support gradients */
	color:#000;
}
.radio{text-align:left; color: #7B1010;}
.closest-box {display:hidden;}

/* SERVICE */
.parts-4#service-request {background: url(../siteart/Service/service-img1.jpg) no-repeat; display: inline-block; width: 50%; padding:100px 0; text-align: center; }
.parts-4#service-request:hover {background:#9E9E9E;transition:.3s ease;}

.parts-4#service-specials {background: url(../siteart/Service/service-specials.jpg) no-repeat; display: inline-block; width: 50%; padding:100px 0; text-align: center; }
.parts-4#service-specials:hover {background:#363636;transition:.3s ease;}
.parts-4#mechanics {background: #212121; display: inline-block; width: 50%;  padding:100px 0; text-align: center; }
.parts-4#mechanics:hover {background: #333; display: inline-block; width: 50%;  padding:100px 0; text-align: center; }

.red-btn-fin {background:#00164d; padding: 10px 20px; text-align: center; color:#fff; display: inline-block;font-family: 'Roboto Condensed', sans-serif;  transition: .3s ease; margin:5px 0;}
.red-btn-fin:hover {background: #212121;}
/* FIND YOUR TRUCKS */
.gray-bg {height:200px; background:#212121; margin-top:-200px;width: 100%;z-index: 9;}
.lt-gray {padding:15px 0; background:#E4E4E4;margin: 0 auto; text-align: center;}
.col-2 {margin: 0 auto; text-align: center;}
.col-1-2 {display: inline-block; background:rgba(0,0,0,1.00); margin:25px 10px; transition:.3s ease; width:30%;}
.col-1-2 img {opacity:.8; width: 100%; }
.col-1-2:hover {background:rgba(118,0,1,1.00) }
.col-1-2 {color:#fff; font-size:22px;font-family: 'Roboto Condensed', sans-serif; font-style: italic; text-align: center;}
.col-1-2-text {padding:10px 0; color:#fff;}
.col-1-2 a {color:#fff;}
.ql {margin:50px 15px; transition: .2s ease;}
.ql img:hover {opacity:.6;transition: .2s ease;}

.refuse-bodies {width: 60%; margin: 0 auto; text-align: center; padding: 30px 0;}
.refuse-img img {display: inline-block; vertical-align: middle; }
.refuse-btn {max-width: 400px; width: 100%; text-align: center; background:#ddd; padding: 10px 0; font-style: italic; font-weight: 800; color:#000; margin: 0 auto;font-size:18px;font-family: 'Roboto Condensed', sans-serif; transition: .3s ease;}
.refuse-btn:hover {background: #00164d; color:#fff;}
/*LOCATIONS*/
h2.loc-title {letter-spacing: 2px; font-weight: 500; line-height: 35px; font-size: 25px; padding: 10px 0;}
.col-1-3 {display: inline-block; width:46%; margin: 5px 5px; border: 1px #F0F0F0 solid ; background: #fff;z-index: 9999;}
.col-1-3 h3{display: inline-block;}
.col-1-3 .blue-btn {background:#00164d; padding: 15px 0; color:#fff; text-align: center; width: 95%; font-weight: 800; }
.col-1-3 .blue-btn:hover {background:#212121; padding: 15px 0; color:#fff; text-align: center; width: 95%; font-weight: 800; }
.col-1-3 .fas { color:#00164d;display: inline-block;}
.col-left {width:47%; display: inline-block; padding:25px 0 125px 15px; background:#F0F0F0;  vertical-align: top;font-family: 'Roboto Condensed', sans-serif; height: 250px;}
.col-right {width:46%; display: inline-block; background:#fff; padding:10px 0px 0 15px; vertical-align: top; }
.col-right p {font-size:14px; color:#000; line-height: 20px;font-family: 'Roboto Condensed', sans-serif;}
.col-right p a{font-size:16px; color:#00164d; line-height: 22px; font-weight: bold;}
.contact-text {color:#fff;  position: absolute;margin-top:-200px; border-top:1px solid #fff;padding:25px 0;  width: 100%;background-color:transparent;}
.contact-text h2 {text-transform: uppercase; font-style: italic;padding:25px 0;}

.specials-container {text-align: center;background: #00164d;  padding: 25px 30px;}
.specials-container h3 {font-size: 28px; color:#fff; line-height: 35px;}
.specials-container h3 a {color:#ddd; padding: 0 5px;}
.specials-container h3 a:hover {color:#C22033}

.inv-bg2 { padding: 0 0; border-bottom: 1px solid #000;background: #333; margin-top:-7px;}
.flex-used {display: flex; flex-direction: row; align-items: center}
.width-90 {width: 90%; margin: 0 auto;}
.used-left {width: 50%;  }
.used-left h2 {color:#fff; padding-bottom: 10px;}
.used-left p {color:#fff;}
.used-right {width: 50%; background: #fff; margin: 0 auto; text-align: center;}
.used-right img {width: 90%; max-width: 550px; margin: 0 auto; text-align: center;}

/*----------TEXT US BANNER----------------------------*/
.text-us-banner {}
.text-us-banner h2 {text-transform: uppercase; color: #00164d; letter-spacing: 1px;font-size: 36px;line-height: 1.25;}
.text-us-banner h2 a {letter-spacing: none !important;}
.text-us-banner h3 {font-style: italic; text-transform: uppercase;margin-top: 10px; margin-bottom: 0px;color:#000;font-size: 24px !important;line-height: 1.25;}
.text-us-banner hr {border-color: #eee; max-width: 40px; display: block; margin: 10px 0;}

/*----------BLOG LANDING----------------------------*/
.flex-wrapper {
	display: flex;
}

.blog-container.flex-wrapper {
	justify-content: space-between;
	gap: 40px;
}

.blog-posts {
	flex: 3;
	flex-direction: column;gap: 30px;
}

.blog-post {
	background: #F5F5F5;
    padding: 1rem 1.5rem;
    gap: 30px;align-items: flex-start;
}

.blog-archive,.blog-img {
	flex: 1;
}

.blog-img img {
    max-width: 100%;
    width: 100%;
}

.blog-content {
    flex: 2;
}
.blog-content h2 {
	color: #C22033;
	padding: 5px 0;
}
.blog-content p {
    padding: 5px 0 !important;
    font-size: 15px !important;
	line-height: 22px;
}

p#blog-date {
    padding: 0 !important;
    font-weight: 500;
    opacity: 0.6;
}

.blog-content a:hover {
	text-decoration: underline;
	color: #C22033;
}

.blog-archive h3 {
    padding: 10px 0;
}

#small-text {
	font-size: 14px;
	opacity: .7;
	padding: 5px 0;
}

.blog-page {
	padding-top: 0 !important;
}
.blog-page h1 {
	padding-top: 0 !important;
    border-bottom: 0;
    padding: 0px 0;
}

img.blog-photo {
    max-width: 100%;
    width: 350px;
}

img.blog-photo-horizontal {
	    max-width: 100%;
    width: 100%;
	min-width:200px;
}
.single-post h1,.single-post h2 {
	    font-size: 28px;
	color:#C22033;text-transform: uppercase;
	line-height: 1.25;
}

.single-post p {
	padding: 12px 0 !important;
}



.archive-txt {
    font-size: 15px !important;
    line-height: 18px !important;
	    display: block;
    padding-bottom: 18px !important;
}
.blog-page .blog-container {
	    gap: 90px !important;
}

.blogs-pad {
		padding-top: 100px;
	} 

.blog-back a {
	color: #C22033;
}

.flex-wrapper.flex-blog {
    flex-wrap: wrap;
}

.multi-img {
    flex-grow: 1;
    flex-basis: 33%;
    display: inline-flex;
}

.multi-img img {
    max-width: 100%;
}

.mobile-only {
	display: none;
}

.embed-youtube {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
	margin: 0 0 20px 0;
}

.embed-youtube iframe,
.embed-youtube object,
.embed-youtube embed {
    border: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.collapsibleblog {
	background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 10px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
	transition: .3s all;
}
.collapsibleblog:hover {
	color:#C22033;
	background-color: #ccc;
}

.collapsibleblog h3 {
	padding: 0 !important;
}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.activeblog, .collapsibleblog:hover {
	color:#C22033 
}

/* Style the collapsibleblog content. Note: hidden by default */
.past-blogs {
   padding:0 10px;
	margin-top: 20px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.collapsibleblog:after {
  content: '+'; /* Unicode character for "plus" sign (+) */
      font-size: 32px;
  color: #C22033;
  float: right;
  margin-left: 5px;
}

.blog-archive .activeblog:after {
  content: "−"; /* Unicode character for "minus" sign (-) */
}

/* LOCATIONS LANDING */
.special-banner img {max-width: 100%;width: 100%;}
.mobile-banner {display:none;}
.location-landing .col-left {position: relative;}
.service-logo {position: absolute;
    top: 10px;
    right: 10px;}
.service-logo img {max-width: 100%;width: 55px;}

.loc-landing .landing-left {position: relative;}
.loc-landing .service-logo {
    position: absolute;
    top: 30px;
    right: 30px;
}

.loc-landing .service-logo img {
    width: 150px;
}

.location-landing h2.title {color: #000;font-size: 2em;font-style: italic;letter-spacing: 1px;padding: 0 0 15px 0;text-transform: uppercase;border-bottom: 1px solid #000;}

.blog-bread{max-width: 1280px !important;margin: 0 auto;}
.site-bread {background: #f1f1f1; padding: 15px 5%; width: 90%; font-weight: bold}
.loc-landing {box-shadow: 1px 1px 5px #ddd; width: 90%; margin: 2.5% auto;}
.loc-stretch {display: flex; flex-direction: row; align-items: stretch;}
.landing-left {width: 40%; background: #00164d}
.landing-left h1 {color:#fff; line-height:40px;}
.landing-left h2 {color:#ddd; padding-bottom: 15px; font-weight: 400}
.landing-left .socials {width: 100%; display: block; padding: 15px 0;}
.landing-left .socials .fab{font-size: 20px; letter-spacing: 2px; transition:.2s ease;}
.landing-left .socials .fab:hover{color:#fff;}
.landing-left .white-btn {padding: 15px 25px; text-align: center; display: inline-block; font-weight: 700; font-size: 16px; letter-spacing: 1px;}
.landing-left .gray-btn {padding: 15px 25px; text-align: center; display: inline-block; font-weight: 700; border:1px solid #fff; color:#fff; font-size: 16px}
.loc-services {background:#000C2A; }
.loc-services span {width: 48%; display: inline-block; vertical-align: middle; margin:3px 0;}
.loc-services .fa {color:#FFBF21}
.landing-right {width: 60%;background-size: cover; min-height: 500px}
.landing-right#rochester {background: url("/siteart/Locations/DP-Rochester.jpg");background-size: cover;background-position: center}
.landing-right#sumner {background: url("../siteart/Locations/DP-Sumner.jpg");background-size: cover;background-position: center}
.landing-right#spokane {background: url("../siteart/Locations/DP-Spokane.JPG");background-size: cover;background-position: center}
.landing-right#marysville {background: url("../siteart/locations/DP-Marysville.jpg");background-size: cover;background-position: center}
.landing-right#moses-lake {background: url("../siteart/locations/DP-Moses-Lake.jpg");background-size: cover;background-position: center}
.landing-right#seattle {background: url("../siteart/locations/DP-Seattle.jpg");background-size: cover;background-position: center}
.landing-right#tacoma {background: url("../siteart/locations/dobbs-tacoma-trp.jpg");background-size: cover;background-position: center}
.landing-right#yakima {background: url("../siteart/locations/DP-yakima.jpg");background-size: cover;background-position: center}
.landing-right#pasco {background: url("../siteart/locations/DP-pasco.jpg");background-size: cover;background-position: center}
.landing-right#portland {background: url("../siteart/locations/Portland-Paclease.JPG");background-size: cover;background-position: center}
.landing-right#redding {background: url("../siteart/locations/WTC-Redding.jpg");background-size: cover;background-position: center}
.landing-right#west-sac {background: url("../siteart/locations/DP-W.Sac.jpg");background-size: cover;background-position: center}
.landing-right#west-pac {background: url("../siteart/locations/West-Sac-Paclease.JPG");background-size: cover;    background-position: 50% 25%;}
.landing-right#jackson {background: url("../siteart/locations/DP-Jackson.jpg");background-size: cover;background-position: center}
.landing-right#jackson-trp {background: url("../siteart/locations/dobbs-jackson-trp.jpg");background-size: cover;background-position: 58% 38%;}
.landing-right#meridian {background: url("../siteart/locations/DP-meridian.jpg");background-size: cover;background-position: center}
.landing-right#monroe {background: url("../siteart/locations/DP-monroe.jpg");background-size: cover;background-position: center}
.landing-right#shreveport {background: url("../siteart/locations/DP-shreveport.jpg");background-size: cover;background-position: center}
.landing-right#little-rock {background: url("../siteart/locations/DP-little-Rock.jpg");background-size: cover;background-position: center}
.landing-right#west-memphis {background: url("../siteart/locations/DP-Memphis-used-truck.jpg");background-size: cover;background-position: center}
.landing-right#memphis {background: url("../siteart/locations/memphis-tn.jpg");background-size: cover;background-position: center}
.landing-right#jackson-tn {background: url("../siteart/locations/jackston-tn.jpg");background-size: cover;background-position: center}
.landing-right#WTC-sac {background: url("../siteart/locations/WTC-W-sac.jpg");background-size: cover;background-position: center}
.landing-right#san-leandro {background: url("../siteart/locations/WTC-san-leandro.jpg");background-size: cover;background-position: center}
.landing-right#stockton {background: url("../siteart/locations/WTC-stockton.jpg");background-size: cover;background-position: center}
.landing-right#turlock {background: url("../siteart/locations/WTC-turlock-outside.JPG");background-size: cover;background-position: center}
.landing-right#WTC-redding {background: url("../siteart/locations/WTC-redding.JPG");background-size: cover;background-position: center}
.yellow {color:#FFBF21}
.white {color:#fff;}
.landing-services {background: #fff;  width: 40%;}
.landing-services hr {height: 1px; background: #f1f1f1; border:0}
.landing-map {width: 60%;min-height: 350px !important;}

.flex-wrapper {
	display: flex;
	gap: 20px;
}

.trp-location {
	flex-basis: 46%;
}

.trp-location #Jackson-TN,.trp-location #Tacoma {
    width: 100% !important;
}

img.mail-banner  {
	max-width: 100%;
	width: 1080px;
}

button.review-btn {
    padding: 5px;
    margin-left: 10px;
    border: 1px solid #fff;
    background: #fff;
	cursor: pointer;
	color:#00164d;
	transition: .3s all;
}

button.review-btn:hover {
	color:#fff;
	background: transparent;
}

.button-wrap1 {
       display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 15px;
    margin-bottom: 5px;
}

.button-wrap1 a {
    flex: 1;
    /* border: 1px solid #fff; */
    /* width: 100%; */
    display: inherit;
    box-sizing: border-box;
}

.button-wrap1 div {
    width: 100% !important;
}


.formfield.message {
    flex-basis: 100%;
    width: 100%;
}

/*  SCROLLING INVENTORY
------------------------------------------------*/
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
 
.scrolling{
    width:100%;
    height:92px;
}
/*----------DETAILED SEARCH----------------------------*/
.img-bg #formpage div {color:#fff;}
.img-bg #formpage a {color:#fff;}
.detailed-search-wrap {
	padding: 30px 0;
	font-family: 'Roboto Condensed', sans-serif;
}

.content {
	width: 90%;
	margin: 0 auto;
}
.content h4 { color: #fff;	font-family: 'Roboto Condensed', sans-serif;
	font-style: italic;
	font-weight:700;
	letter-spacing:1px;font-size:25px;
	text-transform: uppercase;
}

.detailed-form {
	margin: auto;
}
.clear {
	clear: both;
}
.detailed-row {
	margin: 10px 0 5px;
	font-size: 18px;
}
.column3 {
	width: 33.33%;
	float: left;
	padding-right: 20px;
	box-sizing: border-box;
	margin-top: 5px;
}
.last {
	padding-right: 0px;
}
form input.text, form textarea, form .textajaxuniquetext, form select {
    width: 100%;
    max-width: 100%;
    padding: 10px 5px;
    font-size: 15px;
    background-color: none;
    color: #000;
    border-top: none;
    border-left: none;
    border-right: none;
}
.detailed-search input[type='submit'] {
	font-size: 16px;
	background: #00164d;
	width: 100%;
	margin-top: -25px;
	height: 40px;
	color: #fff;
	display: inline-block;
	border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	-webkit-border-radius: 0 !important;
	outline: none;
	border: none;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
	-webkit-border-radius: 0;
	-webkit-appearance: none;
	border-radius: 0;
	font-family: 'Roboto Condensed', sans-serif;
}
.detailed-search input[type='submit']:hover{
	background:#ddd;
	
}
.detailed-search input[type='text'] {
	width: 100%;
	margin: 2px 0;
	padding: 0 8px;
	font-size: 15px;
	height: 40px;
	background-color: #f9f9f9;
	border: 1px solid #bebebe;
	box-sizing: border-box;
	-webkit-border-radius: 0;
	border-radius: 0;
}
.detailed-search-wrap h3 span {
	color: #d7d7d7;
}


/*section {
  display: none;
  padding: 20px 0 0;
  border-top: 1px solid #ddd;
}*/

.detailed-search-wrap label {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 5px 0px !important;
  font-weight: 600;
  text-align: center;
  color: #bbb;
  border: 1px solid transparent;
}

.detailed-search-wrap label:before {
  font-family: fontawesome;
  font-weight: normal;
  margin-right: 10px;
}

/*label[for*='1']:before { content: '\f1cb'; }
label[for*='2']:before { content: '\f17d'; }
label[for*='3']:before { content: '\f16b'; }
label[for*='4']:before { content: '\f1a9'; }*/

.detailed-search-wrap label:hover {
  color: #888;
  cursor: pointer;
}

.detailed-search-wrap input:checked + label {
  color: #ddd;
	font-size:20px;
  border-bottom: 1px solid #fff;
}

#tab1:checked ~ #content1 {
  display: block;
}

@media screen and (max-width: 650px) {

  label:before {
    margin: 0;
    font-size: 18px;
  }
	
	
}

@media screen and (max-width: 400px) {
  label {
    padding: 15px;
  }
}

#slider-range {margin-top:10px !important;}
.searchfield h6 { color:#fff; display: inline-block;}
.noUi-pips-horizontal {padding:12px 0 !important; color:#fff;}
.noUi-marker.noUi-marker-horizontal {width:1px !important;}
.noUi-marker noUi-marker-horizontal noUi-marker-normal {left:20% !important;}
.label {margin-top:15px; float:left; width:33%; font-size:9px; color:#fff; letter-spacing: 1px;}
.labelmiddle {margin-top:15px; float:left; width:33%; text-align:center; font-size:9px; color:#fff; letter-spacing: 1px;}
.labellast {margin-top:15px; float:left; width:33%; text-align:right; font-size:9px; color:#fff; letter-spacing: 1px;}
.example-white { color:#fff; font-size:16px;}
.column3 .searchfield {width:90%; margin: 0 auto;}

/*--------FORM STYLES----------------------*/
.field {margin:6px;}
.field-half {float:left; width:calc(50% - 12px); margin:6px;}
.field-third {float:left; width:calc(33.33% - 12px); margin:6px;}


#formpage { vertical-align:top; margin: 0 auto;  text-align:center;display: flex; flex-wrap: wrap;gap:20px;}

#formpage div {
	vertical-align:top;
	padding:0;
	color: #000;	
	font-family: 'Roboto Condensed', sans-serif;
	font-size:16px; text-align:left;
}

#formpage input {
	padding:8px;
	border:1px solid #8e8d8d;
	font-size:16px;
	background:#fff;
	box-sizing:border-box;font-family: 'Roboto Condensed', sans-serif;
}

#formpage textarea {
	padding:8px;
	border:1px solid #8e8d8d;
	font-weight: normal;
	color:#000;
	font-size:16px;
	background:#fff;
	margin-top: 5px;
	box-sizing:border-box;font-family: 'Roboto Condensed', sans-serif;
}

/* selects have similar styles to input & textarea fields, but with no padding. Text in a dropdown select is positioned differently */
#formpage select {
	border:1px solid #8e8d8d;
	color:#202e3b;
	vertical-align:middle;
	font-size:16px;
	line-height:normal;
	padding:8px;
	width:100%;font-family: 'Roboto Condensed', sans-serif;
}

.formfield {
	flex-basis: 30%;
	flex-grow: 1;
	display:inline-block; 
	color: #000;
	text-align:left;
	font-family: 'Roboto Condensed', sans-serif;
	
}

.CaptchaPanel div {
   padding: 0 !important;
    margin: 8px 0 !important;
}




.CaptchaAnswerPanel {
    padding: 0 !important;
}

#captcha {
	flex-basis: 100%;
	min-width: 220px;
	text-align: center !important;
}

#blue-outline {
	flex-basis: 100%;
}

#formpage h2 {
    flex-basis: 100%;
}

#formpage input  {
    width:100%;
	box-sizing: border-box;
}
 
#formpage input.larger  {
    width:100%;
}

#formpage textarea {
    flex-basis: 100%;
    height:85px;
	font-family: 'Roboto Condensed', sans-serif;}

#formpage input.radio {
    padding:0; 
    border:0;
    margin:0 5px 0 0;
    width:15px;
    height:15px;
    display:inline;
	
 }

/* focus states of various types of fields */
#formpage a {color:#000; font-style: italic; font-weight: bold; letter-spacing: 1px;}
#formpage a:hover {color:#000; font-style: italic; font-weight: bold; letter-spacing: 1px; text-decoration: underline}
#formpage input:focus,
#formpage textarea:focus,
#formpage select:focus {
	background:#F4F4F4; 
	color:#000;
	border:1px solid #abacac;
	outline-style:none;
}
#formpage input.radio:focus,
#formpage input.checkbox:focus {
	background:none; 
	border:0;
	outline-style:none;
}

#formpage input.button,
#formpage input.button:focus {
    color: #fff !important;
    background: #00164d !important;
    font-family: 'Roboto Condensed', sans-serif !important;
    font-weight: bold !important;
    letter-spacing: 1px !important;
    font-style: italic !important;
    transition: .3s ease !important;
    text-align: center !important;
    text-transform: uppercase !important;
    border: 1px solid #00164d !important;
    cursor: pointer !important;
    font-size: 16px !important;
    padding: 10px 0 !important;
	max-width: 100%;
	width: 350px;
}
#formpage input.button:hover {
	background: #000 !important;
	border: 1px solid #000 !important;
}

/* for plain text next to an input field, if not using a table structure */
#formpage label{
	color:#212121;
    font-size:16px;
    text-align:left;font-weight: 400;
	font-family: 'Roboto Condensed', sans-serif;
	
}
#formpage label.basic {
    color:#212121;
    font-size:13px;
    text-align:left;
	padding:10px 10px;
} 

a#red-border-button {
    flex-basis: 100%;
}

.light-grey {
    padding-bottom: 100px;
}

.light-grey h2 {
    font-size: 36px;
    text-transform: uppercase;
	line-height: 1;
}

h3.loc-title {
    font-size: 22px;
    margin: 10px 0;
}

.site-header-push {
    height: 140px;
    background: #222;
	border-bottom: 5px solid #fff;
}
/*
.white-bg a.button {width:350px; font-weight:bold; text-transform:uppercase; color:#fff; height:28px; line-height:28px; display:block; text-align:center; padding:0 0; float:left; background:#404040;margin:5px 0 10px;display:block!important;font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; font-style: italic;}
.white-bg a.button:hover {background-position:bottom; text-decoration:none; color:#fff; background:linear-gradient(#0f3c6c, #0F2F5B);}
.white-bg input[type="submit" i]{background: #00164D; padding: 10px 0; width: 350px; text-align: center; font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; font-style: italic; color:#fff;font-size: 18px; font-weight: 700; transition: .3s ease;}
.white-bg input[type="submit" i]:hover{background: #333;}
*/

/*control the CaDobbs Peterbiltha */

.CaDobbs PeterbilthaPanel {margin:0 auto !important;padding:0 0 0 0 !important;line-height:normal !important;color:#000;width: 70%; text-align:center;}

.CaDobbs PeterbilthaImagePanel {
text-align: center	;
margin-top: 10px;
padding:0 0 0 0;
}

.CaDobbs PeterbilthaMessagePanel {
padding:0 0 0 0 !important;
margin:0 0 0 0 !important;
font-weight:normal !important;
font-size:12px;
line-height:14px;
text-align: center !important;
}

.CaDobbs PeterbilthaAnswerPanel {
margin:0 0 0 0;
padding:2px 0px 2px 0px !important;
}

.CaDobbs PeterbilthaWhatsThisPanel {
	line-height:0;
	margin:0 0 10px 0;
	padding:10px 0 10px 0 !important;text-align: center !important;
}
.CaDobbs PeterbilthaWhatsThisPanel a {color:#000;}
.CaDobbs PeterbilthaWhatsThisPanel a:hover {text-decoration:none;} 

.CaDobbs PeterbilthaImagePanel {text-align: center !important; margin: 0 auto !important;}

.CaptchaWhatsThisPanel a {color:#000!important; font-size:12px;}
.CaptchaMessagePanel {font-weight:normal!important; font-size:12px;}
.CaptchaAnswerPanel { border:1px solid #ccc; background:#fff; color:#000 !important; text-align:left;}
.CaptchaPanel {max-width:350px;width: 100%; text-align:left!important; display:block!important; padding:0!important;}
.CaptchaImage {text-align:left!important; display:block!important; width:60%;}

#formpage .check-container {display: inline-block; text-align: left; margin: 0;}
#formpage .check-container input[type="checkbox"]{display: inline-block; width:20px !important;}
	
.CaptchaPanel,.CaptchaMessagePanel,.CaptchaWhatsThisPanel {
	margin: 0 auto !important;
	text-align: center!important;
}
.CaptchaImagePanel img {
	margin: 0 auto !important;
	
}

input#CaptchaAnswer {
	border: none !important;
}
/*-------- FOOTER STYLES ----------------*/
.col-4 {width:13%; display: inline-block; vertical-align: top; color:#fff;	font-family: 'Roboto Condensed', sans-serif;}
.col-4 h5 {font-size:17px; font-style: italic; letter-spacing: 1px; font-weight: bold;}
.col-4 a {color:#fff; letter-spacing: .5px;}
.col-4 a:hover {color:#ddd; }
.corp-address {display: inline-block; flex:1; vertical-align: middle;}
.corp-address h4 {color:#fff;font-size:17px; font-style: italic; letter-spacing: 1px; font-weight: bold;}
.corp-address p {color:#fff;	font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase;}
.corp-address a:hover {color:#fff;}
.copyright p {display: inline-block; font-weight: 400; letter-spacing: 1px; font-size: 14px;font-family: 'Roboto Condensed', sans-serif;}
.copyright .socials a{color:#8c9da5; display: inline-block; font-size:25px;}
.copyright .socials a:hover{color:#212121; display: inline-block; font-size:25px;}
.copyright .socials { display: inline-block; vertical-align: middle; margin-left:25px;}

.copyright {padding: 12px 0;width: 90%; margin: 0 auto;}

footer .width-90 {
	display: flex;
    justify-content: space-between;
	flex-wrap: wrap;
	padding: 0;
}

footer .blk-angle {
	padding: 25px 0;
}
footer .col-4 {
	flex: 1;
}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/


.hosted-content .listings-wrapper .listings-list .category-banner h3 {font-size:16px !important;}
.hosted-content #main-search{display: none!important;} 



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


@media only screen and (max-width: 1600px) {
	.width {width: 85%;}
	.special {width:29%;}
	.mf-ql .ql {width:21%;}
	.right-text {width: 100%}
	.col-5 p {font-size: 16px;}
}
@media only screen and (max-width: 1400px) {
	.header-right-opacity {width: 78%;}
	#logo {width: 20%;}
	video#bgvid {
	  object-fit: contain;
	  width: 100%;
	  height:auto;
	}
	
	.blog-archive {flex: 0.75;
}

	.gray1, .gray2, .gray3, .gray4 {font-size:17px;}
	.road {height: 380px;}
	.col-left {width:46%;}
	.col-right {width:46%;}
	.col-1-3 h3 {font-size:18px;}
	.formfield {width: 47%;}
	.parts-4#department, .parts-4#parts-counter,.parts-4#all-makes,	.parts-4#specials {height: 80px;}
	.parts-4#service-request, .parts-4#service-specials, .parts-4#mechanics {height: 80px;}
	.col-3 .blk-btn {width:90%; margin:15px 0;}
	.left-img {padding: 70px 40px;}
	.mf-ql .ql {width:46%;}
	

}
@media only screen and (max-width: 1300px) {
	.hero-text {width:100%}
	.blk-angle {background:#000;display: inline-block; margin: 0 auto; padding:25px 0;}
	.gray1, .gray2, .gray3, .gray4 {width:47%; margin:7px 5px; }
	.ql {vertical-align: top;}
	.ql-h2 {font-size: 18px;}
	.width {width: 90%;}
	.col-4 {width:15%;}
	.corp-address {width:20%;}
	.white-btn {width: 100%;}
	.gray-bg {height:250px; margin-top:-250px;}
	h1, .heading {font-size:25px;}
	h2, .subheading {font-size:22px;}
.heading-xl {font-size: 36px; }
	p {    font-size: 16px;
    line-height: 1.5;}
	.map {width: 38%;}
	.specials {width: 27%;}
	.models {width: 14%;}
	.col-5, .col-5-1 {width: 29%;}
    .landing-left, .landing-services, .landing-right, .landing-map {width: 50%;}
    .landing-left .white-btn {width: auto;}
	
	.parts-bar {
    flex-wrap: wrap;
    margin-bottom: 10px;
}
	.parts-btn {
    flex-basis: 19%;
}
	.cta-wrap {
		top: 50%;
	}
	button.career-option{font-size: 16px;}
}
@media only screen and (max-width: 1200px) {
	.blog-post {
		gap:20px;
	}

	.blog-content h2 {
    font-size: 18px;
}
	.blog-archive {
    flex: 1;
}
	.blog-page .blog-container {
    gap: 60px !important;
}
	.flexer{align-items: self-start;}
		a.service-link,.emp-testimony {
		flex-basis: 100%;
	}
	.emp-img {
    max-width: 200px;
}
	
	.flex-testimony {flex-wrap:wrap;gap:20px;}
	
}

@media only screen and (max-width: 1150px) {
	.half-pg h2, .career-pg h2 {font-size: 22px;}
	.career-tab h3,	.technician-section h4{font-size: 22px;}
	button.career-option{font-size: 15px;padding: 15px}
	.header-container {background: #fff;}
	.mailing-title {width: 40%;}
	.mailing-title h1 {font-size: 20px;}
	.mailing-btn {width: 33%;}
	.hero-slider .slider {margin-top:0;}
	.hero-slider .slide{max-height: none; overflow: inherit;}
	.hero-slider .slide .slide-link{position: relative; background: #333; max-width: 100%; top: 0; border-bottom: 1px #ccc solid; padding: 15px 25px; clear:both; right: auto;}
	.hero-slider .slide .link-text{float: left; width: calc(100% - 300px); padding-right: 15px; box-sizing: border-box;}
	.hero-slider .slide .slide-link .link-text h2{font-size: 16px; text-transform: uppercase; margin: 8px 0; color: #fff;}
	.hero-slider .slide .slide-link .link-text p{display: none;}
	.hero-slider .slide .button-link a{float: left; width: 300px; margin: 0; padding: 10px;}
	.hero-slider .slide .slide-link-2{position: relative; background: #333; max-width: 100%; top: 0; border-bottom: 1px #ccc solid; padding: 15px 25px; clear:both;  right: 0;}
	.hero-slider .slide .link-text-2{float: left; width: calc(100% - 120px); padding-right: 15px; box-sizing: border-box; text-align: center;}
	.hero-slider .slide .slide-link-2 .link-text-2 h2{font-size: 16px; text-transform: uppercase; margin: 8px 0; color: #fff; text-align: left;}
	.hero-slider .slide .slide-link-2 .link-text-2 p{display: none;}
	.hero-slider .slide .button-link-2 a{float: right; width: 120px; margin: 0; padding: 10px;}
	.manu-logos {display: block; margin: 0 auto; text-align: center;}
	.m-logo {width: 15%; display: inline-block}
	.m-logo img {width: 100%}
	.flex-container {display: block;width: 100%;}
	.left-img {padding:25px 0; max-width: 1150px; background-size: cover; background-position: center center;} 
	.right-text {padding:35px 0;} 
	.right-text p {font-size: 14px;} 
	.col-4 {padding: 10px 0;}
	.corp-address {flex-basis: 100%; text-align: center; padding: 15px 0; border-top:1px solid #ddd; margin-top:15px;}
	.special-left {width: 30%; padding: 20px 0; text-align: center}
	.special-left h1{text-align: center}
	.special-right {width: 70%;padding: 20px 0; text-align: center}
	.flex-used {display: block; margin-top:40px; padding-top:15px;}
	.used-left {width: 100%; padding: 10px 0;}
	.used-right {width: 100%; margin-top:10px;}
	.blog-img {flex: 1.5;}
	.fleet-img {height: 300px;}
	.blog-content p {
		font-size: 14px !important;
	}
	
	.flex-container .right-site {display: none;}
	.flex-container .left-site {width: 100%; padding:50px 0;}
	.trp-txt {
		text-align: center;
	}
	
	.grid-cta {
		padding: clamp(90px, 5%, 100px);
	}
	
	.grid-container {
    grid-template-columns: repeat(2, 1fr);
	}
	
	.cta-wrap {
		position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
	}
}
@media only screen and (max-width: 1100px) {
	.main-model {
		flex-wrap: wrap;
	}
	
	.model-slide,.model-info {
    flex-basis: 100%;
}
	
	.model-info {
		margin-right: 0!important;
	}
	
	.model-info-right {
		margin-left: 0 !important;
	}
	
	.model-txt {
		padding: 50px 0;
		box-shadow: none;
	}
	
	.model-wrap {
		width: 90%;
		margin: 0 auto;
	}
	
	.model-info-right .model-title {
		justify-content: flex-start;
	}
	
	.model-info-right .model-title h3 {
		text-align: left;
	}
	
	.battle-motors h3 {
    flex: 1;
	}
	
	.volvo-model .main-model,.battle-motors .main-model {
    flex-wrap: wrap-reverse;
}
	.button-wrapper {
		flex-wrap: wrap;
	}
	
	.button-wrapper a {
    flex-basis: 48%;
}
	
	.button-wrapper a div {
		max-width: 100% !important;
	}
	
}


@media only screen and (max-width: 1080px) {
	#logo {margin-left:10px;}
	.special {width:44%;}
	.career-bar {flex-wrap:wrap;}
	.career-bar button {flex-basis: 45%;flex-grow: 1;}
	nav.top-links ul li a {font-size: 15px !important;padding: 10px 5px;}
	button.career-option{border: 1px solid #eee;}
}
@media only screen and (max-width: 1050px) {
	.logo {width:50%; text-align: center; marign: 0 auto;}
	.header-right-opacity {transform: none;}	
	.header-right {width: 100%;}
	.header-container {position: relative;}
	.top {transform: none; display: inline-block;text-align: center; margin: 0 auto; margin-right:0;}
	.top ul li a {display: none;}

		.service-logo img {width: 120px;}
	.ql {width:28%;}
	.ql img {width: 100%; height: auto;}
	h2.loc-title {text-align: center;}
	.col-1-3 {width:100%;}
	.col-left {width: 98.5%; padding-bottom: 0px;}
	.formfield {flex-basis: 46%;}
	.col-4 {width:24%;font-size:14px;}
	.column3 {width: 100%;}
	.last {
		padding-right: 20px;
	}
	.flex-used {margin-top:0;}

	.inv-bg p {font-size:14px; line-height: 20px;}
	.col-1-2-text {font-size:16px;}
	.red {font-size:16px;}
	.blk-angle .width-90 {height: auto;}
	.gray1, .gray2, .gray3, .gray4 {width: 100%;margin: 0 auto;}
	.blk-angle {display: block;}
	.model-wrapper {text-align: center;}
	.gray-bg {display: none;}
	.models {width:28%;}
	.models h3{color:#000;}
	.models .white-btn {background:#000; color:#fff;}
	
	
	.models-2 {width: 38%;}
	.parts-4#department, .parts-4#parts-counter,.parts-4#all-makes,	.parts-4#specials {height: 80px;}
	.parts-4#service-request, .parts-4#service-specials, .parts-4#mechanics {height: 80px;}
	.parts-4#mission {height: auto; padding:50px 0; width: 100%;}
	.parts-4#vision {height: auto; padding:50px 0; width: 100%;}
	.parts-4 h2 {font-size:20px;}
	.parts-4 p {font-size:15px;}
	.team {width:45%;}
	.blk-btn {font-size: 14px; }
	.blk-btn-long {font-size: 14px; width: 100%; padding: 10px 0; text-align: center;}

	
    
	.blog-container.flex-wrapper {flex-wrap: wrap;}
	.blog-posts,.blog-archive {
    flex-basis: 100%;
	}
	
	.blog-page .blog-container {
    gap:40px !important;
}
		.blogs-pad {
		padding-top: 0;
	}
	
		.flex-wrapper {
	flex-wrap: wrap;
	}

	.trp-location {
	flex-basis: 100%;
	}
	
	.flex-career {flex-wrap:wrap; gap: 30px;text-align: center !important;}
	.flex-career.reverse-wrap {flex-wrap:wrap-reverse;padding-bottom: 0 !important;}
	.half-pg {flex-basis: 100%;}
	
}
@media only screen and (max-width: 984px) {
	.header-right-opacity {width: 20%;}
	#logo {width: 70%;}
	.hero {padding:50px 0;}

	video#bgvid {
	  object-fit: contain;
	  width: 100%;
	  height:auto;
	}
	
	.hero-text h1 {
    font-size: 52px;
	}
	
	span.small-hero {
		    font-size: 24px;
	}
	
	.map {width: 90%; position: relative;margin-top:0; margin: 0 auto; padding: 15px 0;}
	.map .red-btn {width: 100%; text-align: center;padding:7px 0;margin:3px 0;}
	.map .blk-btn {width: 100%; text-align: center;padding:7px 0;margin:3px 0;}
	.ql {width:26%; margin:15px 1%;}	
	.ql-3 {width:100%; margin:15px 0;}
	.parts-4#department, .parts-4#parts-counter,.parts-4#all-makes,	.parts-4#specials {padding:50px 0;height: 150px;}
	.parts-4#service-request, .parts-4#service-specials, .parts-4#mechanics {padding:50px 0;height: 150px;}

	.searchfieldwrap {width: 100%;}
	.col-3 {width:100%; margin:25px 0; border-bottom:1px solid #ddd; text-align: center;}
	.col-3 .blk-btn {width:100%; margin:15px 0; background:#ddd; padding:10px 0;}
	.col-3 .blk-btn:hover {width:100%; margin:15px 0; background:#000; padding:10px 0;}
	.dealer-2 {width: 100%; margin: 2% 0; padding: 0;}
	.white-bg h1 {font-size: 18px; line-height: 24px;}
    .loc-stretch {flex-wrap: wrap;}
    .landing-left, .landing-services, .landing-right, .landing-map {width: 100%; margin: 0 auto;}
    .landing-left .white-btn {width: 100%; margin: 3px auto; padding: 15px 0;}
    .landing-left .gray-btn {width: 100%; margin: 3px auto; padding: 15px 0;}
    .loc-services span {width: 100%;}
		.parts-btn {
    flex-basis: 28%;
}
	.flex-parts-request a {
    flex-basis: 34%;
	}
	
}

@media only screen and (max-width: 968px) {
.road {height: 100%; margin:0; padding:25px 0;}
.contact-text {margin-top:0; background:#212121; color:#fff; padding:40px 0;position:relative; margin-top:0;}
	.contact-text h2 {
		padding: 0 0 10px 0;
	}
	
	.flex-stretch {
		flex-wrap:wrap;
	}
	.parts-wrapper a {flex-basis: 100%;}
	.about-trp, .trp-parts, .trp-catalogue {
		flex-basis: 100%;
		padding:0;
		min-height: 150px;
		background-position: center;
	}
	
	span.overlay-txt {
		    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
		bottom: none;
	}
	.site-header-push {
    height: 65px;
	}
	
		.social-icons {
		order: -1;
	}
	
	header#fixed-head {
		box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	}

	.sub-hero {
		padding-top: 7%;
	}

}

@media screen and (max-width: 847px) {
	a.h-links.work-link, a.h-links.location-link, .short-link, a.bottom-link.repair-link {
		flex-basis: 40%;
    flex-grow: 1;
	}
	
	.h-links {
		height: 150px !important;
	}
	
	.short-link {
    display: flex;
    flex-direction: row;
    gap: 15px;
    flex-basis: 60% !important;
		flex-grow: 1;
}
	
	.specials-link .link-content, .fin-link .link-content, .review-link .link-content {
		position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    z-index: 99999;
    height: auto !important;
		top: unset !important;
	}

	a.bottom-link.repair-link.h-links {
    flex-basis: 30%;flex-grow: 1;
}
	.short-link .h-links {
		height: 150px !important;
	}
	
	.bottom-long-link.specials-link {
    flex-basis: 100%;
    color: #fff;
}
	
	.cat-boxes {gap: 20px;flex-wrap: wrap;
	}
	
	a.cat {
		flex-basis: 40%;
	}
	
	.cat-content {
		gap: 10px;
	}
	
	.cat-content img {
		width: 90px;
	}
	
	.flex-refuse {
		flex-wrap: wrap;
		gap: 50px;
	} 
	
	.left-body, .right-body{
		flex-basis: 100%;
	}
	.slick-track,.hero-slider {
    height: 450px !important;
}
	.width.flex-button {width: 100%;flex-wrap:wrap;}
}


@media only screen and (max-width: 833px) {
	.desktop-only {
		display: none;
	}
	
	.mobile-only {
		display: flex;
	}
	
}


@media only screen and (max-width: 767px) {
	#logo {width: 100%;margin:0 auto; float: none; text-align: center;padding: 5px 0;}
	#logo img {max-width: 250px; text-align: center; margin: 0 auto;}
	.header-right {float: none;text-align: center; margin: 0 auto;padding: 5px 0;}
	.header-right-opacity {width: 100%;}
	.formfield {flex-basis: 100%;}
	.col-4 {flex-basis: 38% !important; margin-top:0; height: auto;	}
	.col-1-2 img{display: none;}
	.col-1-2 {width: 100%; margin:5px 0; line-height: 22px; padding:5px 0;font-size:18px;}
	.col-1-2 br {display: none;}
	.col-left {width: 98%; }
	.flex-container .left-site {width: 100%; padding:50px 0;}
	.flex-container .left-site h1 {margin-top:25px;}
	.cta-left {width: 100%;}
	.ql {width:29%;}
	.text-us-banner h2 {font-size: 28px;}
	.text-us-banner h3 {font-size: 18px;}
	.cta-right img {display: none;}
	.parts-4#department, .parts-4#parts-counter,.parts-4#all-makes,	.parts-4#specials {width: 100%; height: auto; padding:50px 0; }
	.parts-4#service-request, .parts-4#service-specials, .parts-4#mechanics {width: 100%; height: auto; padding:50px 0;}
	.team {width:95%; margin:3px 0;}
	.img-bg {background-attachment: inherit}
	.special {width:100%;margin:15px 0;}
	
	.container-bnr {display: none;}
	.mailing-list-mobile {display: block;}
	.hero-slider .slide .link-text {width: 100%; text-align: center; padding: 10px 0;}
	.hero-slider .slide .button-link a {max-width: 600px; width: 100%;}
	.m-logo {width: 26%; display: inline-block}
	.m-logo img {width: 100%}
	.col-5 {width: 98%; margin: 1% 0;}
	.col-5-1 {width: 98%; margin: 1% 0;}
	
	.specials-container {display: block;}
	.special-left, .special-right {width: 100%;}
	.special-right {background: #333;}
	.special-right h3, .special-right p {color:#fff;}
	.special-right h3 a {color:#ddd;}
	.inv-bg p {padding: 20px 0;}
	.inv-bg {margin-bottom: 20px;}

	.field, .field-half, .field-third, form h3 {width:95%;}
	textarea {width: 97.5%;}

	.location-wrap{gap: 30px;}
	.landing-right {display: none;}
	.career-img {
		display:none;
	}
	.career-wrap {
		gap: 0 !important;
	}
	.half-page {
    flex-basis: 100%;
}
	
	.model-title h3 {
		font-size: 28px;
	}
	
	.model-bar {flex-wrap:wrap;}
	.electric-btn {flex-basis: 45%; flex-grow:1;}
	
	 .flexer{flex-wrap:wrap;}r
	.flex-testimony{flex-basis: 100%;}
	.emp-testimony {flex: 2 !important;}
	    .emp-img { max-width: 150px;}
	
}

@media only screen and (max-width: 720px) {
	.blog-post {
		flex-direction: column;
		padding: .5rem;
	}
	.blog-post {
    gap: 0;
}
	.blog-content {
		padding: 10px;
	}
	
	.multi-img {
		flex-basis: 45%;
	}
	
	.single-post iframe {
		width: 100%;
	}
}

@media only screen and (max-width: 700px) {
	
	.specials-link .link-content {
		flex-wrap: wrap;
		gap: 10px;
	}
	.single-post h1 {font-size: 22px }
	.h-links,.specials-link,.short-link .h-links {
    height: 100px !important;
}
	
	.bottom-long-link.specials-link h2, .link-content h2 {
    font-size: 24px;
    text-transform: uppercase;
    line-height: 26px;
}
	
	.bottom-long-link.specials-link,a.bottom-link.repair-link {
    flex-basis: 48% !important;
    color: #fff;
}
	
	.short-link,.link-content span {
		flex-basis: 100% !important;
	}
	
	.h-links {
    padding: 30px 0;
}
	
	.link-content .red-buttons{
		font-size: 16px !important;
	}
	
	.hero-slider .slider {
		min-height:400px;
		
	}
	.slide {
		min-height: 400px;
    height: 100% !important;
    justify-content: center !important;
    align-items: center !important;
    overflow: hidden !important
	}
	.hero-slider .slide img {
     flex-shrink: 0 !important;
    min-width: 100% !important; 
    min-height: 100% !important
}
	.hero-text h1 {
    font-size: 40px;
}
	.mobile-banner {display:block;}
	.desktop-banner{display:none;}
}

@media only screen and (max-width: 649px) {
	a.service-link.link-3 {
    order: 3;
}
	
	a.service-link.plink3 {
    order: 3;
}

	.grid-container {
    grid-template-columns: repeat(1, 1fr);
	}
}


@media screen and (max-width: 600px) {

	.button-wrap1 {
		flex-wrap:wrap;
	}
	
	.button-wrap1 a {
		flex-basis: 100%;
	}
			.parts-btn {
    flex-basis: 100%;
}
	.flex-parts-request a {
    flex-basis: 100%;
	}
	
	
}


@media only screen and (max-width: 590px) {
.logo,.career-bar button {
		flex-basis: 100%;
	}
.site-header-push {
    height: 120px;
}
	
	.right-side {
		justify-content: space-between !important;
	}
	
	.main-header {
		flex-wrap: wrap;
	}
	
	.hero-home {
		margin-top: 25%;
	}
	
	.sub-hero {
    padding-top: 27%;
}
	

	
	.last-test .emp-img {
		order: -1;
	}
	.hero-slider {
		margin-top: 115px
	}
	
	.hero-text h1 {
    font-size: 34px;
}
	
	.electric-btn {font-size: 18px;}
	
	.loc-landing .service-logo {position: unset;text-align: center;background: #000C2A;padding: 10px 0;}
	.text-us-banner h2 a {display: block;}
}


@media only screen and (max-width: 500px) {
	#logo {width: 100%;margin:0 auto; float: none; text-align: center;padding: 5px 0;}
	
	.single-post h1 {font-size: 18px }
	#logo img {max-width: 250px; text-align: center; margin: 0 auto;}
	.header-right {float: none;text-align: center; margin: 0 auto;padding: 5px 0;}
	.top {width: 100%;}
	.top .socials {float: none; margin: 0 auto;}
	.hero {background-attachment: inherit}
	.header-right-opacity {width: 100%; text-align: center; margin: 0 auto;}
	.mf-ql .ql {width: 100%}
	.col-1-3 {margin: 0 auto;}
	.col-left {width: 100%; height: auto; padding:15px 0; text-align: center;}	
	.col-right {width: 100%; height: auto; padding:15px 0; text-align: center;}
	.job-2 a .red-btn-no-float {margin: 5px 0; width: 100%; mmargin: 0 auto; padding:10px 0;}
	.service-logo {position: unset !important;padding: 20px 0 0;}
	.col-1-3 .blue-btn {margin: 0 auto;}
	.red-btn-no-float {margin:5px 0;}
	.ql {width:46%;margin:25px 1%;}
	.models {width:36%;}
	.right-text .width p {text-align: left;}
	.cta-btm h2 {font-size: 18px;}
	.cta-btm h1 {font-size:  24px; line-height: 28px;}
	.map h3 {display: none;}
	.col-5 {width: 96%;}
	.col-5-1 {width: 96%;}
	.special-right h3 {font-size: 18px;}
	.multi-img {flex-basis: 100%;}
	
	.review-page select#foo-3 option {
    font-size: 15px;
	}
	footer .col-4 {
		flex-basis: 100% !important;
		text-align: center;
	}
	.electric-wrap h2 {font-size: 28px;}
	.model-title{font-size: 22px;}
	.review-page select#foo-3 {font-size: 15px !important;}
	.road {
		min-height: 120px;
	}
	
	.white-bg {
		padding: 10px 0;
	}
	.logo img {
   	min-width: 250px;
	}
	
		a.h-links.work-link, a.h-links.location-link, .short-link, a.bottom-link.repair-link,.short-link .h-links,.bottom-long-link.specials-link, a.bottom-link.repair-link {
		flex-basis: 100% !important;
	}
	
	.short-link, .link-content span{
		flex-wrap: wrap;
	}
	
	.life-img h2 {
		width: 90%;
		margin: 0 auto 15px;
	}
	
	.hero-slider .slide_buttons {
    text-align: center;
    position: absolute;
    top: 90%;
    right: 0;
    left: 0;
    z-index: 9;
	}
	
	.model-bar {
		flex-wrap: wrap;
		gap: 20px;
	}
	
	.electric-btn {
		padding: 10px 0;
		flex-basis: 100%;
		max-width: 100%;
	}
	a.bulletin {flex-basis: 100% !important;}
	.flex-testimony {flex-wrap:wrap !important;gap: 15px;justify-content: center !important;}
	.flex-testimony .emp-img img {margin: 0 auto !important;}
	.flex-testimony .emp-img,.flex-testimony .emp-testimony {text-align: center;flex-basis: 100% !important;}
}

@media only screen and (max-width: 450px) {
	.logo{
		flex-basis: 100%;
		width: 100%;
	}
.main-header.flex-wrap {
    flex-wrap: wrap;
}
	
.right-side {
    flex-basis: 100%;
	justify-content: space-between;
    order: -1;
}
	.logo img {
		min-width: 100%;
	}
	
	.site-header-push {
    height: 120px;
}
	.hero-text h1 {
    font-size: 32px;
}
	
	span.small-hero {
    font-size: 18px;
}
	.button-wrap {
		flex-wrap: wrap;
	}
	
	.button-wrap a {
		flex-basis: 100%;
	}
	
	.button-wrap button {
		width: 100%;
		max-width: 100%;
	}
	
	.hero-slider {
    margin-top: 25%;
}
	.cta-wrap {
		flex-wrap: wrap;
	}
	.review-page select#foo-3 {
    font-size: 14px !important;
}
	.review-page select#foo-3 option {
    font-size: 14px;
	}
}