/* CUSTOM CSS: Covington 2018 */
/* Bootstrap in use */

html, body {
	font-family: "Lato", "Helvetica Neue", Arial, sans-serif !important;
	font-size: 14px;
	line-height: 18px;
	background-color: #ffffff;
	
}

@media (min-width: 576px) {
	.container { max-width: 1280px; }
}

h1, h2, h3, h4, h5, h6 { font-weight: 600; color: #000000; }
h1 { font-size: 32px; line-height: 30px; text-transform: uppercase; }
h2 { font-size: 22px; line-height: 30px; text-transform: uppercase; }
h3 { font-size: 20px; line-height: 26px; text-transform: capitalize; }
h4 { font-size: 18px; line-height: 24px; text-transform: capitalize; }
h5 { font-size: 14px; line-height: 22px; text-transform: uppercase;  }
h6 { font-size: 12px; line-height: 16px; font-weight: 400; }

p { 
	font-size: 16px;
	line-height: 24px;
	color: #000000;
}

.body { 
	font-size: 14px !important;
	text-transform: none;
	font-weight:normal;
}

@media (max-width: 766px) {
	h1 { font-size: 28px; line-height: 30px; }
	h2 { font-size: 18px; line-height: 22px; }
	h3 { font-size: 16px; line-height: 18px; }
	h4 { font-size: 14px; line-height: 16px; }
	h5 { font-size: 12px; line-height: 14px; }
	h6 { font-size: 10px; line-height: 12px; }
	html, body, p { font-size: 14px; line-height: 18px; }
}
@media (max-width: 322px) {
	h5,h6,html,body,p,.body{ font-size: .9em; line-height: 1.25em; }
}

strong, b { font-weight: 700; }

.large { 
	font-size: 16px !important;
	line-height: 22px;
	font-weight: 700;
	color: #000000;
}
.larger { 
	font-size: 18px !important;
	line-height: 22px;
	font-weight: 700;
	color: #000000;
}

.small, small { 
	font-size: 12px;
	line-height: 16px;
	font-weight: 400;
	color: #000000;
	text-transform: none;
}
.redCopy { 
	font-size: 12px !important;
	line-height: 14px !important;
	color: #982a1d;
}

.redCopySmall { 
	font-size: 11px !important;
	line-height: 12px !important;
	color: #982a1d;
}

.marginLeft, .ml-1 { margin-left: 15px !important; }
.pt-1 { padding-top: 15px !important; }
@media (min-width: 768px) {
	.pt-md-1 { padding-top: 15px !important; }
}

a {
	font-weight: 700;
	line-height: 18px;
	color: #982a1d;
	text-decoration: none;
}

a:link, a:visited, a:active {
	color: #982a1d;
	text-decoration: none;
}

a:hover {
	color: #982a1d;
	text-decoration: underline;
}
a.gray {
	color:#333333;
	font-weight:500;
}

a.nolink { color:#000000; }
a.nolink:hover, a.nolink:link, a.nolink:visited, a.nolink:active { color:#000000; text-decoration: none; }

/* FORMS & INPUTS */

form p { margin-bottom: 1.5rem; }

input[type="submit"], input.btn, button.btn, a.btn {
	width:auto;
	min-width: 180px;
	border:#707070 1px solid;
	padding:5px 50px;
	background-color:#972A1D;
	font-family: "Lato", "Helvetica Neue", Arial, sans-serif !important;
	font-size: 14px;
	font-weight:600;
	text-transform: uppercase;
	color:#fff;
	cursor: pointer;
	text-align: center;
	-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
}
input[type="submit"]:hover, input.btn:hover, button.btn:hover, a.btn:hover { border:#000 1px solid; text-decoration: underline; color:#fff; }

input.btn.small, button.btn.small, a.btn.small {
	font-size: 13px;
	padding:4px 24px;
	min-width: 120px;
	text-transform: none;
}

input.btnAlt, button.btnAlt, a.btnAlt {
	width:auto;
	min-width: 180px;
	border:#972A1D 2px solid;
	padding:10px 50px;
	background-color:#ffffff;
	font-family: "Lato", "Helvetica Neue", Arial, sans-serif !important;
	font-size: 16px;
	font-weight:600;
	text-transform: uppercase;
	color:#972A1D;
	cursor: pointer;
	text-align: center;
	-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
}
input.btnAlt:hover, button.btnAlt:hover, a.btnAlt:hover { border:#333 2px solid; text-decoration: underline; color:#000; }

input.btn.secondary, button.btn.secondary, a.btn.secondary  { background-color:#9ba032; padding:10px; }
/* input.btn.secondary:hover { background-color: #bbc761; } */

@media (max-width: 575px) {
	input[type="submit"], input.btn, button.btn, a.btn, input.btnAlt, button.btnAlt, a.btnAlt, input.btn.secondary, button.btn.secondary, a.btn.secondary  { min-width:inherit; padding: 5px; }
}

input[type="text"] {
	padding:5px;
	border:#ced4da 1px solid;
}

.form-check label { margin:5px 10px; }
.form-check label:first-of-type { margin-left: 0; }

.form-group.required label:after { 
	content:"*";
	color:#cc0000;
	padding-left:5px;
}
span.required { color:#cc0000; padding-left:5px; }

.custom-file { margin-bottom:1rem; }
.form-button { margin-top:5px; }
.form-inline label { margin-right: 15px; }

/* courtesty of https://stackoverflow.com/questions/45327086/how-change-the-color-of-the-radio-button */
input[type="radio"], input[type="checkbox"] {
  /* remove standard background appearance */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* create custom radiobutton appearance */
  display: inline-block;
  width: 18px;
  height: 18px;
  padding: 2px;
  vertical-align: middle;
  /* background-color only for content */
  background-clip: content-box;
  border: 2px solid #7f8280;
  background-color: #e7e6e7;
  margin-right: 5px;
}
input[type="radio"] { border-radius: 50%; }
/* appearance for checked radiobutton */
input[type="radio"]:checked, input[type="checkbox"]:checked { background-color: #972A1D; }


/* TABLES */

th { background-color: #CCCCCC; font-size:16px; }
#summary { text-align: center; background-color: #F5F4EE; font-weight:bold; font-style:italic; border-top:#999999 1px solid; border-bottom:#999999 1px solid; font-size:15px; }

/* HEADER */

header {
	padding:10px 0;
}

header #logo {
	max-width:250px;
}

/* NAV */

#topNavSub a {
	color:#333;
	margin:0 10px;
	text-transform: uppercase;
	font-size:12px;
}
#topNavSub a:first-child { margin:0 10px 0 0; }
#topNavSub a:last-child { margin:0 0 0 10px; }

#topNav { 
	padding-top: 15px;
}
#topNav a { 
	margin-left: 20px;
	text-transform: uppercase;
}
#advancedSearch { color:#982a1d; }

nav {
	margin:5px 0;
}
nav a.nav-top {
	width:auto;
	color:#010101;
	font-size:16px;
	font-weight:700;
	text-transform: uppercase;
	letter-spacing: .05em;
	margin:0 35px;
	border-bottom: 5px solid #ffffff;
	z-index:999;
}
nav a.nav-top:first-child { margin: 0 35px 0 0; }
nav a.nav-top:last-child { margin: 0 0 0 35px; }
nav a.nav-top.noMenu { margin:0 35px 0 0 !important; }

nav a.nav-top:hover {
	border-bottom: 4px solid #972A1D;
	text-decoration: none !important;
}

nav a.nav-link, div.nav-link-image {
	width:auto;
	color:#010101;
	font-size:16px;
	font-weight:700;
	text-transform: uppercase;
	letter-spacing: .05em;
	margin:0 25px;
	padding:5px 0;
}
.nav-image {
	max-width: 165px;
	max-height: 122px;	
}

nav a.nav-link:hover, nav a.nav-link:active { text-decoration: underline; }
div.nav-link-image { 
	margin:0;
	width:164px !important;
}

/* MOBILE MENU */

#mobileMenu { padding:0 0 .2rem 0; }
#mobileMenu a, #mobileMenu a:hover { color:#333; text-decoration: none; }
#mobileMenu li.primary { background-color: #E4E1D9; font-weight:bold; padding:4px 0; border-bottom: #C3C3C3 1px solid; }
#mobileMenu li.secondary { padding:2px 0; border-bottom: #C3C3C3 1px solid; }
#mobileMenu .secondary a { font-size:14px; }
#mobileMenu a.nav-link:active, #mobileMenu a.nav-link:hover { text-decoration: underline; }

/* MEGA MENUS */

/* shows the dropdown menu on hover */
.navbar .dropdown:hover .dropdown-menu, .navbar .dropdown .dropdown-menu:hover {
	display:block!important;
}

/* adds some margin below the link sets  */
.navbar .dropdown-menu div[class*="col"] {
   margin-bottom:10px;
}

.mega li a, .mega a:hover, div.nav-link-image { color:#333; font-size:12px; }

/* breakpoint and up - mega dropdown styles */
@media screen and (min-width: 992px) {
  
	.navbar .dropdown-menu {
		width:100%;
		left:0;
		right:0;
		/*  height of nav-item  */
		top:45px; /* position of mega menu */
		background-color: #fff;;
		border:none;
		padding-top: 20px; /* top of mega menu area */
	}

	/* remove the padding from the navbar so the dropdown hover state is not broken */
	.navbar {
		padding-top:-5px;
		padding-bottom:0px;
	}

	/* remove the padding from the nav-item and add some margin to give some breathing room on hovers */
	.navbar .nav-item {
		padding:.5rem .5rem;
		margin:0 .25rem;
	}

	/* makes the dropdown full width  */
	.navbar .dropdown { position:static; }
	
	/* mega specs */
	.mega .nav-item { padding:0; }
	.mega { z-index:99; }
	.mega img { margin-right: 15px; }
}


/* MAIN / CONTENT / BODY */

.breadcrumb {
	background-color: transparent;
	font-size:12px;
	color:#333;
	padding:15px 0;
}
.breadcrumb-item+.breadcrumb-item::before {
	content: ">";
}
.breadcrumb a { color:#333; font-weight: normal; }


main {
	background-color: #f6f4ed;
	padding:15px 0 60px;
}

.content, .contentSmall {
	box-shadow: .20rem .35rem .35rem rgba(0,0,0,.12) !important;
	background-color:#fff;
	padding:40px;
}
.content h1, .contentSmall h1 { margin-bottom: 30px; }
@media (max-width: 575.98px) { 
	.content { padding:20px; }
	.content h1 { margin-bottom: 10px; }
}



.card {
	background-color: #F5F4EE;
	padding:20px 30px;
	border:none;
	border-radius: 0;
}

.boxTan { 
	background-color: #F5F4EE;
	padding:20px 30px;
	max-width:48%; margin:0 1%; 
}
@media (max-width: 766px) { 
	.boxTan { max-width:96%; margin:0 2%; padding:10px 15px; } 
}

hr { border-top: #B7B7B7 1px solid; }

.lastUpdated {
	display:inline;
	float:right;
	font-size:11px;
	color:#777;
	font-family: Georgia, serif;
	font-weight:600;
	margin:10px 0 10px 10px;
}
@media (max-width: 766px) { 
	.lastUpdated { display:block; float:none; margin:0; }
}

/* PRODUCTS */
.addToCart_wrap { position: relative; max-width:164px; }
.addToCart_check { visibility:hidden; position: absolute; bottom: 0; left: 0;  }
.addToCart_icon i { 
    font-size:220%;
    color:#972b24;
    position: absolute; top: 8px; right: 5px; 
}

.product span { display:block; color: #666666; font-size:14px; line-height: 18px; font-weight:bold; }
.product img { background-image: url('/images/_LOADING_TN.jpg'); width:164px; height:122px; margin-bottom: 6px; }
.product a, .product h4 { font-size:16px; color: #000000; white-space: nowrap; width:164px; overflow: hidden; text-overflow: ellipsis; }
.product h4 { line-height: 20px; }
.product h6 { margin-top: 8px; }
@media (min-width: 576px) { 
	.product { margin:15px 15px 15px 0; }
    .products { margin-right:-15px; }
}
@media (max-width: 575px) { 
	.products { justify-content: space-between !important;  }
	.product {
		width:48%;
		display:inline-block;
		margin:0 0 10px 0;
	}
	.product img { width:100%; max-width: 164px; }
	.product a, .product h4 { width:100%; }
}

#social a:hover { color:#666; }



/* FOOTER */

footer {
	padding:30px 0;
}

footer #footerLogo {
	max-width:160px;
}

@media (max-width: 575px) { 
	#footerSummary { padding:40px 20px; }
	#footerContact { padding:20px 0 0; }
}

#subscriber {
	padding-left:30px;
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	font-size:12px;
}
#subscribe {
	background-color: #9E0B0F;
	font-size:13px;
    border-radius: 18px;
    padding:10px;
    width:220px;
}

#getSocial i { margin-left: 15px; }
#getSocial .red:hover { color:#666666; }

#footerCopyright a { margin:0 15px; color:#333333; font-weight:400; }
#footerCopyright a:last-child { margin:0 0 0 15px; }
@media (max-width: 991px) {
	#footerCopyright .text-right { text-align: left !important; }
	#footerCopyright a:first-child { margin:0 15px 0 0; }
}
@media (max-width: 766px) {
	#footerCopyright a { font-size:11px; }
}


/* DROP CART */
/* rollover / click handled by jquery in footer */

#dropCart {
    width:320px;
    height: auto;
    max-height: 640px;
    overflow-y: scroll;
    border: #c7c7c7 1.5px solid;
    border-top: #972A1D 8px solid;
    background-color: #fff;
    padding:20px 10px 10px 12px;
    position:absolute;
    top:40px; right:15px;
    z-index: 9999999;
    text-align: left;
    display: none;
}
#dropCart .row { margin-bottom: .7em; }
#dropCart p {
    font-size: 14px;
    line-height: 16px;
}
#dropCart .item { text-transform: uppercase; font-weight: bold;  }
#dropCart .btn { margin:0; width:100%; }


/* ECOMM */

input.qty_text { display: inline-block; width: 40px; text-align: center;  }


/* SPECIAL */

.ui-datepicker { z-index: 1051 !important; }
.input-group-prepend { height: 42px; }

.fa { margin-right:7px; vertical-align:baseline; }
.fa.tipIcon { font-size:120% !important; margin-left:4px; vertical-align:baseline; }

.green { color: #006600; }
.red { color: #972b24; }
.redBack { background-color: #972b24 !important; }
.gray { color:#333333 !important; }
.grayLight { color: #777777; }
.black { color:#000 !important; }
.highlightYellow { background-color: #FFFED1; }
.redMA, a.redMA, .redMA a, .redMA span { color:#850303 !important; } 

.bigger { font-size:1.25em; }
.underline a { text-decoration: underline; }
.bold { font-weight: bold !important; }
.nobold { font-weight: normal !important; }


.redBack { background-color:#F9E6E3; padding:4px 8px;  }
.greenBack { background-color:#EDFDED; padding:4px 8px; }
.grayBack { background-color:#ccc; padding:4px 8px;  }

.devNote {
    color: #982a1d;
    background-color:#FFF5F5;
}
.betaTag { color:#cc0000; font-size:50%; margin-left:6px; letter-spacing:.01em; font-weight:bold; position:relative; top:-16px; text-transform:uppercase; }

#topAlert {
	background-color:#fb5855;
	padding:14px;
	text-align: center;
	color:#ffffff;
	border-bottom:#b8b9b8 1px solid;
	font-size:16px;
	text-transform:uppercase;
	margin:-10px 0 10px;
}
#topAlert a { color:#ffffff !important; }
#topNewsClose { margin-left:100px; font-size:125%; vertical-align: -1px; }

@media (max-width: 799.98px) { 
	#topAlert {
		padding:4px;
		font-size:12px;
	}
	#topNewsClose { margin-left:10px; }
}