﻿/***** BEGIN RESET *****/
@import url('https://fonts.googleapis.com/css2?family=Anuphan:wght@100..700&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');
@import url("https://media.sandhills.com/CDN/CSS/Font-Awesome/7.0.0/webfonts/fa-brands-400.woff2");
@import url("https://media.sandhills.com/CDN/CSS/Font-Awesome/7.0.0/css/all.min.css");

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 

/*-------- COLORS --------

*/

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}

* {box-sizing: border-box !important;}

/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

a,button,input.form-button {cursor:pointer;}

/*-------- BODY STYLES --------*/

body {
  font-family: "Anuphan", sans-serif;
	box-sizing:border-box;
    font-weight: 400;
    font-style: normal;
    overflow-x: hidden;
    line-height: 1.5;
}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}
h1,h2,h3,h4,h5,h6 {text-transform: uppercase;font-family: "Roboto Condensed", sans-serif;}
.yellow {color:#EBB91C;}
/*--- HEADER STYLES ---------------------*/
header {}
.header {display: flex;background:#2D3691;}
.white {color:#fff;}
.black-background {    background: black !important;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -5;}

/*---HERO--------------------*/
.hero-image img {object-fit: cover;width: 100%;height:auto;object-position: 20% 70% !important;background-color: black;}
section.homepage-hero {position: relative;overflow: hidden;}
.overlay {position: absolute;background: #0008;width: 100%;padding: 100%;}
.hero-image {z-index: -5;background-color: #000;}
.hero-content {position: absolute;top: 20%;display: flex;flex-direction: column;left: 5%;z-index: 200;color:#fff;width:50%;}

.hero-content h1 {text-transform: uppercase;font-size: clamp(1.875rem, 1.141rem + 3.6702vw, 6.1875rem);line-height: 1;font-weight:900;  font-family: "Roboto Condensed", sans-serif;}

.hero-content p{font-size: clamp(1.25rem, 1.1436rem + 0.5319vw, 1.875rem);font-family: "Roboto Condensed", sans-serif;font-weight:900;text-transform: uppercase;color:#EBB91C;}

a.yellow-button,input.form-button {width: 30%;color:#000;}
.button-flex {display:flex;gap:10px;margin-top:50px;width:100%;}
.yellow-button button,input.form-button {background:#EBB91C;padding:15px 0; width:100%;text-transform:uppercase;font-family: "Roboto Condensed", sans-serif;font-size:20px;border:none;font-weight:700;color:#000;}

.inventory-categories a:hover,.inventory-categories a:active,.inventory-categories a:focus,.info-categories a:hover,.info-categories a:active,.info-categories a:focus {transform: scale(.9);transition:ease-in-out .3s;}

input.form-button {width: 100%;max-width: 320px;}
.yellow-button button:hover,.yellow-button button:active,.yellow-button button:focus,input.form-button:hover,input.form-button:active,input.form-button:focus,.collapsible:hover,.collapsible:active,.collapsible:focus{background:#121741 !important;color:#EBB91C !important;transition:.3s ease-in-out;}


.yellow-button.hero button:hover,.yellow-button.hero button:active,.yellow-button.hero button:active,li.yellow-button:hover,li.yellow-button:active,li.yellow-button:focus {background:#fff !important;transition:.3s ease-in-out;color:#000!important;}
/*---BODY--------------------------------*/
.main-body-wrapper {background: #fff;width: 94%;margin: 0 auto -160px;box-shadow: 0px 10px 10px #0003;position: relative;top: -90px;}


/*------- CATEGORIES --------*/

.inv-cat {width: 100%;box-shadow: -4px 5px 15px #0003;display: flex;justify-content: center;background: #fff;height: 230px;align-items: center;}

.inv-image {display: flex;flex-direction: column;align-items: center;gap: 22px;}
.inv-image p{color:#000;font-size:20px;font-weight:900;text-transform:uppercase;}
.inv-image img {width: 100%;max-width: 90px;}

.inventory-categories {position: relative;padding: 70px 0;}

section.browse-inventory{width: 90%;margin: 0 auto;padding: 40px 0;}

.icon {display: flex;justify-content: center;align-items: center;gap: 40px;}
.icon img{max-width: 50px;width: 100%;}

.inventory-categories .wrapper.flex {display: flex;justify-content: space-between;justify-content: space-around;}

.inventory-categories a {width: 24%;}

.blue-background {background: #2D3691;width: 100%;padding: 70px 0;position: absolute;top: 14.5%;}

section.browse-inventory h2 {text-align: center;color:#2D3691;font-size: clamp(1.5625rem, 1.2965rem + 1.3298vw, 3.125rem);font-weight:900;text-transform:uppercase;font-family: "Roboto Condensed", sans-serif;}
.line {border-bottom: 4px #EBB91C solid;width: 100%;max-width: 10%;}


/*------- ABOUT US HOME--------*/
.about-home .wrapper.flex {display: flex;width: 90%;padding: 0 max(-8vw, calc(53vw - 1200px));margin: 0 auto;justify-content: space-between;align-items: center;}
.about-image img {width: 100%;max-width: 690px;position: relative;z-index: 2;}
.about-image {position:relative;}
.about-content {bottom: -96%;width: 100%;max-width: 682px;}
.about-content p {margin-bottom: 20px;}
.about-content .button-flex a.yellow-button {width: 51%;}

.yellow-box {width: 100%;padding: 30px;height: 400px;position: absolute;
background: #EBB91C;max-width: 410px;right: -20px;top: -23px;}
section.about-home {padding: 40px 0;}

.about-content h2 {color:#2D3691;font-size: clamp(1.5625rem, 1.2965rem + 1.3298vw, 3.125rem);font-weight:900;text-transform:uppercase;font-family: "Roboto Condensed", sans-serif;line-height:1;padding-bottom:20px;}
/*--------FORM STYLES--------------------*/


/*------- GET-IN-TOUCH --------*/
.get-into-contact .wrapper.flex {display: flex;background: #2D3691;justify-content: end;padding: 90px;padding-right: 9%;padding-left: 10%;}
.get-into-contact {padding: 90px 0 230px;position:relative;}
.map {position: absolute;left: 6%;;width: 100%;max-width: 690px;top: 5%;}

.contact-info h2{font-size: clamp(1.25rem, 1.0372rem + 1.0638vw, 2.5rem); color:#fff;}
.contact-cat li{margin-bottom:20px;}
.contact-cat {margin-bottom:20px;flex: 1;}
.contact-cat .yellow-button button{margin-top: 30px !important;}
.contact-cat a.yellow-button {width:100%;}
.contact-cat  a,.contact-cat  ul li a .icons{display:flex;gap: 12px;}



/*-------- MAIN ABOUT STYLES ----------------*/
section.about-home.main {padding: 50px max(2vw, calc(-7vw - 1200px)) 70px;}

/*-------- CONTACT STYLES ----------------*/
.subhero-content h1,span.large{text-transform: uppercase;font-size: clamp(1.5625rem, 1.137rem + 2.1277vw, 4.0625rem);line-height: 1;font-weight:900;  font-family: "Roboto Condensed", sans-serif;color:#fff;}

.subhero-image {background-color: #000;}
.subhero-content p{font-size: clamp(1.25rem, 1.1436rem + 0.5319vw, 1.875rem);font-family: "Roboto Condensed", sans-serif;font-weight:900;text-transform: uppercase;color:#EBB91C;}
.subhero-image img {object-fit: cover;width: 100%;height: 484px;object-position: 0 66% !important; }
section.subhero {position: relative;overflow: hidden;}
.overlay {position: absolute;background: #0008;width: 100%;padding: 100%;}

textarea { font-family: "Anuphan", sans-serif !important;}

.contact-top h2 {text-align: center;color:#2D3691;font-size: clamp(1.25rem, 0.9309rem + 1.5957vw, 3.125rem);font-weight:900;text-transform:uppercase;font-family: "Roboto Condensed", sans-serif;}

.contact-info {width: 47%;}
.contact-top p {text-align: center;color:#2D3691;font-size:18px;font-weight:600;font-family: "Roboto Condensed", sans-serif;}

form,.form-content {width: 100%;max-width: 90%;}
.formfield {display: flex;gap: 30px;margin-bottom: 40px;}
.formfield div{width:100%;}
section.form {width: 90%;margin: 0 auto;display: flex;justify-content: center;flex-direction: column;align-items: center;}

 .formfield p{color:#fff !important;text-transform:uppercase !important; padding-bottom: 12px !important;font-weight:800 !important;}
.formfield > div {display:flex;flex-direction:column;}
.formfield input,.formfield textarea,input#CaptchaAnswer {width: 100%;box-sizing: border-box;padding: 16px 10px;}
.contact-top{padding: 60px 0 10px;display: flex;flex-direction: column;text-align: center;}
.sub-map {text-align: center;padding: 60px 0px;}
.subhero-content {position: absolute;top: 32%;display: flex;flex-direction: column;left: 5%;z-index: 200;color:#fff;width: 46%;}
.contact-form {background:#2D3691;display: flex;justify-content: center;padding: 80px 0;}

.collapsible {
background:#EBB91C;padding:15px 0;text-transform:uppercase;font-family: "Roboto Condensed", sans-serif;font-size:20px;border:none;max-width: 300px;font-weight:700;width: 30%;color:#000;
}

/* Style the collapsible content. Note: hidden by default */
.content {
  padding: 40px 0 0;
  display: none;
  overflow: hidden;
}


.CaptchaPanel {text-align: left!important;}
.CaptchaWhatsThisPanel a,.CaptchaMessagePanel {color:#fff;}

.info-categories {position: relative;padding: 70px 0;}

.blue-background.contact {top: 310px;padding: 57px 0;}
.info-cat {width: 100%;box-shadow: -4px 5px 15px #0003;display: flex;justify-content: center;background: #fff;height: 174px;align-items: center;}

.info-categories .wrapper.flex {display: flex;justify-content: space-between;justify-content: space-around;width: 90%;margin: 0 auto;}

.info-categories a {width: 24%;}
.info-image {display: flex;flex-direction: column;align-items: center;gap: 22px;}
.info-image p{color:#000;font-size:20px;font-weight:900;text-transform:uppercase;}
.info-image img {width: 100%;max-width: 90px;}
/*-------- FOOTER STYLES ----------------*/
footer{}
.footer {display: flex;}
.footer img {width: 100%;max-width: 300px;background: #fff;}
.footer-logo {flex: 1;padding: 11% 4% 6%;text-align: center;}
.footer-categories {flex: 3;justify-content: center;display: flex;background: #2D3691;padding: 9% 0 3%;align-items: flex-start;}
.contact-categories .wrapper.flex {justify-content: space-between;padding: 14px 2%;}
.footer-cat {width: 100%;max-width: 320px;display: flex;flex-direction: column;align-items: start;color: #fff;margin-bottom: 10px;}
.footer-cat li{width: 100%;max-width: 320px;display: flex;flex-direction: column;align-items: start;color: #fff;margin-bottom: 10px !important;  font-family: "Anuphan", sans-serif;}
.contact-cat i{font-size:28px;color:#EBB91C;}
.footer-cat p {font-size: clamp(1.25rem, 1.1436rem + 0.5319vw, 1.875rem);text-transform: uppercase;font-family: "Roboto Condensed", sans-serif;font-weight:900;margin-bottom: 10px;}
.footer-cat a {color:#fff;}
ul.uppercase li {text-transform:uppercase;font-weight:500;}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

button.selected-facet.ts-button,a.view-listing-details-link.des-view-listingDetails.template-branded-button {background:#EBB91C !important;color:#000 !important;}

.list-content .listing-widgets .Currency a {background: #2D3691 !important;color:#fff !important;}
.ground-bcrumbs {padding-top: 40px !important;}

span.calc-button__text,span.fa.notranslate.MuiIcon-root.MuiIcon-fontSizeMedium.fa-calculator.calc-button__icon.kingusedequipmentcomhdev-1c9l6h4,span.detail__search-results-text,.dealer-contact__videochat span {color:#000 !important;}
.listing-widgets-detail .Currency a {color:#fff !important;}

.body-content a{color: #000 !important;}
.detail-wrapper {padding: 40px 0 !important;}
/*---------- RESPONSIVE STYLES ----------*/


@media only screen and (max-width: 1600px) {
	.map {max-width: 40%;top: -1%;left: 3%;}
	.about-image img {max-width: 530px;}
	.yellow-box {height: 240px;}
	.about-content {width: 100%;max-width: 520px;}
}

@media only screen and (max-width: 1600px) {
	.map {max-width: 40%;top: -1%;left: 3%;}
}


@media only screen and (max-width: 1300px) {
	.inventory-categories .wrapper.flex {gap: 10px;}
	.inventory-categories a {width:90%;}
	.blue-background {top: 11%;}
	a.yellow-button, input.form-button {width: 100%;}
	.map {position: absolute;left: 5%;top: -34%;width: 100%;max-width: 90%;}
	.map iframe{height: 490px;}
	.get-into-contact .wrapper.flex {display: flex;background: #2D3691;
    justify-content: center;
    padding: 70px;
    padding-right: 14%;
    padding-left: 10%;}
	.contact-info {padding-top: 30px;}
	section.about-home {padding: 70px 0 450px;}
	.contact-categories .wrapper.flex {padding:10px;}
	.about-image img {max-width: 400px;}
	.yellow-box {height: 172px;max-width: 200px;}
	.get-into-contact {padding: 90px 0 42%;}
}



@media only screen and (max-width: 1200px) {
	.about-image img {max-width: 330px;}
	.contact-info {padding-top: 50px;width: 100%;}
	.hero-content {top: 10%;}
}



@media only screen and (max-width: 1040px) {
	.about-image,.yellow-box {display:none;}
	.about-content {max-width:100%;}
	.subhero-content {width: 100%;}
	.yellow-button button, input.form-button {max-width:unset;}
}


@media only screen and (max-width: 900px) {
	section.about-home {padding: 70px 0 300px;}
	.contact-info {width: 100%;padding-top: 35%;}
	.inventory-categories .wrapper.flex {flex-direction: column;align-items: center;gap: 30px;}
	.inventory-categories .wrapper.flex,.info-categories .wrapper.flex {flex-direction: column;align-items: center;gap: 13px;}
	.inventory-categories a, .info-categories a {width:90%;}
	.blue-background {display:none;}
	.about-image,.yellow-box {display:none;}
	.hero-content {width: 60%;}
	.blue-background {display:none;}
	.contact-info {padding-top: 70px;}
	.footer {display: flex;flex-direction: column-reverse;}
	.footer-categories {    flex-direction: column;
    gap: 40px;}
	.collapsible {max-width:unset;width:100%;}
	.footer-categories {padding: 23% 10%;}
	.get-into-contact {padding: 0 0 200px;}
	.contact-info {padding-top: 34%;}
	.formfield {flex-direction: column;}
	.subhero-content {width: 86%;}
	.get-into-contact {padding: 0 0 14%;}
	.about-home .wrapper.flex {padding: 0 0 70px;}
	.button-flex {margin-top: 20px;}
	section.about-home.main {padding: 20px max(2vw, calc(-7vw - 1200px)) 20px;}
	.contact-top {padding: 30px 0 10px;}
}

@media only screen and (max-width: 700px) {
	.hero-content{width: 74%;top: 12%;}
	.get-into-contact .wrapper.flex {flex-direction: column;}
	.contact-cat {margin-bottom:unset;}
	.contact-info {padding-top: 48%;}
	section.about-home {padding: 70px 0 300px;}
	section.browse-inventory {padding: 60px 0 0;}
	.hero-image img {height: 468px;object-position: 77% 0px !important;}
	.button-flex {margin-top: 26px;}
	
}

@media only screen and (max-width: 600px) {
	.hero-image img {object-fit: cover;width: 100%;
    height: 529px;object-position: -30 -60px !important;}
	.subhero-image img {object-fit: cover;width: 100%;height: 354px;}
}


@media only screen and (max-width: 500px) {
	.button-flex {flex-direction: column;}
	a.yellow-button, input.form-button {width: 100%;}
	.about-content .button-flex a.yellow-button,.collapsible  {width: 100%;}
	section.about-home {padding: 70px 0 260px;}
	.hero-content {width: 90%;}
	
	.inventory-categories {padding: 30px 0;}
	.footer-categories {padding: 33% 10%;}
	.contact-info {padding-top: 60%;}
	.footer-logo {padding: 31% 4% 50%;}
}




@media only screen and (max-width: 400px) {
	.contact-info {padding-top: 69%;}
}




@media only screen and (max-width: 370px) {
	.contact-info {padding-top: 80%;}
}






