/* 
	Colors:
	#c2ff9f; //green lighter
	#5dff00; //green light
	#55c614; //green
	#37840b; //green dark
	#0c6100; //green dark-2
	#13380e; //green dark-3
	#042000; //green darkest
*/

:root {
	--light: #c7dabb;
	--green-lighter: #c2ff9f;
	--green-light: #5dff00;
	--green: #55c614;
	--green-2: #439f0e;
	--green-dark: #37840b;
	--green-dark-2: #0c6100;
	--green-dark-3: #13380e;
	--green-darkest: #042000;
	--red-light: #ff767f;
	--red-lighter: #ffd2d5;
	--red-logo: #a31d26;
}

html {
  width: 100%;
  height: 100%;
  min-width: 360px;
  font-size: 16px;
}

body {
  font-family: 'Open Sans', Arial, sans-serif;
  font-weight: 400;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #222222;
  color:#000;
}

a, button { transition: all 0.3s ease-in; }
a:hover, button:hover { transition: all 0.15s ease; }

a {
  color: #a31d26;
}
a img {
	display:block;
	-webkit-backface-visibility: hidden;
	transition: opacity .3s ease-in;
}
a:hover img { opacity: 0.6; transition: opacity 0.2s ease; }

a:focus, a:hover {
  text-decoration: underline;
  color: #ff767f;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Open Sans', Arial, sans-serif;
  margin: 0 0 1rem;
  font-weight: 700;
}
h1, h2, h3 { font-weight: 300; }
h2, h1, p.h1, p.h2, .content-section p.h1, .content-section p.h2 {
	font-size: 2rem;
}
h3, p.h3, .content-section p.h3 { font-size: 1.5rem; }
h3.second, h4,h5,h6, p.h4, .content-section p.h4, p.h5, .content-section p.h5, p.h6, .content-section p.h6 { text-transform:uppercase; letter-spacing: 3px; }
h4, p.h4, .content-section p.h4 { font-size: 1.25rem; margin-bottom: 1em; }
h5, p.h5, .content-section p.h5 { font-size: 1.125rem; margin-bottom: 1rem; }
h6, p.h6, .content-section p.h6 { font-size: 1rem; }
p {
  font-size: 1rem;
  line-height: 1.5;
  margin: 0 0 25px;
  text-align:left;
}

.pages-content ul, .pages-content ol { padding-left: 30px; margin-bottom: 25px; line-height: 1.5; }
.pages-content ul li { list-style: circle; }
.pages-content ol li { list-style: decimal; }
.pages-content h4 { font-size: 1.1rem;}
.pages-content h3 { font-size: 1.7rem; margin-bottom: 1.5rem; font-weight: 600;}
.pages-content h5 { font-size: 1rem;}

.bg-light { background-color:#eee !important; }
.bg-white { background-color:#fff; }
.bg-dark { background-color:#222 !important; }
.bg-grey { background-color:#ccc; }
.bg-red { background: #55c614; }
.bg-green { background: #5dff00; }
.bg-green-lighter { background: #c2ff9f; }
.bg-green-light { background: #5dff00; }
.bg-green { background: #55c614; }
.bg-green-dark { background: #37840b; }
.bg-green-dark-2 { background: #0c6100; }
.bg-green-dark-3 { background: #13380e; }
.bg-green-darkest { background: #042000; }
.bg-green-gradient-1 { background: #37840b; background: linear-gradient(90deg, rgba(67,159,14,1) 0%, rgba(85,198,20,1) 100%); }
.bg-green-gradient-2 { background: #37840b; background: linear-gradient(-90deg, rgba(67,159,14,1) 0%, rgba(85,198,20,1) 100%); }
.bg-green-gradient-3 { background: #0c6100; background: linear-gradient(0deg, #37840b 0%, #0c6100 100%); }
.bg-light-gradient { background: #eee; background: linear-gradient(0deg, #fff 0%, #eee 100%); }
.bg-black-5 { background: rgba(0,0,0,0.05); }
.bg-black-10 { background: rgba(0,0,0,0.1); }
.bg-black-80 { background: rgba(0,0,0,0.8); }
.bg-green-dark-80 { background: rgba(4,32,0,0.8); }
.bg-green-dark-90 { background: rgba(4,32,0,0.9); }

.table-dark .border,
.table-dark .border-top,
.table-dark .border-bottom,
.table-dark .border-left,
.table-dark .border-right {
	border-color: #4e555d !important;
}

.text-light { color:#eee !important; }
.text-red-light { color:#ff767f; }
.text-red-lighter { color:#ffd2d5; }
.text-green { color: #5dff00; }
.text-green-lighter { color: #c2ff9f; }
.text-green-light { color: #5dff00; }
.text-green { color: #55c614; }
.text-green-dark { color: #37840b; }
.text-green-dark-2 { color: #0c6100; }
.text-green-dark-3 { color: #13380e; }
.text-green-darkest { color: #042000; }
.text-yellow { color: #ffc107; }

.error { color:#f00; }
.alert.alert-compact { padding: .5rem 1rem; }
.alert.alert-warning { border-color:#e0cf9b;}
.alert.alert-success {
	color: #003e0e;
    background-color: #c2ff9f;
    border-color: #80bd5c;
}

.fa { min-width: 17px; margin-right: 5px; }
.transparent {  opacity: 0.1; }

.text-muted { color:#b5bdc3 !important; }

.nav-separator { width: 20px;}

.border-1 { border-width: 1px !important; }
.border-2 { border-width: 2px !important; }
.border-3 { border-width: 3px !important; }

.gmap {
  /* background: url(../img/.png) center center no-repeat; */
  height: 304px;
}
.gmap a { display:block; width: 100%; height: 304px; }

.modal-body-full { padding: 0 1px !important; }
.modal hr { border-color: #eee; }
.modal .modal-body ul { padding-left: 25px; }
.modal { padding-right: 0px !important; padding-left: 0px !important; }

.invisible { opacity: 0; }
.visible { opacity: 1; }

.text-underline { border-bottom: 1px solid #eee;}
.label-style { text-transform:uppercase; letter-spacing: 2px; color:#84929c; font-size: 18px; }

footer {
	font-size: 0.875rem;
	padding: 50px 0;
}
footer li a { color:#007bff !important; line-height: 2; text-transform:uppercase; }

footer p {
  font-size: 12px;
  margin: 0;
}

.masthead { padding: 1rem 0 !important; }
#searchFormContent input { width: 100%; border-color: rgba(0,0,0, 0.2); }
.bg-header-image { background: #fff url(../img/uploads/header/02.jpg) center center no-repeat; background-size: cover; }
.logo-link { }
.logo-link img { width: auto; max-width: 100%; }
.intro-text { position: absolute; top: 50%; left: 50%; width: 100%; height: auto; transform: translate(-50%, -50%); z-index: 99; font-size: 100px; text-align:center; line-height: 1; color:#fff; font-weight: 700; text-shadow: 3px 3px 10px rgba(0,0,0, 0.5);}

#navToggle { display: none; }

/* ******************** */
/* MainNav */
/* ******************** */
nav ul {
	padding: 0 !important;
}
nav ul li {
	position:relative;
}
#mainNav a.nav-link,
#mobileNav a.nav-link,
#brand .sub-nav a.nav-link {  
	color: #000;
	text-decoration:none;
	padding: 3px 15px !important;
	font-weight: 500;
	font-size: 16px;
	letter-spacing: 0px;
	background: transparent;
	text-transform: uppercase;
	border: 1px solid transparent;
	border-radius: 8px;
	white-space: nowrap;
}
.pre-white #mainNav a.nav-link { color: rgba(0,0,0, 1); }

#mainNav li.nav-item:hover a.nav-link,
#mainNav li.nav-item a.nav-link.active {  
	background: #a31d26;
	color: rgba(255,255,255, 1);
	border-color: rgba(255,255,255, 0);
	text-decoration:none;
}
.pre-white #mainNav li.nav-item:hover a.nav-link,
.pre-white #mainNav a.nav-link.active { color: rgba(255,255,255, 1); border-color:rgba(255,255,255, 0); }

/* ******************** */
/* Mobile Nav - fullscreen - megafruct and knvisions */
/* ******************** */
#mobileNavWrapper { position: fixed; top:0; left: 0; display:block; width: 100%; height: 0; overflow:hidden; z-index: 999; background: #222; color:#fff; opacity: 0;}
#mobileNavWrapper.show-nav { height: 100vh; opacity: 1; }
#mobileNav { width: 60%; margin: 0 auto; }
#mobileNav a.nav-link {
	padding: .75rem 1rem !important; 
	width: 100%;
	font-size: 20px;
	line-height: 1.5;
	letter-spacing: 1px;
	text-transform: uppercase;
	background: transparent;
	color: #fff;
	border-bottom: 1px solid rgba(255,255,255, 0.25);
}
#mobileNav a.nav-link:hover,
#mobileNav a.nav-link.active {  
	background: #fff;
	color: #000;
	text-decoration:none;
}

/* nav toggle */
#navToggle { 
	display: block;
	padding: 8px 12px;
	border: 0;
	font-weight: 300;
	font-size: 24px;
	outline: 0 !important;
	background: #000;
	color: #fff;
	border: 1px solid #000;
	margin: 0 auto;
	line-height: 1;
}
#navToggle .fa { background: transparent; color: #fff; font-size: 1.8rem; line-height: 1; margin: 0 !important; display: block; }
#navToggle:hover { background: #fff; border-color: #000; color: #000; }
#navToggle:hover .fa { color: var(--green-lighter); }
#navToggle:focus { outline: none !important; box-shadow: 0px 0px 10px rgba(0,0,0, 0.5); }
/**/

.navbar .container { 
	position:relative;
	height: 76px;
}
.navbar ul.navbar-nav { background: #0c6100; border: 1px solid #5dff00; position:absolute; left: 0; right: 0; margin: auto; }

.navbar ul.navbar-nav .nav-item {  
	font-family: 'Open Sans', Arial, sans-serif;
	font-size: 1.18rem;
	font-weight: 600;
	border-right: 1px solid #389a00;
}
.navbar ul.navbar-nav .nav-item a { padding: .75rem 1rem; display:block; color:#fff; background: none;}
.navbar ul.navbar-nav .nav-item a:hover, .navbar ul.navbar-nav .nav-item a.active { background: #042000; color:#fff; }  
.navbar ul.navbar-nav .nav-item.highlighted { border-color:#3a3a3a; }
.navbar ul.navbar-nav .nav-item.highlighted a {
	background: #042000;
	color:#eee;
}
.navbar ul.navbar-nav .nav-item.highlighted a:hover { text-decoration:underline;}

.cat-link { }
/*
.cat-link a { text-align:left; padding: 0; color:#c2ff9f; line-height: 1;}
.cat-link a:hover { color:#c2ff9f; text-decoration:underline;}
.cat-link p { color:#78c746 !important; }
.cat-link .icon { color:#c2ff9f !important; }
*/
.cat-link .home-cat-btn { background: #042000; color: #97ff88; }
.cat-link .home-cat-btn:hover { background: #439f0e; color:#c2ff9f; border-color:#71ca65 !important; text-decoration:none; }
.cat-link .home-cat-btn:hover a { color:#000; }

.qty-field { max-width: 60px; padding: 4px 6px; }
.img-thumb-sm { 
	max-width: 80px;
    max-height: 80px;
}

.new-products-section .card .card-img-container,
.new-products-section .card .card-img-placeholder { height: 298px; display:block; width: 100%;}
.card-img-placeholder .img-fluid { max-height: 100%; }
.new-products-section .card a { color:#343a40; }
.new-products-section .card .text-muted a { color:#b5bdc3; }
.new-products-section .card .card-title,
.card .card-text {  
	/* white-space: nowrap; */
    overflow: hidden;
    text-overflow: ellipsis;
}

#catMenu { background: #fff; border: 2px solid #222222; }
/* #catMenu #categoriesWrapper { border: 1px solid #ccc; } */
#catMenu #categoriesWrapper .nav-item:first-child { border-top: none !important; }
#catMenu #categoriesWrapper .nav-item:last-child { border-bottom: none !important; }
#catMenu .nav-item { background: transparent; }
#catMenu .nav-item {  padding: 0; color:#000; }
#catMenu .nav-item a.nav-link {
	background: transparent;
	font-size: 16px;
	padding: .5rem 1.25rem;
	color:#000;
	width: 100%;
}
#catMenu .nav-item a.nav-link.active { background: #fff; color:#a31d26; text-decoration: underline; }
#catMenu .nav-item a.nav-link:hover { background: #fff; color:#a31d26; text-decoration: undeline; }
#catMenu ul.children { background: #eee; padding: 0; margin: 0; padding: 12px 0 !important; }
#catMenu ul.children.closed { padding: 0 !important; }
#catMenu ul.children li.nav-item { background: transparent; padding: 0; padding: 0; border:none; }
#catMenu ul.children li a.nav-link { background: transparent; color: #000; font-size: 12px; padding: .5rem 1.25rem; padding-left: 1.75rem; }
#catMenu ul.children li a.nav-link.active { background: #eee; color: #000; text-decoration: underline; color:#37840b; }
#catMenu ul.children li a.nav-link:hover { background: #ddd; color: #a31d26; text-decoration: underline; }
#catMenu ul.grand-children { background: #dedede; padding-left: 20px !important; }
#catMenu ul.grand-children li a.nav-link.active { background: #ddd; }
#catMenu ul.grand-children li a.nav-link:hover { text-decoration: underline; }

#catMenu .btn-wrapper .btn { background: #eee; border: none; border-radius: 0; text-align: center; color: #000; }
#catMenu .btn-wrapper.top .btn { background: #fff; color:#000; padding: 6px 10px; }
#catMenu .btn-wrapper.top .btn em { padding: 2px 6px; }
#catMenu .btn-wrapper.top .btn:hover { background: #fff; }
#catMenu .btn-wrapper.top .btn:hover em { background: #eee; }
#catMenu .btn-wrapper .btn:hover { background: #fff; }
#catMenu .btn-wrapper .btn:hover em { background: #eee; }
#catMenu .btn-wrapper .btn em { margin: 0 auto; font-size: 11px; line-height: 1; }

#catMenu #catToggleBtn { background: #222; display:block; width: 100%; padding: 6px 16px; border: 1px solid #ff767f; }
#catMenu #catToggleBtn:hover { background: #a31d26; border-color:#a31d26; }
#catMenu .children { height: auto; opacity: 1; transition: all 0.4s ease; }
#catMenu .children.closed { overflow:hidden; height: 0; opacity: 0; transition: all 0.3s ease-out; }

#leftWrapper { width: 22%; }
#rightWrapper { width: 78%; }

.page-link { color:#a31d26;}
.page-link:hover { color:#333;}
.disabled {
	color: #333;
    text-decoration: none;
	background-color: #e9ecef;
    border-color: #dee2e6;
}
.disabled a { color:#333;}
.disabled:hover,
.disabled a:hover { color:#333; text-decoration:none; }

.title-section { background: #eee; }
.title-section .container-fluid { min-height: 20vh; padding-top: 45px; padding-bottom: 45px; }
.content-section { }
.content-section .card { border-color: var(--green);}
.content-section .card .card-header { background: #fff; border-color: var(--green);}
.content-section .card .card-title { font-size: 1rem;}
.content-section .card .card-title a { color:#343a40; }
.content-section .card .card-title a:hover { color: #ff767f; }
.content-section .card .card-subtitle,
.content-section .card .text-muted a { font-size: .85rem; color:#b5bdc3 !important; letter-spacing: 0;}
.content-section .card .card-img-container { overflow:hidden;}
.content-section .card .card-img-container,
.content-section .card .card-img-placeholder { height: 217px; display:block; width: 100%;}
.content-section .card .qty-field { max-width: 50px; }
.card .attributes-colors { position: absolute; top: 0; left: 0; width: 100%; height: auto; padding: 6px 12px; background: rgba(0,0,0, 0); }
.card .attributes-colors .color { width: 20px; height: 20px; background: #fff; border: 2px solid #fff; }

#productViewDetails .text-muted { color:#84929c !important; }

.filters h5 { letter-spacing: 0; text-transform:none; margin-bottom: .8rem;}

.breadcrumb { padding: 4px 12px; }
.breadcrumb-item { color: #fff; text-transform:lowercase;}
.breadcrumb-item a { color: #000; }
.breadcrumb-item.active { color: #777; }
.breadcrumb-item+.breadcrumb-item::before { content: "\00BB"; } /* reset to: raquo*/

/* light gallery edit */
#lg-outer { background: rgba(0, 0, 0, 0.7) !important; }

/* ===== General ===== */
.posr { position:relative; }
.content-edit-btn { position:absolute; z-index: 99;  right: 10px; top: 10px;}
.preloader { position:absolute; top: 3px; right: -50px; z-index: 99; }
.card-preloader { 
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
	text-align:center;
	vertical-align:middle;
}
.card-preloader { margin: auto; padding-top: 70%; }
.card-preloader:before {
	content: "";
	display: block;
	position:absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #FFF;
	background: rgba(255, 255, 255, 0.7);
	width: 100%;
	height: 100%;
}
.hide { display:none; }
.stop-scrolling { height: 100%; overflow: hidden; } /* this is for the js disable scroll function */

#flashContent #flashMessage {
	margin-top: 0;
	width: 100%;
}

form .req-label { 
	color:#f00; font-size: 9px; margin-right: 0;
	position: relative;
    width: 10px;
    height: 10px;
}
form .req-label::before { position: absolute; top: 0;}
input.form-control,
textarea.form-control,
select.form-select { border-color: #aaa;}
form .form-check.checkbox { position:relative; }
form .form-check.checkbox .error-message { 
	position:absolute; bottom: -44px; width: 90%; display:block; border-top: 1px solid #f00;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.form-group { margin-bottom: .5rem;}
.form-group label { margin-bottom: .25rem; color:#6b6b6b; }
.form-group label em { margin-left: 4px;}
.masthead form input.form-error { border-color:#efff00; }
.masthead form .error-message {
	text-shadow: none;
    color: #ff0;
}
.form-check-inline { margin-right: 0; }
.form-check-inline label em { margin-left: 0px; margin-right: 14px; }

table.table th { font-weight: 700;}

img::selection {
  background: transparent;
}

img::-moz-selection {
  background: transparent;
}

.error { color:#f00;}

.bg-yellow { background:#ffce3a; }
.bg-yellow .border-top { border-color:#caad57 !important; }

#MyAccOptions { padding: 0px 0; }
#MyAccOptions:hover .card {
	display:block;
}
#MyAccOptions .card {
	display:none;
	position: absolute;
	min-width: 190px;
	max-width: 210px;
	left: 50%;
	transform: translateX(-50%);
	margin: 5px auto 0 auto;
	z-index: 999;
}
#MyAccOptions .card:before { 
	content: "";
	position:absolute;
	top: -10px; left: 0; right: 0;
	margin: 0 auto;
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent; 
	border-bottom: 10px solid #f7f7f7;
}

.list-group-item-light.list-group-item-action.active {
    color: #fff;
    background-color: #439f0e;
    border-color: #55c614;
}
.btn.text-dark.text-underline { 
	border:none; border-bottom: 1px solid #121416; 
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.btn.text-dark.text-underline:hover { 
	border-color:#ccc;
}
input.error, input.form-error, 
select.error, select.form-error { border: 1px solid #f00;}

.opacity-5 { 
	opacity: 0.5;
	-webkit-transition: all 0.2s ease-in-out;
	  -moz-transition: all 0.2s ease-in-out;
	  transition: all 0.2s ease-in-out;

}
.opacity-5:hover { opacity: 1;}

.hidden { display:none;}
.badge { font-weight: normal; padding: 4px 8px; border: none; }
.badge-outline-white { background: transparent; color:#fff; border: 2px solid #fff;}
.badge-outline-black { background: transparent; color:#000; border: 2px solid #000;}
.badge-outline-dark { background: transparent; color:#343a40; border: 2px solid #343a40;}
.badge-outline-secondary { background: transparent; color:#6c757d; border: 2px solid #6c757d;}
.badge-outline-primary { background: transparent; color:#007bff; border: 2px solid #007bff;}
.badge-outline-success { background: transparent; color:#28a745; border: 2px solid #28a745;}
.badge-outline-warning { background: transparent; color:#000; border: 2px solid #ffc107;}
.badge-outline-danger { background: transparent; color:#dc3545; border: 2px solid #dc3545;}
.badge-outline-info { background: transparent; color:#000; border: 2px solid #17a2b8;}

.badge-white { background: transparent; color:#fff; }
.badge-black { background: #000; color:#fff; }
.badge-dark { background: #343a40; color:#fff; }
.badge-secondary { background: #6c757d; color:#fff; }
.badge-primary { background: #007bff; color:#fff; }
.badge-success { background: #28a745; color:#fff; }
.badge-warning { background: #ffc107; color:#000; }
.badge-danger { background: #dc3545; color:#fff; }
.badge-info { background: #17a2b8; color:#fff; }

.img-placeholder { width: 100%; height: 100px;}

.btn { text-decoration: none !important; outline: none !important; font-weight: 600; }
.btn-green-light { background: #93ff56; border-color:#93ff56; color:#000; }
.btn-green-light:hover { background: #c2ff9f; border-color:#c2ff9f; color:#000; }
.btn-outline-green-light { background: transparent; border-color:#c2ff9f; color:#c2ff9f; }
.btn-outline-green-light:hover { background: #c2ff9f; border-color:#c2ff9f; color:#000; }
.btn-outline-red-lighter { background: transparent; border-color:#ffd2d5; color:#ffd2d5; }
.btn-outline-red-lighter:hover { background: #ffd2d5; border-color:#ffd2d5; color:#000; }
.btn-red-light { background: transparent; border-color:#ff767f; color:#ff767f; }
.btn-red-light:hover { background: #ff767f; border-color:#ff767f; color:#000; }
.btn-red { background: #a31d26; border-color:#a31d26; color:#fff; }
.btn-red:hover { background: #c5232f; border-color:#a31d26; color:#fff; }
.btn-green-dark { background: #042000; border-color:#042000; color:#93ff56; }
.btn-green-dark:hover { background: #000; border-color:#000; color:#fff; }
.btn-styled { border-width: 2px; border-color: inherit; }
.btn-cart-icon { background: transparent; border: 1px solid #f8f9fa; color: #fff; padding: 3px 11px !important; font-weight: 400; }
.btn-cart-icon:hover { background: #f8f9fa; border-color: #f8f9fa; color: #000; }
.btn-icn { opacity: 1; text-decoration:none; }
.btn-icn:hover { opacity: .5; text-decoration:none; }
.btn-dark:hover { background-color: #3d4e5b; }

#sortBtns a {display:block;}
#sortBtns a:focus {outline: none; box-shadow: none; color:#fff;}

#export-btn {
	position:absolute;
	right: 0;
	top: 3px;
}
#myAccountBtn { padding: 3px 11px !important; font-weight: 400; }

/* always show this by default */
.show-hide-target.hide { display:block !important; }

.bg-image {  }
.bg-image-comanda { background-image:url("../img/comanda_online.png"); background-repeat: no-repeat; background-size: auto 100%; background-position: left top;}
.bg-image-comanda-lg { background-image:url("../img/comanda_online_lg.png"); background-repeat: no-repeat; background-size: cover; background-position: center bottom; height: 200px; }
.bg-image-lg {  }

.row-flex {
  display: flex;
  flex-wrap: wrap;
}
.d-columns {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: column;
}
.align-middle, .flex-middle { display: flex; align-items: center; }
.inline-flex-middle { display:inline-block; display: inline-flex !important; align-items: center; }
.gap-1 { gap: 10px 10px; /* row-gap column gap */ }
.gap-2 { gap: 20px 20px; /* row-gap column gap */ }
.same-col-height { height: 100%; }

.bx-sh { box-shadow: rgb(0 0 0 / 10%) 0px 5px 15px; }
.td-align-middle { vertical-align:middle;}
.thead-dark-green tr td,
.thead-dark-green tr th { background: var(--green-darkest); color:#fff !important;}


#gallery { display: flex; flex-wrap: wrap; gap: 10px 10px; }
#gallery .thumb { max-width: 200px; height: auto; }
.img-styled {
	border-radius: 10px;
	border: 1px solid #ff767f;
	box-shadow: rgb(0 0 0 / 10%) 0px 5px 15px;
}
.img-styled img { border-radius: 10px;}

.stock-info { padding: 0.5rem; text-align:center; font-size: 16px; margin-bottom: 0 !important; }

.container-fluid { padding: 0 45px; }
.box { 
	width: 100%; max-width: 500px; 
	background: #fff; color: #000; border: 1px solid #dee2e6; box-shadow: rgb(0 0 0 / 10%) 0px 5px 15px; 
	text-align: left;
}
.modal .modal-dialog.modal-xl { max-width: 90%; }

/* #content.products-index a.card-img-container img { filter: brightness(1) invert(0.05); } */
.img-filter2 { filter: brightness(1) invert(0.04); }
#content.product-view #GLightbox { max-width: 600px; margin: 0 auto; }
#content.product-view #GLightbox a.gallery-img { background: #eee; }
#content.product-view #GLightbox a.gallery-img img, .img-filter { filter: brightness(1) invert(0.05); }
#content.product-view #GLightbox .view-img-flex { flex-direction: row; column-gap: 2.5%; }
#content.product-view #GLightbox .view-img-flex a.gallery-img { width: 48.5%; margin-bottom: 2.5%; }
.home #authMessage { margin: 1rem 0 !important; }

.attributes-wrapper { background: rgba(0,0,0, 0.05); }
.attributes-wrapper .attribute-link { display: block; width: 50px; height: 50px; border: 1px solid rgba(0,0,0, 0.25); opacity: 1; transition: none; }
.attributes-wrapper .attribute-link:hover { border: 2px solid #000; transition: none; box-shadow: inset 0px 0px 0px 1px #fff; }
.attributes-wrapper .selected .attribute-link { border: 2px solid #198754; box-shadow: inset 0px 0px 0px 2px #fff; position:relative; }
.attributes-wrapper .selected .attribute-link::after { 
	content: "\F26E"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: auto; 
	color:#00ff89;
	font-family: bootstrap-icons!important;
	font-size: 28px;
}
.attributes-wrapper.colors {}
.attributes-wrapper.colors .attribute-link { background: #eee; }

.tool-tip { 
	display: none;
	position: absolute; width: auto; height: auto; left: 0;
	top: 50%; left: 50%; transform: translate(-50%, -50%);
	white-space: nowrap;
	background: #222;
	color:#fff !important;
	padding: 4px 6px;
	border-radius: 6px;
	border: 1px solid #fff;
	z-index: 9;
}
.tool-tip.hide { display:none; }
.tool-tip-wrapper:hover .tool-tip { display:block; }
.tool-tip.--top { bottom: auto; top: -26px; transform: translate(-50%, 0); }
.tool-tip.--btm { bottom: -26px; top: auto; transform: translate(-50%, 0); }

.flex-list { display: flex; gap: 1rem; flex-direction: column; }
/* flex-sc gap-2 bdb bd-black-15 pb-1 w-100 */
.flex-list .flex-list-item { display: flex; gap: 0.5rem; border-bottom: 1px solid rgba(0,0,0, 0.15); padding-bottom: 0.25rem; padding-left: 0.5rem; }
.flex-list .flex-list-item .strong { color:#000; letter-spacing: 2px; font-size: 16px; text-transform: uppercase; }
.flex-list .flex-list-item:last-child { border-bottom: none !important; }

#accordionDetails .accordion-button:not(.collapsed) {
    color: #000;
    background-color: #eee;
    box-shadow: inset 0 -1px 0 rgb(0 0 0 / 13%);
}
#accordionDetails .accordion-button::after {
	filter: invert(35%) sepia(0%) saturate(1%) hue-rotate(111deg) brightness(97%) contrast(92%);
}
.accordion-item { border: none !important; }
.accordion-collapse { border-bottom: 1px solid rgba(0,0,0, 0.15) !important; }

.flex-related-models { gap: 2% !important; }
.flex-related-models a { max-width: 12.57%; margin-bottom: 2%; }

section.home-categories {}
section.home-categories .flex-home-categories {}
section.home-categories .flex-home-categories a.home-categories-link { 
	display:block;
	background: #eee; 
	/* border: 1px solid #ff767f;  */
	background: #eee url(../img/missing_image.png) center center no-repeat;
	background-size: 100% auto;
	color:#fff;
	text-underline-offset: 5px;
	position:relative;
}
section.home-categories .flex-home-categories a img {
	display:block; width: 100%; height: auto; position:relative; z-index: 1; max-width: 600px;
}
section.home-categories .flex-home-categories h4 { 
	color: #000; background: #fff; width: 100%; line-height: 1.5;
}
section.home-categories .flex-home-categories a.home-categories-link:hover { border-color: #000; transition: all 0.3s ease; }
section.home-categories .flex-home-categories a.home-categories-link:hover img { filter: grayscale(100%) brightness(1) invert(0.04); opacity: 0.5; transition: all 0.3s ease; }
section.home-categories .flex-home-categories a.home-categories-link:hover h4 { color:#000; background: #fff; transition: all 0.2s ease-out; text-decoration:underline;}

/* Filters */
.supplier-tag { position: absolute; top: 2px; left: 0; padding-left: 6px; width: 100%; height: auto; z-index: 9; }
.supplier-tag .badge { background: #fff; }
#FilterColors { max-height: none; overflow:hidden; }
#FilterColors input.form-check-input { width: 23px; height: 23px; cursor:pointer; }
.btn-filter { padding: 4px 10px; line-height: 1.2; font-size: 13px;}
.filter-order-select { line-height: 1.2; }
.filters-bar-wrapper { border: none; padding: 0; margin: 0; border-right: 1px solid rgba(0,0,0, 0.15); margin-right: 6px; padding-right: 12px;}
#FilterColors.filter-colors-minimal { max-height: 210px; }
/**/

/* ==== Media ==== */
@media (min-width: 1400px) { section.home-categories .flex-home-categories .flex-categories-item { width: 23.5%; min-height: 240px; } }
@media (min-width: 1200px) and (max-width: 1600px) {
	
}
@media (min-width: 1400px) and (max-width: 1600px) {
	
}
@media (min-width: 1200px) {
	.modal .modal-dialog.modal-xl { max-width: 992px; } 
}
@media (min-width: 992px) and (max-width: 1199px) {
	#leftWrapper { width: 28%; }
	#rightWrapper { width: 72%; }
}
@media (min-width: 992px) {
	.btn:focus { outline: none; box-shadow: none; }
	.border-lg-0 { border: 0 !important;}
}
@media (max-width: 1399px) {
	.container-fluid { padding: 0 25px; }
	.flex-related-models { gap: 2% !important; }
	.flex-related-models a { max-width: 18.40%; margin-bottom: 2%; }
	section.home-categories .flex-home-categories .flex-categories-item { width: 23.5%; }
}
@media (max-width: 1199px) {
	section.home-categories .flex-home-categories .flex-categories-item { width: 30%; }
}
@media (max-width: 992px) 
{
	#navToggle { display: block; }
	#mainNav .container { max-width: 992px !important; }
	.show-hide-btn { 
		font-size: 1.25rem !important; 
		text-transform: uppercase;
		letter-spacing: 3px;
		outline: none !important;
		box-shadow: none !important;
	}
	.show-hide-target.hide { display: none !important; }
	
	#catToggleBtn { color:#fff; }
	#catMenu #categoriesWrapper .list-group-item:first-child { 
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}
	.form-check { align-items: baseline; }
	#leftWrapper { width: 100%; }
	#rightWrapper { width: 100%; }
	
	.flex-related-models { gap: 2% !important; }
	.flex-related-models a { max-width: 23.50%; margin-bottom: 2%; }
	section.home-categories .flex-home-categories .flex-categories-item { width: 30%; }
	.filters-bar-wrapper { border: none; padding: 0; margin: 0; border-bottom: 1px solid rgba(0,0,0, 0.15); margin-bottom: 6px; padding-bottom: 12px;}
}

@media (max-width: 768px) 
{
	#ourOffers .col-12 { border: 0 !important; }
	#SearchResultIndexForm .col-1 { min-width: 43px; }
	#SearchResultIndexForm .col-11 { max-width: 465px; }
	.img-thumb-sm {
		max-width: 40px;
		max-height: 40px;
	}
	.table-responsive .table { min-width: 500px; }
	.col-form-label { font-size: 1rem; margin-bottom: 0 !important;}
	.check-group-lg input { width: 20px; height: 20px; }
	.check-group-lg label { font-size: 1.25rem; }
	#export-btn {
		position:relative;
	}
	.modal .modal-dialog.modal-xl { max-width: 95%; margin: 2rem auto; }
	.modal #export-btn { margin-right: -15px !important;}
	
	.mobile-fz-sm, .table-sm th { font-size: 0.875rem; }
	.mobile-fz-xs { font-size: 0.75rem; }
	.mobile-fz-default { font-size: 1rem; }
	.mobile-fz-md { font-size: 1.125rem; }
	.mobile-fz-lg { font-size: 1.25rem; }
	.mobile-fz-xl { font-size: 1.375rem; }
	.mobile-fz-xxl { font-size: 1.5rem; }
	.mobile-fz-xxxl { font-size: 2rem; }
	.container-fluid { padding: 0 1.5rem; }
	
	.flex-related-models { gap: 3% !important; }
	.flex-related-models a { max-width: 31.3%; margin-bottom: 3%; }
	
	section.home-categories .flex-home-categories .flex-categories-item { width: 240px; }
	.intro-text { font-size: 80px; padding: 0 30px;}
}

@media (max-width: 576px) { 
	#mobileNav { width: 90%; }
	.flex-related-models { gap: 4% !important; }
	.flex-related-models a { max-width: 48%; margin-bottom: 4%; }
	section.home-categories .flex-home-categories .flex-categories-item { width: 100%; }
	.intro-text { font-size: 70px; padding: 0 30px;}
}
/* // (phones, up to 383px) */
@media (max-width: 383px) {  
	#mobileNav { width: 100%; }
	#mobileNav a.nav-link { font-size: 1.125rem; }
	.container-fluid { padding: 0 1rem; }
	.flex-related-models { gap: 0 !important; }
	.flex-related-models a { max-width: 100%; margin-bottom: 5%; }
}