﻿/***** BEGIN RESET *****/
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;
  font-family: 'Open Sans', sans-serif;
}
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 {}
a:link, a:visited, a:active {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
hr {
  border: #000 1px solid;
}
/*--- HEADER STYLES ---------------------*/

button{
  background-color: #ffc240;
  border: none;
}

button a{
  color: #252320 !important;
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  padding: 15px 30px;
}



.logo {
  max-width: 120px;
	width:100%;
  padding: 5px;
}
.logo img{width:100%;}

.nav-container {
  width: 100%;
}

.shop-home .page-header {
  position: static !important;
}

ul.dpdown-list.full-panel{
 
}

.full-panel i{
  scale: .50;
  -webkit-text-stroke: 2px black;
}

nav.primary ul li .full-panel-container a{
  background-color: transparent !important;
  color: #000;
  border-bottom: none;
  font-size: 24px;
  text-transform: uppercase;
  font-family: "Barlow Condensed", sans-serif;
}

nav.primary ul li .full-panel-container .preowned-container a{
 text-transform: capitalize !important;
 font-size: 18px;
}

nav.primary ul li .full-panel-container button{
  border: none;
  border-radius: 5px;
  background-color: #ffcb5f;
  width: 100%;
	font-size:16px!important;
  display: flex;
  justify-content: center;
 }
nav.primary ul li .full-panel-container button a{font-size:17px!important; text-transform:none!important;}
.small-links{
  font-weight: 400 !important;
  font-size: 18px !important;
  text-transform: capitalize !important;
  }

.tablink{
  display: flex !important;
  justify-content: space-between !important;
}

.tablink:active{
  background-color: #eee !important;
}

.full-panel-container:hover{
  background-color: transparent !important;
}

.full-panel{
  width: 100%;
	left:0;
	background-color: #fff;
	top: 180px;
  padding: 0 !important;
}

.full-panel-container{
  display: flex !important;
  gap: 25px;
  width: 1080px !important;
  margin: 0 auto !important;
}

.left-panel{
  width: 25%;
  border-right: 1px solid #eee;
}

.right-panel{
  width: 75%;
}

.preowned-container{
  display: flex;
  gap: 25px;
  margin: 25px 15px;
}

.preowned-left{
  width: 50%;
}

.preowned-right{
  width: 50%;
  border: 4px solid #e2e2e1;
  padding: 10px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.preowned-right a{
  padding: 0px !important;
}

.preowned-right span{
  font-size: 20px;
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 700;
}

.industry-container{
  display: flex;
  gap: 20%;
}

.industry-container img{ 
  width: 100%;
}

.col-3{
  display: 33.33%;
}

.industry-items{
  display: flex !important;
  flex-direction: column !important;
  align-items: center;
  gap: 15px;
}

.industry-items span{
  font-size: 18px;
  font-family: "Barlow Condensed", sans-serif;
  text-transform: capitalize;
}

.industry-items span i{
  font-size: 12px;
}

.new-container{
  display: flex !important;
  margin: 25px 15px;
}

.new-left a{
  font-size: 18px !important;
  text-transform: capitalize !important;
}

.new-right-image{
  width: 400px;
}

.new-right-image img{
 width: 100%;
 border-radius: 5px !important;
}

.new-item-links-container{
  display: grid;
  grid-template-rows: auto auto auto;
  grid-auto-flow: column;
}

.new-item-links-container a{
  font-size: 13px !important;
  text-transform: capitalize !important;
  font-weight: 600 !important;
}

.recently-added-container{
  display: flex !important;
  align-items: center;
  gap: 15px;
  font-size: 15px !important;
  padding: 0px;
  line-height: 24px !important;
}

.recently-added-container span{
color: #003dad;
font-size: 15px;
font-family: "Barlow", sans-serif !important;
}

.recently-added-container p{
  font-family: "Barlow", sans-serif;
  font-weight: 400;
  }

.recently-added-image{
  width: 70px;
  height: auto;
  object-fit: cover;
  overflow: hidden;
  border-radius: 5px;
}

.recently-added-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.parts-panel{
  align-items: flex-start;
}

.parts-left{
  display: flex;
  align-items: center;
  gap: 30px;
  border: 4px solid #e2e2e1;
  margin: 20px 20px 0;
  padding: 10px 20px;
  width:40%;
  font-size: 15px;
  font-family: "Barlow", sans-serif;
}


.title{
  font-family: "Barlow Condensed", sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 30px;
    color: #000;
    line-height: 1.2;
}

.parts-left-title{
display: flex;
justify-content: space-between;
flex-direction: column;
gap: 25px;
text-align: left;
}

.parts-left-image{
  width: 60%;
}

.parts-left-image img{
  width: 100%;
}

.parts-right{
  display: grid;
  grid-template-columns: auto auto;
}

.parts-right a{
  font-size: 18px !important;
  line-height: 40px !important;
  text-transform: capitalize !important;
}

/*-------- FOOTER STYLES ----------------*/
#hs-footer{
  background-color: #252320;
}

.footer {
  margin: 0 auto;
  background-color: #252320;
  display: flex;
  padding: 60px 30px;
  justify-content: space-between;
  gap: 25px;
  max-width: 1120px;
}

.footer-links{
  color: #ffc241 !important;
  display: flex;
  gap: 10px;
  font-size: 15px;
  flex-wrap: wrap;
}

.footer-links a{
  color: #ffc241 !important;
}

.store-hours-container{
  color: #fff;
  display: flex;
  justify-content: flex-start;
  gap: 25px;
}

.store-hours-container p{
  margin-top: 15px;
}

.store-hours-container>div{
  width: 50%;
}

.store-hours-container span{
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 25px;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 20px;
}

.social-media-container{
  display: flex;
  gap: 15px;
}

.fa-facebook-f{
  padding: 10px 13px !important;
}

.social-media-container i{
  background-color: #3f3b33;
  color: #ffc241;
  padding: 10px;
  border-radius: 5px;
  font-size: 15px;
}

.footer a, .footer p{
  font-family: "Barlow", sans-serif;
}

.footer-left{
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.footer-right{
  color: #908D84;
  font-family: "Barlow", sans-serif !important;
  white-space: nowrap;
  font-size: 15px;
}

#hs-outside-wrapper{
  margin-top: 184px;
}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.hs-btn.hs-highlighted,.table-pagination ul li.active {
	background: #000 !important;
	color: #fff !important;
}

.ProductsView .page-header,.page-header {
	position: static !important
}

/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 768px) {}

@media only screen and (max-width: 1119px){
  .footer{
    flex-direction: column;
    padding-bottom: 25px;
  }

  .store-hours-container{
    flex-direction: column;
  }

  .footer-right{
    margin-top: 30px;
  }

  .store-hours-container>div{
    width: inherit;
  }

}

@media only screen and (max-width: 1000px) {
  .logo {
    text-align: center;
  }
  .wrapper {
    display: block;
  }
  .nav-container {
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .wrapper {
    display: inline-flex;
    align-items: center;
  }
  .logo {
    text-align: left;
  }
  .logo-txt {
    margin-left: 0;
  }
  .nav-container {
    width: auto;
  }
}

  @media only screen and (max-width: 500px) {
    .header {
      width: 100%;
    }
  }

  
  @media only screen and (max-width: 442px) {
    .footer-right {
      white-space: wrap;
    }
  }