﻿/***** BEGIN RESET *****/
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Catamaran:wght@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;  
} 

a,button {cursor:pointer;}

/*-------- 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;
}

h1,h2,h3,h4,h5,h6 { font-family: "Barlow Condensed", sans-serif;text-transform:uppercase;}
h2 {font-size: clamp(1.25rem, 0.8654rem + 1.9231vw, 3.125rem);}
/*-------- BODY STYLES --------*/

body {
background:url("/siteart/textured-background.webp");
font-style: normal;
box-sizing: border-box;
line-height: 1.5;
font-family: "Catamaran", sans-serif;
}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}


.flex {display:flex;}


/*--- BUTTON STYLES ---------------------*/
a.red-button {width:100%;max-width:450px;}
a.red-button button,input.red-button{background: #d10008;padding:20px 0;width:100%;border:unset ;box-shadow:unset;color:#fff;font-weight:600;font-size: clamp(1rem, 0.9487rem + 0.2564vw, 1.25rem);font-family: "Barlow Condensed", sans-serif;text-transform:uppercase;cursor:pointer;transition:.3s;}

.hero-overlay a.red-button button:hover{background:#fff;color:#d10008;}

.button.flex a.red-button button{max-width: 100%;display: flex;justify-content: space-between;padding: 20px 20px;}
.button.flex {gap: 30px;margin-top: 60px;}

 a.red-button button:hover,input.red-button:hover {background:#5B0104;}
/*--- HEADER STYLES ---------------------*/
header {}

section.hero-image {background: url("../siteart/hero-image.webp");width: 100%;height: 950px;background-repeat: no-repeat;background-size: cover;position:relative;}

.hero-overlay {    width: 100%;
    background: #0008;
    height: 100%;
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;}

.hero-overlay .wrapper.flex {flex-direction: column;margin-left: 3%;position: relative;top: -60px;}

.hero-overlay .wrapper.flex h1{color:#fff;font-size: clamp(2.5rem, 1.7308rem + 3.8462vw, 6.25rem);line-height:.9;}
.hero-overlay .small-text {font-size: clamp(1.25rem, 1.1218rem + 0.641vw, 1.875rem);font-weight:500;}
.texture-overlay {width:100%;}
.texture-overlay img{max-width: 100%;height: 100%;object-fit: contain;width: 100%;}
.hero-overlay .buttons.flex {margin-top: 30px;gap: 20px;}

.four-buttons {position:relative;bottom: 180px;width: 100%;}
.four-buttons .wrapper.flex {justify-content: center;gap: 20px;}

.header-button .button-cat.flex {flex-direction:column;justify-content: space-evenly;align-items: center;line-height: 1;}
a.header-button {background: #fff;padding: 30px 0;width: 100%;max-width: 380px;height: 275px;display: flex;align-items: center;justify-content: center;}
.button-cat.flex {text-align: center;}
.button-cat.flex img {width: 100%;height: auto;max-width: 60%;object-fit: cover;margin-bottom: 20px;}

.button-cat p {font-size: clamp(1.25rem, 1.0147rem + 1.1765vw, 1.75rem);font-family: "Barlow Condensed", sans-serif;text-transform:uppercase;font-weight:700;color:#d10008;}

.button-cat .small-text {font-size: 21px;font-weight:500;}

a.header-button {width: 100%;max-width: 430px;box-shadow: 0 0 25px #0005;transition:.3s;position: relative;top: 0px;}
a.header-button img {transition:.3s;}
a.header-button:hover img{transform:scale(1.2);}
a.header-button:hover {position: relative;top: -20px;}
/*---BODY--------------------------------*/



/*---FLOATING CSS---------------------*/
.scrolling-wrap {line-height: 0;height: inherit;}
.floating-section  {margin: 0% auto 10% !important;width: 90%;background: #fff;box-shadow: 0 0 29px #0005;}
.floating-section .flex.wrapper .sec-1 {width: 100%;max-width: 600px;box-shadow: 0 0 15px #0005;box-shadow:none!important;}
.floating-section .flex.wrapper {width:90%;margin:0 auto;align-items: center;gap: 9%;padding: 4% 0;}
.content.sec-2 {width: 50%;margin: 0 auto;}


/*---TEXTURE CSS--------------------------------*/
.texture-section .wrapper.flex {display: flex;flex-direction: column;}

.texture-content {background:#000;color:#fff;padding: 5% 0 5%;text-align:center;}

.texture-section img {margin-bottom: -2px;width: 100%;height: 100%;object-fit: cover;}

.texture-content .wrapper {width: 90%;max-width: 770px;margin: 0 auto;}
.texture-content a.red-button button {max-width: 700px;margin-top: 5%;}
.texture-content p {font-size: clamp(1rem, 0.9595rem + 0.2027vw, 1.1875rem);font-weight:600;}


/*---CONTACT CSS--------------------------------*/
section.sub.hero-image {height: 400px;background-position: 0 30%;}
section.sub.hero-image .hero-overlay .wrapper.flex {top: -10px;}
.contact.floating-section .sec-1 {max-width: 630px !important;}
.contact.floating-section .sec-2 {width: 100%;}
.contact.floating-section .flex.wrapper {align-items: center;gap: 5%;}
.contact.floating-section{margin: 5% auto 5% !important;}
.contact.floating-section ul li a{color: #000;font-weight: 700;font-size: 16px;}

.contact.floating-section i {color:#d10008;}
.contact.floating-section ul li {margin-bottom: 13px;}
.contact.floating-section ul {margin:10px auto 50px;}
.red {color:#d10008;font-weight:700;font-size:18px;}

/*--------CONSIGN STYLES--------------------*/
.consign.floating-section{margin: 5% auto 5% !important;}
div#formpage {border-left: unset;padding-left: unset;width: 100%;box-sizing: border-box;}
.consign div#formpage {border-left:unset;padding:unset;}
.consign.floating-section .sec-1 {max-width:100% !important;}
.consign.floating-section .sec-1 p {margin-bottom:20px;}

/*--------ABOUT STYLES--------------------*/

.about.floating-section {margin: 5% auto 5% !important;}
.about.sec-2 {width: 50%;}
.about.floating-section .flex.wrapper {align-items:center !important;justify-content: space-between;}
.about.floating section ul {margin:unset !important;}


/*--------THANK YOU STYLES--------------------*/

.thankyou.floating-section {margin: 5% auto 5% !important;}
.thankyou.sec-2 {width: 50%;}
.thankyou.sec-2 a.red-button {max-width: unset;}
.thankyou.floating-section .flex.wrapper {align-items:center !important;gap: 3%;justify-content: space-between;}
.thankyou.floating section ul {margin:unset !important;}
.thankyou .button.flex {margin-top:unset;}

/*--------FORM STYLES--------------------*/
.formfield input,.formfield select,.formfield textarea {box-sizing:border-box;width: 100%;padding:15px 10px;border:solid #000 1px;color:#000 !important;}
.formfield input#Message {padding:30px 10px !important;}
.formfield {margin-bottom: 18px;width: 100%;}
.form.flex {gap: 30px;}
div#formpage {border-left: solid #000;padding-left: 8%;}
textarea {font-family: "Catamaran", sans-serif;}
.CaptchaWhatsThisPanel {color:#000 !important;}

.formfield label {font-weight:600;}
.check-box.form.flex {margin-bottom: 10px;}

/*-------- FOOTER STYLES ----------------*/
footer{background:#fff;}

.foot-cat p {font-weight:700;font-size: clamp(1.25rem, 1.0904rem + 0.7979vw, 2.1875rem);text-transform:uppercase;font-family: "Barlow Condensed", sans-serif;}
.foot-cat ul li a {font-weight:700;color:#000;}
.foot-cat ul li {margin-bottom:5px;}
.social-flex i {color:#000;}
.social-flex  {display:flex;gap:5px;}

.footer {display:flex;justify-content:space-around;padding: 3% 0;margin: 0 auto;}
.footer-categories.flex {gap: 60px;}
.footer-logo {display: flex;flex-direction: column;justify-content:center ;align-items: center;}

.footer-logo img {    width: 100%;
    max-width: 280px;
    height: 60%;
    object-fit: contain;}

.footer-logo p {margin-top:10px;font-weight:700;text-transform:uppercase;font-family: "Barlow Condensed", sans-serif;font-size: clamp(1rem, 0.9615rem + 0.1923vw, 1.1875rem);}


/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.column3.left ul li a,.linking-container h4 {color:#000;}
.ground-bcrumbs,.parts-title-and-breadcrumbs {padding-top: 30px !important;}

.list-container-flexrow .view-listing-details-link,.list-content .listing-widgets .Currency a,.faceted-search-content .selected-facets-container .selected-facet {color:#fff !important;background:#d10008!important;}
strong.list-listings-count {color:#000 !important;}
.detail__breadcrumbs {
padding-top: 30px !important;}
.detail__media-buttons.media-buttons a, .detail__media-buttons.media-buttons button#share {color:#fff !important;background:#d10008!important;}
/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width:1436px) {
	.floating-section .flex.wrapper {gap: 4%;}
}
	
@media only screen and (max-width:1400px) {
	.floating-section{margin: 0 auto 10% !important;}
	section.hero-image {height: 570px;}
	.four-buttons {bottom: 110px;}
	.four-buttons .wrapper.flex {width: 90%;margin: 0 auto;}
	.button.flex {flex-direction:column;gap:10px;}
	
}

@media only screen and (max-width:1160px) {
	.floating-section .flex.wrapper {flex-direction: column-reverse;gap: 50px;}
	.thankyou.floating-section .flex.wrapper {flex-direction:column !important;}
	.contact.floating-section .sec-1 {max-width: 100% !important;}
	.content.sec-2 {width: 90%;}
		.footer {flex-direction: column-reverse;}
	.footer-categories.flex {flex-direction: column;gap: 20px;
    width: 90%;margin: 0 auto;}
	.button.flex {flex-direction: row;margin-top: 30px;}
	.about.sec-2,.thankyou.sec-2 {width: 100%;}
	.thankyou.sec-2 .button.flex{padding-top:30px;}
	.contact.floating-section .flex.wrapper {flex-direction:column !important;}
	div#formpage {border-left:unset;padding-left:unset;border-top:solid #000;padding-top:8%;}
	.consign div#formpage {border-top:unset;}
}
	
@media only screen and (max-width:1000px) {
	.contact.floating-section .flex.wrapper {flex-direction: column;padding-bottom: 40px;}
	a.header-button {max-width: 100%;margin: 0 auto;height: 185px;}
	.content.sec-2 {width: 90%;margin: 0 auto;}
	.four-buttons{position: relative;bottom: 130px;width: 100%;}
	.four-buttons .wrapper.flex {flex-wrap: wrap;}
	section.hero-image {height: 570px;}
	.about.sec-2 {padding-bottom: 30px;}
	.floating-section {margin: 13% auto 5% !important;}
	.floating-section .flex.wrapper {padding: 7% 0;}
	form.consign div#formpage{border-top:unset;}
	.button.flex, .buttons.flex {margin-top:unset;padding-top: 30px;}
	section.hero-image {background-position: 85%;height: 470px;}
	.four-buttons {position: relative;bottom: 90px;width: 100%;}
}


@media only screen and (max-width:800px) {
	.floating-section {margin: 0 auto 10% !important;}
	.texture-content {padding: 19% 0 19%;}
	.texture-section img {margin-bottom: -1px;width: 100%;height: 130px;object-fit: cover;}
	.texture-overlay img {height: 110px;object-fit: cover;}
}

@media only screen and (max-width:700px) {
	.form.flex {flex-direction: column;gap: 0px;}
	section.sub.hero-image {height: 230px;}
	.button-cat.flex img {max-width: 90px;}
	.footer-logo {width: 90%;margin: 0 auto;}
	.footer {padding: 10% 0;gap: 30px;}
	.hero-overlay .buttons.flex {margin-top: 30px;gap: 10px;flex-direction: column;}
	.button.flex {padding-top: 30px;}
	.button.flex,.buttons.flex {flex-direction: column;padding-top: 30px;gap: 13px;}
	.check-box.form.flex {gap: 10px;}
}


@media only screen and (max-width:500px) {
	.hero-overlay .wrapper.flex h1 {font-size: clamp(1.875rem, 1.6528rem + 1.1111vw, 2rem);line-height: 1;}
	.button.flex a.red-button button,.buttons.flex a.red-button button{margin-top:unset;max-width: 100%;}
	.hero-overlay .buttons.flex {margin-top:unset;}
	.floating-section .flex.wrapper {padding: 13% 0;}
	.footer-logo img {max-width: 200px;}
}






