﻿/***** 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;
}
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;
}

h1,h2,h3,h4,h5{font-family: 'Arvo', serif;}
/*-------- 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 ---------------------*/
.top-bar {    background: #000 !important;
    padding: 5px 0;
    text-transform: uppercase;
    font-weight: 700;
    color: #fff;
    text-align: center;
    font-family: 'Arvo', serif;
    font-size: 14px;
    line-height: 20px;}
.top-bar a {color: #fff;font-family: 'Arvo', serif;font-size: 14px;}

.wid90 {width: 90%; margin: 0 auto;}

.top-bar .wid90{display: flex; justify-content: space-between;    align-items: center;}

.top-bar .wid90 .top-txt{flex: 1;}
.top-bar a {transition: .3s all;}
.top-bar a:hover{color: #e6581d;}
.left-side{text-align: left;}
.middle-side {text-align: center;}
.right-side{text-align: right;}
.whitebutton {padding: 5px 10px;font-size: 15px;color: #fff !important;background: transparent !important;border: 2px solid #fff;font-weight: 700;transition: all 0.5s ease-out;text-transform: none !important;cursor: pointer;line-height: 1.5;}
.whitebutton:hover {
    background: #E6581D !important;
    border-color: #E6581D !important;
    color: #fff !important;
}

.main-header {background: #fff;box-shadow: rgb(0 0 0 / 7%) 0px 3px 6px, rgb(0 0 0 / 8%) 0px 0px 20px;}
.main-header .wid90{display: flex;align-items:center; justify-content: space-between;padding: 15px 0;gap: 40px;}
.left-nav, .nav-right {
    flex: 1;
}
.nav-right {display: flex; align-items: center; gap: 40px}

.left-nav nav.primary {text-align: left !important;}
.social-icons {display: flex; gap: 5px;}

.social-icons a {color: #000;font-size: 18px;margin: 0 3px;}

.logo img {max-width: 100%;width: 280px;}
.main-header a{transition: .3s all;}
.main-header a:hover {color: #e6581d !important;}
/*--- FOOTER STYLES ---------------------*/

.footer {background: #000;color: #fff;}
span.foot-title {font-size: 18px;font-weight: 800;text-transform: uppercase;color: #e6581d;font-family: 'Arvo', serif;}
.foot-container {display: flex;color: #fff;gap: 80px;justify-content: space-between;padding: 50px 0;flex-wrap: wrap-reverse !important;width: 90%; margin: 0 auto;}
.foot-col {flex:1;line-height: 24px;font-size: 16px;}
.foot-col ul {list-style: none;margin: 10px 0;padding: 0;line-height: 24px;
}
.foot-col a {color: #fff;transition: .3s all;line-height: 28px;}
.foot-col a:hover {color: #e6581d !important;}
.foot-col img {max-width: 100% !important;width: 250px !important;padding-bottom: 10px !important;}
.foot-col p {font-size: 13px;line-height: 16px;margin: 10px 0;}
.foot-col i {
    font-size: 30px;margin: 0 5px;
}
.foot-address p{margin: 10px 0 !important;color: #fff;font-size: 16px;
    line-height: 28px;}
/*----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
}
.hs-btn.hs-highlighted.checkout-full-hs-btn a {
    color: #fff !important;
}
/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 768px) {}
@media screen and (max-width: 1212px)  { 
	.left-nav {display: none;}	
	.main-header .wid90 {justify-content: space-between;}
	.nav-right {flex: none;}
	.logo img {width: 270px !important;}
	.social-icons a {
    font-size: 18px !important;
}
}
@media only screen and (max-width: 1200px) {
	.middle-side{display: none;}
}
@media only screen and (max-width: 1100px) {
	.foot-col:first-of-type {
    flex-basis: 100%;
    text-align: center;
}
	.foot-col {text-align: center;}
}
@media only screen and (max-width: 750px) {
	.foot-container{gap: 40px;}
	.foot-col{
    flex-basis: 100%;
    text-align: center;
}
}
@media only screen and (max-width: 500px) {
	.top-bar .wid90 .top-txt {
    flex-basis: 100%;
    text-align: center;
}
}
@media only screen and (max-width: 400px) {
	.main-header .wid90{flex-wrap:wrap;gap: 10px;}
	.main-header .wid90 .logo,.main-header .wid90 .nav-right{flex-basis: 100%;text-align: center;}
	.nav-right{flex-wrap:wrap;}
	.nav-right .mobile-menu,.nav-right .social-icons{flex-basis: 100%;justify-content: center;}
}
