﻿/***** 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=M+PLUS+1:wght@100..900&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;
}


a,button {cursor:pointer;}
/*-------- BODY STYLES --------*/

body {
	box-sizing:border-box;
	font-family: "M PLUS 1", sans-serif;
	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;}

.flex {display:flex;}

/*--- BUTTON STYLES ---------------------*/

a.white-border {width:100%;}
a.white-border button {background:transparent;border:#fff solid 4px;width:100%;color:#fff;padding:20px;text-transform:uppercase;font-weight:600;font-size: clamp(1rem, 0.973rem + 0.1351vw, 1.125rem);transition:.3s;}

a.white-border button:hover {border:#FBC03C solid 4px;color:#FBC03C;}
/*--- HEADER STYLES ---------------------*/
header {}

.background-pattern {background:url("/siteart/background-pattern.webp");aspect-ratio: 15/6;background-repeat: no-repeat;background-size: cover;}

.our-logo {display: flex;justify-content: center;width: 100%;height: 100%;align-items: center;top: 6%;position: relative;}

.our-logo .image {text-align: center;position: relative;z-index: 2;width: 100%;max-width: 25%;}

.image img{width:100%;height:100%;}

.title {flex:1;text-align:center;}
.button.flex {flex: 1;gap: 30px;}

.our-logo .circle {width: 100%;max-width: 27%;height: 65%;background: #fff;box-shadow: 0 0 15px #0005;border-radius: 100%;position: absolute;text-align: center;}

.our-logo {display: flex;justify-content: center;width: 100%;height: 100%;align-items: center;top: 8%;position: relative;}
/*---BODY--------------------------------*/

.bottom-buttoms {background: #7D1516;color: #fff;}
.bottom-buttoms .wrapper.flex {align-items: center;}

.button.flex {gap: 30px;padding: 0 4%;flex: 3;}

.title {padding: 60px 5%;border-right: solid;width: 100%;text-align: center;box-sizing: border-box;}

.title p {font-size: clamp(1.125rem, 0.8304rem + 1.5714vw, 2.5rem);font-weight:600;text-transform:uppercase;}

.auction-hero {box-sizing: border-box;}

/*--------FORM STYLES--------------------*/




/*-------- FOOTER STYLES ----------------*/
footer {position:relative;box-sizing: border-box;}

.white-overlay{position: absolute;background-image: linear-gradient(358deg, rgba(255,255, 255, 0.3), rgba(255, 255, 255, 0.8));z-index: 4;width: 100%;height: 100%;}

.footer {background:url("/siteart/background-pattern.webp");aspect-ratio:19;background-repeat: no-repeat;background-size: cover;box-sizing: border-box;}

.footer-content {position: relative;z-index: 4;display: flex;align-items: center;margin: 0 auto;width: 90%;}

.footer-logo {flex: 2;width: 100%;}

.footer-logo img {width: 100%;max-width: 80%;}

.footer-categories .top ul {display:flex;justify-content: space-between;}

.bottom {display:flex;justify-content:space-between;border-top: solid #7D1516 3px;padding-top: 15px;margin-top: 15px;}

.footer-categories {width: 60%;}

.footer-categories .top ul li a,.footer-categories p,.footer-categories a {color: #7D1516;font-weight: 800;font-family: "M PLUS 1", sans-serif;text-transform: uppercase;font-size: clamp(0.9375rem, 0.8973rem + 0.2143vw, 1.125rem);transition:.3s;}

.footer-categories .top ul li a:hover {box-shadow: inset 0 -5px 0 0 #7D1516;padding-bottom:5px;}
.footer-categories a i {transition:.3s;}
.footer-categories a i:hover {font-size:28px;color:#c72e30;}
.contact i{font-size: 25px;}
.contact {    display: flex;
    gap: 17px;}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/







/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 1600px) {
	.title {padding: 60px 2%;}
	.footer-categories {width: 70%;}
}
@media only screen and (max-width: 1280px) {
	.footer {aspect-ratio:unset;}
	.footer-content {flex-direction: column;text-align: center;}
	.footer-categories {width:90%;margin: 0 auto;}
	.footer-logo img {max-width: 28%;}
}
@media only screen and (max-width: 1100px) {
	.title {padding: 30px 5%;}
	.title p{font-size: clamp(1.0625rem, 0.8317rem + 1.1538vw, 1.625rem);}
	.background-pattern {aspect-ratio: 11/6;}
	.our-logo .image {max-width: 35%;}
	.our-logo .circle {max-width: 37%;height: 65%;}
	.our-logo {top: 8%;}
}

@media only screen and (max-width: 950px) {
	.bottom-buttoms .wrapper.flex {flex-direction: column;padding: 20px 0;width: 90%;margin: 0 auto;}
	.title {padding: 3% 3%;border-bottom: solid;border-right: 0;margin-bottom: 4%;}
	.footer-logo img {max-width: 48%;}
	.our-logo {top: 11%;}
	.button.flex {flex-direction: column;gap: 17px;width: 100%;}
	.footer-categories .top ul {flex-direction: column;gap:15px;}
	.bottom {flex-direction: column;gap:25px;}
	.footer-logo {text-align:center;}
	
	.bottom-buttoms {padding-bottom: 32px;}
	.footer-categories {text-align: left;}
}

@media only screen and (max-width: 800px) {
	.background-pattern {aspect-ratio: 8/6;}
	.our-logo .circle {max-width: 49%;height: 65%;}
	.our-logo .image {max-width: 45%;}
	.our-logo {top: 8%;}
	
}

@media only screen and (max-width: 600px) {
	.background-pattern {aspect-ratio: 5/6;}
	.our-logo .circle {max-width: 60vw;height: 60vw;}
	.our-logo .image {max-width: 55%;}
	.our-logo {top: 41px;}
	.title {padding: 3% 3% 5%;margin-bottom: 7%;}
}


@media only screen and (max-width: 400px) {
	.background-pattern {padding-top:80px !important;}
	.site-header-main {top: 90px !important;}
}






