﻿/***** BEGIN RESET *****/
@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");
@import url('https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght,YOPQ@100..900,300&family=Teko:wght@300..700&display=swap');

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 

/*-------- COLORS --------

*/

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}


/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

/*-------- BODY STYLES --------*/

* {box-sizing: border-box;}

body {
	background:#000;
	color:#fff;
	font-family: "Kumbh Sans", sans-serif;	
	font-style:normal;
	box-sizing:border-box;
	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,button {font-family: "Teko", sans-serif;text-transform:uppercase;}
a,button {color:#fff;cursor: pointer;}

.flex {display:flex;}

.desktop-hidden {display:none;}

.wid-90 {width: 90%; margin: 0 auto; max-width: 1800px;}

/*--- ANIMATION STYLES ---------------------*/

/*
.animation-element {
  opacity: 0;
  position: relative;
  z-index: 1;
}

.animation-element.slide-right {
 -webkit-transition: all 900ms ease;
        -moz-transition: all 900ms ease;
        -o-transition: all 900ms ease;
        transition: all 900ms ease;
        opacity: 0;
        -moz-transform: translate3d(100px, 0px, 0px);
        -webkit-transform: translate3d(100px, 0px, 0px);
        -o-transform: translate(100px, 0px);
        -ms-transform: translate(100px, 0px);
        transform: translate3d(100px, 0px, 0px);
}

.animation-element.slide-right.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}
*/


/*--- BUTTON STYLES ---------------------*/
a.red-button {width:100%;}
a.red-button button {background:#D81A22;border:unset;font-size: clamp(1rem, 0.9865rem + 0.0676vw, 1.0625rem);padding: 15px 2%;width:100%;max-width:50%;margin-top: 10px;font-family: "Teko", sans-serif;font-weight:600; transition:.3s}

a.red-button button:hover {background:#fff;color:#D81A22}
.button-with-text {padding-top: 14px;}

.collapsible {
    background: #D81A22;
    border: unset;
    font-size: 20px;
    padding: 15px 2%;
    width: 100%;
    max-width: 90%;
    margin: 0 auto;
    text-align: center;
    margin-top: 30px;
    font-family: "Teko", sans-serif;
    font-weight: 600;
    display: flex;
    justify-content: center;
	transition:.3s;
}

.active, .collapsible:hover {
  background:#fff;color:#D81A22
}

.content {
  display: none;
  overflow: hidden;
}


/*--- SWIPER STYLES ---------------------*/
/*
.swiper {
  width:100%;
height:100%;
max-width:50%;
}
.swiper img{
width: 100%;
}
*/

/*.swiper-wrapper {overflow-x: hidden !important;}*/



.gallery-swiper {max-width: 100%;line-height: 0;}
.gallery-swiper img{object-fit:cover;width:100%;height: 500px;}
.swiper-scrollbar {display: none;}
/*---BODY--------------------------------*/

/*---HERO---------------*/
.main-hero {background:url("/siteart/textures/main.webp");background-repeat:no-repeat;background-size:cover;padding: 70px 0;height: 100%;background-color:#000; position: relative;}

.main-hero .wrapper {align-items: center;width: 90%;margin: 0 auto;gap: 22%;padding-top: 30px; position: relative; z-index: 2;}

.main-hero .swiper {position: absolute; top: 0;bottom: 0;left: 0; right: 0;}

.hero-image img {width: 100%;max-width: 730px;height: 100%;}
.hero-content h1 {color:#20EB6B;font-size: clamp(3.125rem, 2.7196rem + 2.027vw, 5rem);line-height:1;}
.small-title {font-size: clamp(1.25rem, 0.9797rem + 1.3514vw, 2.5rem);color:#fff;font-weight:500;}

.button-with-text p {margin-bottom: 10px;}

.new-hero {
	background:url("/siteart/textures/main.webp");
	background-repeat:no-repeat;
	background-size:cover;
	position: relative;
	width: 100%;
	aspect-ratio: 3 / 2;
	max-height: 900px;
	min-height: 500px;
}

.new-hero .hero-content {position: relative; z-index: 2; padding-top: 200px;}
.new-hero .hero-content .red-button button {max-width: 250px;}

.heroSwiper {position: absolute !important;bottom: 0; left: 0;width: 100%; aspect-ratio: 3 / 2; max-height: 900px;min-height:500px;}

.heroSwiper::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-image: linear-gradient(rgba(34,34,34,0.5), rgba(34,34,34,0.5));
	z-index: 2;
}

.heroSwiper img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-bottom {
	position: absolute;
	z-index: 2;
	display: block;
	bottom: -20px;
	width: 100%;
}

/*--------INVENTORY SECTION STYLES--------------------*/

.inventory-title {background-color: #111;width: 100%;max-width: 500px;text-align: center;display: flex;justify-content: center;align-items: center;padding: 70px 2%;}

.inventory-title i {font-size: clamp(2.1875rem, 2.0524rem + 0.6757vw, 2.8125rem);color:#20EB6B;}
.inventory-title h2 {font-size: clamp(2.8125rem, 2.4747rem + 1.6892vw, 4.375rem);text-align: left;line-height: 1;}

.inv-cat {display: flex;flex-direction: column;align-items: center;background: #333333;padding: 10px 5%;height: 130px;justify-content: center;font-weight: 700;font-size: clamp(0.9375rem, 0.9105rem + 0.1351vw, 1.0625rem);transition:.3s;}

.inv-cat:hover {transform:scale(.9);}

.inventory-section {flex:2;background:#111111;align-items: center;display: flex;padding: 20px 0;}

.inventory-section .wrapper.flex {align-items: center;width: 100%;justify-content: center;gap: 30px; flex-wrap: wrap;}

.inventory-section a {width: 30%; padding: 10px;}

.inv-icon {line-height: 0;}

section.inventory-categories {width: 100%;box-sizing: border-box;background-color: #111;}


.list-bottom-controls button{background: #fff !important;opacity: unset !important;}
/*--------BUY, SELL, TRADE STYLES--------------------*/

.buy-sell-trade .wrapper.flex {flex-direction: column;align-items: center;gap: 20px;text-align: center;width: 58%;}

.buy-sell-trade {background: url("../siteart/textures/buy-sell-trade-texture.webp");height: 550px;background-position: 0 45%;background-repeat: no-repeat;background-size: cover;background-color:#000;}

form {background: url("../siteart/textures/buy-sell-trade-texture.webp");height: 550px;background-repeat: no-repeat;background-size: cover;background-color: #000;padding: 8% 0 18%;object-fit: cover;}

.contact-content .contact-buttons {width:100%;max-width: 40%;margin:0 auto;}

section.buy-sell-trade {display: flex;align-items: center;justify-content: center;}

span.cash {font-size: clamp(3.125rem, 2.8547rem + 1.3514vw, 4.375rem);}

.buy-sell-trade p{font-family: "Teko", sans-serif;text-transform: uppercase;font-weight: 600;font-size: clamp(2.1875rem, 1.9848rem + 1.0135vw, 3.125rem);text-align: center;line-height: 1;}
.green {color:#20EB6B;}

.buy-sell-trade .red-button button {margin-top: 10px;max-width: 200px;}

.buy-sell-trade .wrapper.flex img {width: 100%;height: 100%;}

/*--------ABOUT SECTION STYLES--------------------*/
.about {background:#222222;line-height:1.8;}
.about-image {position: relative;width: 100%;max-width: 44%;height: 100%;}
.texture {position: absolute;height: 100%;left: -20px;z-index: 8;width: 24%;}
.about .flex {justify-content: space-between;}
.about .wrapper {width: 44%;margin: 0 auto;display: flex;flex-direction: column;justify-content: center;gap: 10px;position: relative;z-index: 10;}
.about h2 {font-size: clamp(2.5rem, 2.0946rem + 2.027vw, 4.375rem);line-height: 1.6;}

img.mobile-hidden {height: 100%;object-fit: cover;}

/*--------TRY IT OUT SECTION STYLES--------------------*/
.try-it-out .wrapper.flex {gap: 4%;align-items: center;padding: 5% 0;}
.map-content {width: 43%;line-height:2;}
.map-content h2 {font-size: clamp(2.5rem, 2.2297rem + 1.3514vw, 3.75rem);line-height: 1;margin-bottom: 3%;}
.map-content h3 {margin-top: 30px;line-height: 1;font-size: clamp(1.0625rem, 0.8868rem + 0.8784vw, 1.875rem);}
.map-content a {color:#fff;transition:.3s;}
.map-content a:hover {color:#D81A22;font-weight:700;}

.map-content a.red-button button {max-width:200px;margin-top: 20px;}
section.try-it-out {box-sizing: border-box;}
.map {width: 100%;max-width: 50%;}
/*--------GALLERY--------------------*/

.gallery {
	padding: 4% 0;
	display: flex;
	flex-wrap:wrap;
	width:90%;
	margin:0 auto;
	gap: 20px;justify-content: center;
}

.gallery img {
    width: 100%;
	aspect-ratio: 3 / 2;
    cursor: pointer;
    max-width: 322px;
	object-fit: cover;
	transition:.3s;
}

.gallery img:hover {
	transform:scale(.9);
}


#lightbox {
	background: rgba(0,0,0,0.8);
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: none;
	justify-content: center;
	align-items: center;
	color: #fff;
	z-index: 10;
}

#lightbox img{
      width: 50%;
    object-fit: cover;
}

.close, .prev, .next {
	position: absolute;
	cursor: pointer;
}

.close {
    right: 70px;
    top: 40px;
    font-size: 30px;
}

.prev {
	left: 50px;
}

.next {
	right: 50px;
}

#lightbox i{font-size: 30px;}

.CaptchaPanel {margin: 50px auto 0;}

/*--------FORM + CONTACT STYLES--------------------*/
form {margin: 0px;padding: 5% 0 11%;width: 100%;max-width: 100%;height: 100%;}

.contact-content {position: relative;width: 100%;display: flex;justify-content: space-between;gap: 3%;align-items: center;box-sizing: border-box;}


input#Prefer_Phone,input#Prefer_Email {width:unset;}
.contact .wrapper.flex {gap: 4%;align-items: center;flex-direction: column;box-sizing: border-box;}

.formfield input,.formfield selector,.formfield textarea {box-sizing:border-box;width: 100%;padding: 18px 1%;}

textarea {padding:30px 2% !important;font-family: "Kumbh Sans", sans-serif;	}

input.red-button.form {    width: 100%;
    background: #D81A22;
    border: unset;
    font-size: 22px;
    color: #fff;
    font-family: "Teko", sans-serif;
     padding: 15px 2%;
    margin-top: 30px;font-weight:700;transition:.3s;}

input.red-button.form:hover {background:#fff;color:#D81A22;}

.formfield {width: 100%;}
.form.flex {padding:20px 0;}
.form.flex,.message.formfield {flex-direction: row;justify-content: center;align-items: center;margin: 0 auto;gap: 20px;width: 90%;}

.contact-content p{margin-bottom: 10px;}

section.contact {box-sizing: border-box;}

.contact-content h2 {font-size: clamp(2.1875rem, 1.9848rem + 1.0135vw, 3.125rem);line-height:1;}

.contact-info {display:flex;flex-direction: column;padding-top: 20px;box-sizing: border-box;width: 100%;gap: 20px;}

.contact-info a.red-button button {max-width:100%;margin-top:unset;padding: 19px 2%;}



.form-texture {width:100%;position:relative;}
input#Prefer_Phone {margin-right: 20px;}

input#copylink {color: #000 !important;-webkit-text-fill-color: currentcolor;

}
.MuiInputBase-formControl{border:#000 solid 2px !important;}

.MuiInputAdornment-outlined svg {fill:#000 !important;}

.bottom-region a strong,span.ub-num,.detail-wrapper,.bottom-region span {color:#000 !important;}
/*-------- THANK YOU STYLES ----------------*/

.thankyou-content {    position: relative;
    width: 100%;
    max-width: 90%;
    display: flex;
    justify-content: space-between;
    gap: 3%;
    align-items: center;
    box-sizing: border-box;
   padding: 7% 0;}

.thankyou-content h2 {font-size: clamp(2.1875rem, 1.9848rem + 1.0135vw, 3.125rem);line-height:1;}
.thankyou-content p{margin-bottom: 10px;}

.thankyou-info {display:flex;flex-direction: column;padding-top: 20px;box-sizing: border-box;width: 100%;gap: 20px;max-width: 40%;}

.thankyou-info a.red-button button {max-width:100%;margin-top:unset;padding: 19px 2%;}

/*-------- FOOTER STYLES ----------------*/
footer{background: url("../siteart/textures/main.webp");background-repeat: no-repeat;background-size: cover;border-top:#D81A22 4px solid;background-color:#000;}

.footer {height: 100%;text-align: center;padding: 3% 0 2%;display: flex;flex-direction: column;gap: 70px;justify-content: space-between;}

.footer ul {display:flex;justify-content: center;gap:3%;}
.footer ul li a {font-size:19px;font-weight:700;transition:.3s;}

.footer ul li a:hover {color:#D81A22;}

.footer-logo img {width:100%;max-width:30%;margin-bottom: 30px;height: 100%;}


/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.inventory.hero,.sub-hero {background:url("/siteart/textures/main.webp");background-repeat:no-repeat;background-size:cover;padding: 3% 0;height: 400px;display: flex;align-items: center;justify-content: start;background-color:#000;}

.options-popper-btn {color:#fff !important;}

.sub-hero .wrapper.flex, .inventory.hero .wrapper.flex {width:90%;margin:4% auto 0;}

.list-top-section .list-bcrumbs-and-title .ground-bcrumbs {padding-top: 50px;}

.inventory-heading, .sub-hero h1 {font-family: "Teko", sans-serif;text-transform:uppercase;color: #20EB6B;font-size: clamp(3.125rem, 2.7196rem + 2.027vw, 5rem);line-height: 1;font-weight: 700;}

div#filters,.listing-card-grid.listing-data-selector,.ts-modal-content,.show-closest-first,.bottom-region,span.section-title-text,.media-buttons {color: #000 !important;}
.detail__breadcrumbs,.linking-container h4, .column3.left ul li a {color:#fff !important;}

.calc-button-wrapper button, nav.breadcrumbs ul li a,.breadcrumbs__link, button.detail__search-results, select#retail-currency {
color:#fff !important;}

nav.breadcrumbs {padding: 30px 0;}

a.view-listing-details-link.des-view-listingDetails.template-branded-button {background:#D81A22 !important;}

ul.MuiPagination-ul li button,.options-popper-div button{color:#000 !important;}
 option.currency-selector-option, .list-redesign .list-container-flexrow .list-listing-card-wrapper .listing-card-mobile .right-area .price-contain .price, p.listing-category, span.spec-label, .list-redesign .list-container-flexrow .list-listing-card-wrapper .listing-card-mobile .right-area .specs-container .spec-value, .list-redesign .specs-container .specs-button{color:#000 !important;}

.detail__title-container button.options-popper-btn{color: #fff !important;}
/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 1700px) {
	
}

@media only screen and (max-width: 1600px) {

}


@media only screen and (max-width: 1500px) {
	
}

@media only screen and (max-width: 1300px) {
	.main-hero {padding:140px 0;}
	.swiper {max-width:100%;}
	.main-hero .wrapper.flex {gap: 2%;}
	.inventory-section a {width: calc(50% - 30px);}
}

@media only screen and (max-width: 1100px) {
	.inventory.hero, .sub-hero {height: 300px}
	.hero-bottom{bottom: -10px;}
	.footer ul {flex-direction: column;gap: 20px;}
	.footer-logo img {width:100%;max-width:80%;}
	.footer {padding:10% 0;}
	.contact-content {flex-direction:column;gap:20px;}
	.contact-content .map {max-width:100%;}
	.form.flex{flex-direction:column;}
	.inventory-categories .wrapper.flex {flex-direction: column;box-sizing: border-box;gap: 20px;}
	.inventory-title {max-width: 100%;text-align: center;display: flex;align-items: center;padding: 50px 4% 0;justify-content: center;box-sizing: border-box;}
	.inventory-section a {width: 100%;max-width: 78%;margin: 0 auto;}
	.inventory-section {padding: 43px 0;}
	.contact-content .contact-buttons {max-width: 90%;padding: 7% 0;margin: 0 auto;}
	.texture {width:100%;}
	img.mobile-hidden {width:unset;}
}

@media only screen and (max-width: 1000px) {
	.footer ul {flex-direction: column;gap: 20px;}
	.footer-logo img {width:100%;max-width:80%;}
	.footer {padding:10% 0;}
	.contact-content {flex-direction:column;gap:20px;}
	.contact-content .map {max-width:100%;}
	.form.flex{flex-direction:column;}
	
}

	
@media only screen and (max-width:900px) {
	.new-hero .hero-content {padding-top: 100px;}
	.hero-image img {max-width: 470px;}
}

@media only screen and (max-width:800px) {
	.thankyou-content {flex-direction:column;}
	a.red-button button {max-width:100%;}

	.thankyou-info {max-width:100%;}
}


@media only screen and (max-width: 790px) {
	.contact-info {flex-direction:column;}
	.main-hero .wrapper.flex {flex-direction: column-reverse;overflow-x: hidden;}
	.try-it-out .wrapper.flex {flex-direction: column;}
	.map-content {width: 90%;margin: 0 auto;padding: 8% 0;}
	.map-content a.red-button button {max-width: 100%;}
	.map {width:100%;max-width: 90%;}
	.main-hero {padding: 50px 0;}
	.top-header .wrapper.flex {flex-direction: column;text-align: center;gap: 10px;}
}

@media only screen and (max-width: 600px) {
	.inventory.hero, .sub-hero {height: 200px}
	.hero-bottom {bottom: 0;}
	.about .flex {flex-direction: column-reverse;}
	.about-image {max-width: 100%;}
	.texture img {max-width:100%;height: 106px;}
	.mobile-hidden {display: none !important;}
	.desktop-hidden {display:flex;}
	.texture {bottom: -190px;width: 100%;left:unset;}
	.about .wrapper {width: 90%;padding: 5% 0 24%;}
	.buy-sell-trade .wrapper.flex {width: 90%;margin: 0 auto;}
	.about-image img {height: 290px;}
	.about-image .texture img {width: 100%;height: 106px;object-fit: cover;}
	.contact-info a.red-button button {display: flex;flex-direction: column;align-items: center;gap: 10px;}
	#lightbox img {width: 80%;}
	.prev,.next {bottom: 22%;}
	.buy-sell-trade {background-position:unset;}
	
}






