﻿/***** 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=Barlow: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=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&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 --------*/

body {
box-sizing:border-box;
font-family: "DM Sans", sans-serif;	
overflow-x: hidden;
font-style: normal;
line-height: 1.5;
}

.flex {display:flex;}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}
button,a {cursor: pointer;}

hr{border:#000 1px solid;}
h1,h2,h3,h4,h5,h6,.footer-title {font-family: "Barlow", sans-serif;text-transform:uppercase;}
button {text-transform: uppercase;}

.dropdown {display:none;}

a.red-button {width:100%;max-width: 250px;}
.page-button {width: 100%;}
form#myInput {display: none;}
.red-button button {padding:20px 15px;color:#fff;background:#DB0D0D;outline:none;border:none;width:100%;
border-radius:10px;font-weight:700;font-family: "Barlow", sans-serif;font-size:17px;}
.red-button button:hover,.submit input:hover,button.red-button.left:hover, button.red-button.right:hover {background:#9E0D0D;transition: ease-in-out .3s;}

button.red-button  {padding: 30px 15px;color: #fff;background: #DB0D0D;outline: none;border: none;width: 44%;border-radius: 0;font-weight: 700;font-family: "Barlow", sans-serif;font-size: 20px;}

button.red-button.left {border-radius: 20px 20px 0 0 !important;}
button.red-button.right {border-radius: 20px 20px 0 0 !important;}
.sub-hero-header {background:url("/siteart/location.png");background-repeat:no-repeat;}
/*--- HEADER STYLES ---------------------*/
header {}
form.search-bottom {display: flex;justify-content: center;gap: 20px;position: relative;}
.category-width {width: 100%;max-width:500px;text-align: center;}
.column3.last {position: absolute;right: 10%;top: 28%;}
.column3.last button {background:unset;border:none;font-size:20px;}
.main-site-header {background:#000;color:#fff;display: flex;}
.sub-hero-header {background: url("/siteart/location.png");background-repeat: no-repeat;background-color:#000;background-size: 100%;background-position: 0px 80%;padding: 90px 0;text-align: center;color:#fff;position:relative;}

.sub-header h1 {position: relative;z-index: 11;font-size: clamp(1.875rem, 1.6622rem + 1.0638vw, 3.125rem);}
.overlay {background: #000;position: absolute;width: 100%;height: 100%;opacity: 0.5;top: 0;border-radius: 10px;}
.sub-header .overlay {border-radius: unset;}
/*---BODY--------------------------------*/
.equipment-categories {
  background: #eee;
  padding: 50px 20px;
  text-align: center;
}

.equipment-categories h2 {
  color: #c0392b;
  font-size: 32px;
  margin-bottom: 20px;
}

/* Tabs */
.category-tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}

.category-tabs span {
  padding: 10px 0px;
  background: #666;
  color: #fff;
  margin: 0 auto;
  border-radius: 5px;
  cursor: pointer;
}

.category-tabs .active {
  background: #c0392b;
}

/* Grid */
.category-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0px;
  max-width: 1500px;
  margin: 0 auto;
}
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
.scrolling{
    width:100%;
    height:92px;
}

/* Items */
.cat-item {
  text-decoration: none;
  color: #000;
  text-align: center;
  transition: 0.3s;
  height: 170px;
  position: relative;
  margin-bottom: 80px;
  margin-top: 40px;
}

.cat-item img {
  max-width: 250px;
  max-height:135px;
  margin-bottom: 10px;
  filter: grayscale(100%);
  transition: 0.3s;
}

.cat-item span {
  display: block;
  font-size: 16px;
  text-align: center;
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(1.125rem, 1.1037rem + 0.1064vw, 1.25rem);
}

/* Hover effect */
.cat-item:hover img {
  filter: grayscale(0%);
  transform: scale(1.1);
}

.cat-item:hover span {
  color: #c0392b;
}

/*---INVENTORY CATEGORIES---------*/
.search {padding: 40px 0;background:#DB0D0D;}
section#inventory-categories .wrapper.flex {
  width: 95%;
  margin: 60px auto;
  display: grid;                  
  grid-template-columns: repeat(6, 1fr); 
  gap: 20px;
}
/* Desktop */
section#inventory-categories .wrapper.flex {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  row-gap: 80px;
  column-gap: 20px;
  margin-bottom: 110px;
}
@media (max-width: 1452px) {
  section#inventory-categories .wrapper.flex {
    grid-template-columns: repeat(4, 1fr);
  }
  .inv-cat {height: 180px!important;}
  .shape {height: 40px!important;}
}
/* Tablet */
@media (max-width: 1300px) {
  section#inventory-categories .wrapper.flex {
    grid-template-columns: repeat(4, 1fr);
  }
  .inv-cat {height: 180px!important;}
  .shape {height: 30px!important;}
}

/* Small tablet */
@media (max-width: 800px) {
  section#inventory-categories .wrapper.flex {
    grid-template-columns: repeat(3, 1fr);
  }
  .inv-cat {height: 180px!important;}
  .shape {font-size: 13px!important;height: 30px!important;}
}

/* Mobile */
@media (max-width: 500px) {
  section#inventory-categories .wrapper.flex {
    grid-template-columns: repeat(2, 1fr);}
	.inv-cat {height: 180px!important;}
	.shape {font-size: 10px!important;height: 30px!important;}
}
.inv-cat {height: 200px;position: relative;}
.inv-cat img {width: 80%; height: 80%; object-fit: contain; object-position: center!important;border-radius:10px;}
.inv-image {
    width: 100%;
    height: 100%;
    display: flex; 
    justify-content: center;  
    position: relative;
}
.inv-cat a {position: relative;}

.shape {    
    background: #000;
    width: 80%;
    background-repeat: no-repeat;
    position: relative;
    color: #fff;
    text-align: left;
    font-weight: 800;
    text-transform: uppercase;
    font-size: clamp(1.125rem, 1.1037rem + 0.1064vw, 1.25rem);
    padding: 20px 30px;
    bottom: 70px;
	border-radius: 0 190px 10px  76px;
    clip-path: polygon(0px 0px, calc(100% - 35px) 0px, 170.59% 96.00%, 0px 100%); height: 80px;    
    display: flex;
    align-items: center;}

/*---HOME ABOUT CATEGORIES---------*/
section#about-prev {background: #000;color:#fff;}
section#about-prev .flex.wrapper{justify-content: space-around;padding: 39px 0;}
.about-content {width: 39%;display: flex;flex-direction: column;justify-content: center;}
.about-content h1 {font-size: clamp(1.5625rem, 1.3497rem + 1.0638vw, 2.8125rem);margin-bottom:30px;line-height:1.1;}
.yellow {color:#FEEA2F;}
.about-us .wrapper.flex  {justify-content: space-between;}
.about-content p {margin-bottom:20px;}
.about-image img {max-width: 970px;}
.buttons.flex {gap:20px;padding-top:20px;}
.vision {width: 100%;max-width:500px;}
.sub-header p{position: relative;z-index: 1000;
    font-weight: 900;
    font-size: 17px;
    width: 40%;
    margin: 12px auto 0;}

.buttons-parts.flex {flex-direction:row !important;justify-content: start !important;gap:30px;margin-top: 30px;}
/*--------SERVICES STYLES--------------------*/
section#brands-we-work-with{width: 90%;margin: 0 auto;}
.button-center {width: 100%;text-align: center;display: flex;justify-content: center;}
.button-center a.red-button {margin-top:30px;max-width: 100%;}
#service-process {padding: 60px 0;}
.brand-examples .brand-cat{width: 140%;display: flex;}
.brand-examples {width: 49%;}

i.fa-solid.fa-square-check {font-size: 31px;color: #DB0D0D;}
section#services-we-provide {padding: 100px 0 140px;background: #000;color: #fff;display: flex;}
section#services-we-provide h2{font-size: clamp(1.25rem, 1.0372rem + 1.0638vw, 2.5rem);margin-bottom: 6px;}
section#brands-we-work-with {display: flex;flex-direction: column;align-items: center;}
section#brands-we-work-with {padding: 70px 0;}
section#brands-we-work-with h2{font-size: clamp(1.25rem, 1.0372rem + 1.0638vw, 2.5rem);margin-bottom: 3px;}
section#service-process {display: flex;justify-content: space-around;padding: 120px 0;background: #000;color: #fff;}
.process-cat {width: 100%;}
#service-process .flex{justify-content: center;max-width: 610px;flex-direction: column;}
.service-cat {width: 90%;margin: 0 auto;}
section#our-services {width:100%;}
section#services-we-provide ul{display: flex;gap: 56px;padding-top: 79px;flex-wrap: wrap;}
section#services-we-provide li{display: flex;align-items: center;gap: 14px;width: 30%;}
span.column {display: flex;flex-direction: column;}
.brand-examples {display:flex;justify-content: center;}
section#our-services {padding: 40px 0;text-align: center;background: #212121 !important;color: #fff;}

.process-cat li {margin-bottom:10px;}
.process-cat h2 {margin-bottom:10px;font-size: clamp(1.25rem, 1.1436rem + 0.5319vw, 1.875rem);}
.brand-examples .brand-cat img{width:100%;margin: 0 auto;}
.service-image img{width: 100%;max-width: 610px;}
.service-image {width: 30%;display: flex;align-items: center;justify-content: center;}

/*--------Search Form--------------*/
.search-back {
	width: 100%;
	background: linear-gradient(135deg, #1a1a1a 0%, #000000 100%);
	background-attachment: fixed;
	border: 2px solid #FEEA2F;
	border-radius: 16px;
	margin: 0 auto;
	margin-top: 30px;
}

.search-row {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 60px 0;
	gap: 20px;
}

.search-row h3 {
	font-size: 42px;
	width: 30%;
	text-transform: uppercase;
	color: #FEEA2F;
	font-weight: 800;
	letter-spacing: -1px;
	line-height: 1.1;
}

.search-row .formfield {
	width: 30%;
	flex: 1;
}

.input-wrapper {
	position: relative;
	display: flex;
	align-items: center;
}

.search-icon {
	position: absolute;
	left: 20px;
	width: 22px;
	height: 22px;
	color: rgba(255, 255, 255, 0.6);
	pointer-events: none;
	z-index: 1;
}

.search-row input[type="text"] {
	width: 100%;
	padding: 20px 20px 20px 54px;
	border: 2px solid rgba(255, 255, 255, 0.2);
	border-radius: 12px;
	box-shadow: none !important;
	color: #fff !important;
	background: rgba(255, 255, 255, 0.05) !important;
	font-size: 16px;
	transition: all 0.3s ease;
	backdrop-filter: blur(10px);
}

.search-row input[type="text"]:focus {
	outline: none;
	border-color: #FEEA2F;
	background: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 0 0 4px rgba(254, 234, 47, 0.2) !important;
}

.search-row input::placeholder {
	color: rgba(255, 255, 255, 0.5) !important;
}

.search-row button {
	padding: 20px 40px;
	height: 64px;
	background: #FEEA2F;
	border: none;
	border-radius: 12px;
	color: #000000;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
	transition: all 0.3s ease;
	white-space: nowrap;
	box-shadow: 0 4px 15px rgba(177, 38, 43, 0.3);
}

.search-row button:hover {
	background: #DBC600;
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(177, 38, 43, 0.4);
}

.search-row button:active {
	transform: translateY(0);
}

.width {
	max-width: 1600px;
	padding: 0 20px;
	box-sizing: border-box;
	margin: 0 auto;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.search-row {
		flex-direction: column;
		gap: 20px;
		padding: 40px 0;
	}
	
	.search-row h3,
	.search-row .formfield {
		width: 100%;
	}
	
	.search-row button {
		width: 100%;
	}
}

/*--------ABOUT STYLES--------------------*/
section#about-us {background: #000;color: #fff;}
#about-us .wrapper {width:90%;margin:0 auto;}
.history-image img {max-width: 350px;border-radius: 20px;}

.vision {width: 100%;background: #fff;padding: 60px 70px;box-shadow: 3px 2px 8px 2px #0002;position: relative;top: 23px;display: flex;flex-direction: column;justify-content: center;gap: 10px;}

.our-vision .gray-background{top:55%;}

.paragraph-content p {margin-bottom:15px;}
.paragraph-content {width: 48%;}
.history-sec.flex {align-items: center;justify-content: center;}
.history {padding: 50px 0 95px;}
.history-sec.flex {width: 90%;margin: 0 auto;}
#about-us .wrapper .flex {justify-content: space-around;}
.history-sec.flex {border-left: 6px solid #DB0D0D;position: relative;flex-direction: column;}
.link-line {position: absolute;background: red;padding: 3px;width: 2%;left: 0;top: 58%;}
.our-vision .flex{justify-content: space-around;padding: 110px 0 200px;}
.history h2,.sales-team h2 {font-size: clamp(1.5625rem, 1.3497rem + 1.0638vw, 2.8125rem);}

.page-button {width: 100%;display: flex;gap: 30px;position: relative;left: 0px;justify-content: center;}
.vision li {margin-bottom: 14px;list-style: circle;}

/*--------SALES TEAM STYLES--------------------*/
.wrapper.flex.sales
.sales-cat img {width:100%;max-width: 220px;}
.sales-team .wrapper.flex {width:90%;justify-content: space-between;margin:0 auto;flex-direction: column;padding: 53px 0 100px;gap: 40px;}
section#sales {background:#000;color:#fff;width: 100%;}
#sales {display:none;}
.sales-content {width: 100%;max-width: 750px;}
.sales-cat {display: flex;align-items: center;gap: 50px;width: 100%;}
.sales-content h3 {margin-bottom:10px;font-size:24px;}
.sales-content button{width: 40%;margin-top:20px;}
section#service-process {display: flex;justify-content: space-around;padding: 120px 0;background: #000;color: #fff;}
.process-cat {width: 100%;margin-top: 30px;}
.wrapper.flex.sales {padding: 20px 0;gap: 120px;}
/* Style the button that is used to open and close the collapsible content */
.collapsible {
  cursor: pointer;
  background:#000 !important;
  border: none;
  color:#fff !important;
  text-align: left;
  outline: none;
  font-weight:900 !important;
  padding: 40px 0 20px;
  width: 90%;
  font-size: clamp(1.0625rem, 0.9668rem + 0.4787vw, 1.625rem);
}

/* 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) */
.active, .collapsible:hover {
  background-color: #ccc;
}

.collapsible.top {padding:20px 0 20px !important;}

/* Style the collapsible content. Note: hidden by default */
.content {
  padding: 30px 18px;
	width: 90%;
	border-radius:20px;
  background:#212121 !important;
  overflow: hidden;
  background-color: #000;
}

.content.always-display {display:block !important;}

button.collapsible.active {
	transition:ease-in-out .4s;
}

.buttons.flex.employment {flex-direction: row !important;}

div.content .flex {align-items:center;}

/*--------FORM STYLES--------------------*/

.search select,.supplier-form select,.contact.form select,.supplier-form input,.contact.form input,.search input,.supplier-form textarea, .search textarea, .contact.form textarea {width:100%;padding:20px 10px;border-radius:10px;outline:unset;border:unset;box-sizing: border-box;}
.supplier-form form.search-bottom {flex-direction: column;}
.form-width {display: flex;}
.CaptchaPanel {text-align: left !important;}

/*--------BRAND SLIDER STYLES------------*/
.gray-background {background: #E9E9E9;position: absolute;width: 100%;height: 20%;top: 54%;z-index: -100;}
section#brands {position:relative;padding:100px 0;}
.brands-content {margin-bottom: 70px;text-align:center;}
.brands-content h2 {font-size: clamp(1.25rem, 1.0372rem + 1.0638vw, 2.5rem); font-weight:900;}
.brands-content p {font-size:19; font-weight:700;}
.form-width {display: flex;}
.CaptchaWhatsThisPanel a {color:#fff;}


/*--------BRANDS PAGE STYLES------------*/
section#brands-page {background:#000;padding: 110px 0;}
section#brands-page .wrapper.flex {display: flex;flex-wrap: wrap;justify-content: center;gap: 20px;}
section#brands-page .brand-slides {box-shadow: 3px 2px 8px 2px #0002;background: #fff;}
section#brands-page .brand-slides:hover,.inv-cat:hover {transform: scale(.9);transition: ease-in-out .3s;}

/*--------BECOME A SUPPLIER STYLES------------*/
section#become-a-supplier {background: #000;color: #ffff;padding: 100px 0;padding: 80px 0 120px;}
.supplier-form .form-width div {width: 100%;}
section#become-a-supplier .wrapper.flex{width: 90%; margin:0 auto;flex-direction:column;gap: 35px;}
.form-width {gap: 20px;display: flex;width: 100%;}

.submit input{padding: 16px 15px;color: #fff;background: #DB0D0D;outline: none;max-width: 330px;border: none;width: 100%;border-radius: 10px;font-weight: 700;font-family: "Barlow", sans-serif;font-size: 17px;}

.supplier-content {width:100%;max-width:600px;margin-bottom: 30px;}
.supplier-content h2 {font-size: clamp(1.5625rem, 1.3497rem + 1.0638vw, 2.8125rem);}
.supplier-form form {display: flex;flex-direction: column;gap: 30px;}

.supplier-form form input {margin-top: 10px !important;}

/*--------QUOTE STYLES------------*/
section.quote {background:url("../siteart/quote.png");height: 100% !important;width: 100%;padding: 3.2% 0;background-repeat: no-repeat;background-size: 100%;display: flex;}

.quote-content {margin: 0 auto;display: flex;flex-direction: column;align-items: end;}
.quote-content h3 {font-size: clamp(1.3125rem, 1.0997rem + 1.0638vw, 2.5625rem);}
.quote-content p {font-size: clamp(1.0625rem, 1.0306rem + 0.1596vw, 1.25rem);text-transform:uppercase;font-weight:900;}
#Contact-Us .wrapper.flex {gap: 40px;}
.form-width div {width:100%;}
.contact-section {padding: 30px 60px;align-items: center;display: flex;}

/*--------EMPLOYMENT STYLES------------*/
.employment-collapsible {
  background-color: #000;
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  margin:0 auto;
  border: none;
	text-transform:uppercase;
  text-align: left;
  outline: none;
	font-weight:600;
  font-size: clamp(1.0625rem, 0.9987rem + 0.3191vw, 1.4375rem);
}
.employment-content div h3{font-size: clamp(1.0625rem, 0.9668rem + 0.4787vw, 1.625rem);margin-bottom: 10px;font-weight: 900;}
.employment-image {width: unset !important;padding: 20px 0 !important;;}
.employment-image img{max-width:300px;box-shadow: 0 0 9px #0008;}
#employment {display: flex;justify-content: space-around;padding: 40px 0;background: #000;color: #fff;}
.employment-button {padding:30px 0 !important;}
.employment-button button{width: 50%;}
.employment-content div{width: 80%;padding: 120px 0;}

.employment-content {
    padding: 10px 18px 490px;
    max-height: 0;
    display: flex;
    justify-content: space-between;
    gap: 60px;
}


.open-positions h2 {font-size: clamp(1.5625rem, 1.3497rem + 1.0638vw, 2.8125rem);margin-bottom:40px;font-weight:900;}
.employment-collapsible.active {max-height:600px;}

section.open-positions {
	padding: 60px 0;
}
.wrapper.service {    
	width: 90%;
    margin: 0 auto;}

/*--------CONTACT US STYLES------------*/
#Contact-Us .wrapper.flex {justify-content: space-around;width: 90%;margin: 0 auto;}
section#Contact-Us {padding: 120px 0;}
.contact-information {padding: 30px;text-align: center;background:#DB0D0D;color:#fff;font-size:20px;font-weight:900;border-radius: 10px;}
.contact-section {padding: 30px 50px;background: #000;color: #fff;border-radius:10px;}
.contact.form form {display: flex;flex-direction: column;gap: 25px;}
.contact.form  input.hero-buttons {max-width:unset !important;}
.contact-title {display: flex;align-items: center;justify-content: space-between;margin-bottom: 10px;}
.contact-title {font-size:23px;}
.contact-title i {font-size:28px; color:#DB0D0D;}
.contact-section-map iframe {border-radius: 10px;}
.contact-title h2{font-size: clamp(1.5625rem, 1.4029rem + 0.7979vw, 2.5rem);}

/*-------- FOOTER STYLES ----------------*/
footer{}
.footer {background:#000;width:100%;}
.footer-logo {background: #000;flex: 1.1;display: flex;align-items: center;justify-content: center;}
.footer-logo img{max-width: 400px;}
.footer-categories.flex {flex: 3;display:flex;flex-direction: column;justify-content: center;}
.footer-links.flex,.footer-links.flex a,.footer-copyright p {color:#fff;} 
.footer-links {align-items:start;justify-content:space-around;padding:60px;}
.footer-title p{font-size: clamp(1.125rem, 1.0505rem + 0.3723vw, 1.5625rem);font-weight:700;margin-bottom:5%;}
.footer-copyright {padding: 30px 0;border-top: 2px solid #fff;text-align: center;text-transform:uppercase;font-weight:800;}
.footer-links li {margin-bottom:4%;font-weight: 600;}
ul.flex {gap:7%;width: 120%;}
ul.flex div {width:100%;}
.footer-cat i {color:#DB0D0D;}
.social i {font-size:25px;}
.social {display: flex;gap: 15px;margin-top: 10px;}
.hours-bottom {margin-top: 10px;}
span.time-title, span.time-title-bottom  {font-size: clamp(1.0625rem, 1.0306rem + 0.1596vw, 1.25rem);font-weight: 800;}
p.bold {font-weight:900;}

.contact-section-map {width: 60%;}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.ground-bcrumbs,.parts-title-and-breadcrumbs {padding-top: 40px !important;}
button.selected-facet.ts-button{background:#DB0D0D !important;}
a.view-listing-details-link.des-view-listingDetails.template-branded-button,.list-content .listing-widgets .Currency a {background:#DB0D0D !important;}
/*---------- RESPONSIVE STYLES ----------*/


@media only screen and (max-width: 1890px) {
	.our-vision .gray-background {top: 61%;}
	
	
}
@media only screen and (max-width: 1731px) {
	.our-vision .gray-background {top: 58%;}
	
}

@media only screen and (max-width: 1610px) {
	.column3.last {right: 2%;}
	.search {padding: 40px 20px;}
	
	
}

@media only screen and (max-width: 1523px) {
	.our-vision .gray-background {top: 61%;}
	.about-image img {max-width: 510px;}
	
}

@media only screen and (max-width: 1500px) {
	.shape {width: 70%;border-radius: 0 292px 10px  76px;font-size: 18px;}
}

@media only screen and (max-width: 1450px) {
	
	.inv-cat {height: 340px;}
	section#inventory-categories .wrapper.flex {justify-content: center;}
	
}


@media only screen and (max-width: 1386px) {
	.footer.flex{flex-direction: column;padding: 80px 0;}
	.vision {top:0;max-width: 410px;}
	
}

@media only screen and (max-width: 1300px) {
	.sales-cat {flex-direction: column;text-align: center;gap: 10px;}
	.wrapper.flex.sales .sales-cat img {max-width: 320px;}
	.shape {padding: 20px 28px 20px 13px;}
	section#inventory-categories .wrapper.flex {gap: 10px;}
	.inv-cat {height: 240px;}
}

@media only screen and (max-width: 1200px) {
	#Contact-Us .wrapper.flex {flex-direction: column;width: 100%;}
	.contact-section {justify-content: center;padding: 100px 50px;border-radius:0;}
	.serv-cat {width: 90%;}
	.service-image {display:none;}
	.form-width {flex-direction: column;}
	.contact.form {width: 100%;}
	.contact-section-map {    width: 90%;
    margin: 0 auto;
    height: 680px;
    padding: 30px 0;}
	.inv-cat {height: 300px;}
	.about-image img {max-width: 450px;}
	section#services-we-provide li {width: 47%;}
}

@media only screen and (max-width: 1209px) {
	section#inventory-categories .wrapper.flex {flex-wrap: wrap;}
}

@media only screen and (max-width: 1144px) {
	.vision {max-width: 300px;}
	.about-image img {display:none;}
	.about-content {width: 90%;}
}

@media only screen and (max-width: 1100px) {
	section#services-we-provide li {width: 100%;}
}

@media only screen and (max-width: 1000px) {
	.brand-examples {flex-direction: column;align-items: center;}
	.our-vision .gray-background {top: 75%;}
	section#services-we-provide ul {flex-direction: column;}
	section#services-we-provide li {width: 100%;}
	.contact .flex{gap: 30px;align-items: center;}
	.our-vision .flex {flex-direction: column;align-items: center;gap: 40px;}
	.employment-button button {width: 100%;}
	.vision {max-width: 70%;}
	.paragraph-content {width: 90%;}
	.about-image {display: none;}
	.footer-links {padding: 60px 10px;}
	section#Contact-Us {padding:unset;}
	.history-sec.flex {width: 100%;margin: 0 auto;}
	#about-us .wrapper .flex {flex-direction: column;}
	.inv-cat {height:unset;}
	section.quote {padding: 2.2% 0;background-size: 110%;}
	section.quote h3{font-size: 20px !important;}
}

@media only screen and (max-width: 900px) {
	.form-width{flex-direction: column;}
	.sales-content button {width: 100%;}
	section#about-prev .flex.wrapper {padding: 89px 0;}
	.footer-links.flex {flex-direction:column;gap:30px}
	.page-button {flex-direction:column;gap: 9px;}
	.employment-image {margin: 0 auto;}
	.employment-content div {margin: 0 auto;width: 100%;padding: unset;}
	.employment-content {flex-direction: column;max-height: 960px;padding: unset;gap: 20px;}
	.search  {padding: 40px 10px;}
	.contact-title {flex-direction: column;align-items: start;margin-bottom: 40px;}
	.contact-section {justify-content: center;padding: 50px 30px;border-radius: 0;margin: 0 auto;width: unset;}
	button.red-button.left,button.red-button.right {border-radius:unset !important;}
}

@media only screen and (max-width: 767px) {
	.wrapper.flex.sales .sales-cat img {max-width: 210px;}
	.history-sec.flex {border-left:unset;}
	.link-line {display:none;}
	.page-button button.red-button {width: 100%;border-radius:unset;}
	section#brands-page .brand-slides {width: 90%;text-align: center;}
	.vision {padding: 60px 10%;}
	.employment-collapsible {width: 90%;}
	.quote-content {margin: 0 auto;display: flex;flex-direction: column;
    align-items: end;width: 90%;text-align: center;}
	section.quote {padding: 4.2% 0;background-size: 350%;}
	.quote-content p {width: 100%;text-align: center;margin-top:5px;}
}

@media only screen and (max-width: 500px) {
	.buttons-parts.flex {flex-direction:column !important;gap:15px;}
	.buttons-parts.flex a.red-button{max-width: unset;}
	.buttons.flex {flex-direction: column;}
	.history-image img {max-width: 240px;}
	.paragraph-content {margin-bottom: 20px;}
	.buttons.flex a.red-button {width: 100%;max-width: unset;}
	section#brands .brand-slides {width:90%;text-align: center;margin: 0 auto;}
	.dropdown {display:flex;background:#DB0D0D;justify-content: center;padding: 15px 0;}
	
	.search {display:none;}
	
	button.dropbtn {background: unset;border: unset;font-size: 21px;color: #fff;}
	
	myInput {box-sizing: border-box;background-image: url('searchicon.png');background: #000;background-position: 14px 12px;background-repeat: no-repeat;font-size: 16px;padding: 14px 20px 12px 45px;margin: 0 auto;}

	select#Category,select#Manufacturer,input#keywords {width: 90%;margin: 0 auto;padding: 11px 10px;box-sizing: border-box;border: unset !important;border-radius: 7px;}
	
	.column3.last {position: relative;margin: 0 auto;text-align: center;width: 90%;background: #FFF;border-radius:10px;}
	.column3.last {right:Unset;}
	#myInput:focus {outline: 3px solid #ddd;width: 100%;right: unset !important;top: unset !important;color:#fff;}
	.column3.last button {padding: 13px 0;border-radius:10px;}

	.dropdown {
	  position: relative;
	  display: inline-block;
		width:100%;
		text-align: center;
	}

	.dropdown-content {
	  display: none;
	  position: absolute;
	  background:#af0c0c;
	  width: 100%;
	  top: unset;
	  padding: 40px 0;
	  overflow: auto;
	  z-index: 99999999999;
	}

	.dropdown-content a {
	  color: black;
	  padding: 12px 16px;
	  text-decoration: none;
	  display: block;
	}

	.dropdown a:hover {background-color: #ddd;}

	.show {display: block;}
	
	form#myInput{display: flex;flex-direction: column;gap: 22px;}
	
	.inv-cat {height: 273px;}
	section#inventory-categories .wrapper.flex {width: 90%;margin: 30px auto;gap: 20px;justify-content: center;}
	.slick-prev, .slick-next {width: 40px;}
	.footer-logo img {max-width: 90%;}
	.shape {width: 70%;}
}
@media only screen and (max-width: 400px) {
	.sub-header {height:unset;}
	.sub-hero-header {padding: 70px 0;}
	.our-vision .flex {padding: 60px 0 90px;}
}



