.custom-page-title span::before,
.custom-page-title span::after {
    display: inline-block;
    content: "";
    border-top: .1rem solid #eee;
    width: 35%;
    margin: 0 15px;
    transform: translateY(-5px);
}

.brand-box{
	border: 1px solid #7aa93c;
    padding-top: 15px;
    padding-bottom: 15px;
	background: #fdfdfd;
}
.brand-upper-box{
	border-bottom: 1px solid #7aa93c;
}
.brand-upper-box h4 a{
	color: #609e0e;
}
.brand-upper-box img{
	max-width: 135px;
	padding-bottom: 10px;
}
.brand-box-body{
	width: 100%;
    /* height: 445px; */
    height: 225px;
    overflow: auto;
}
.brand-box-item{
	padding: 0px 5px 0px 5px;
    border-bottom: 1px solid #e8e8e8;
}
.brand-box-item td{
	padding: 5px;
}
.brand-box-item td img{
	border: 1px solid #d0d0d0;
    border-radius: 3px;
    width: 50px;
}
.brand-box-item td a{
	font-size: 12px;
	color: #000;
}

.brand-box-body::-webkit-scrollbar {
    width: 6px;
}
.brand-box-body::-webkit-scrollbar-track {
    /* -webkit-box-shadow: inset 0 0 6px #7aa93c; */
    /* border-radius: 10px; */
}
.brand-box-body::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px #7aa93c; 
}

.price-box del{
	color: red;
}

.toolbox input{
	height: 34px;
}

.toolbox .filter-btn{
	margin-left: 15px;
}

.categories-box{
	border: 1px solid #7aa93c;
    padding-top: 15px;
    padding-bottom: 0px;
	background: #fdfdfd;
}
.categories-box img{
	
}
.categories-box h4 a{
	color: #609e0e;
}

.price-box .discount-p.product-price{
	color:red;
	font-size: 1.55rem;
	margin-left: 15px;
}

button.add-cart{
	cursor: pointer;
}

.dropdown-cart-products{
	height: auto;
	max-height: 300px;
    overflow: auto;
}
.dropdown-cart-products::-webkit-scrollbar {
    width: 6px;
}
.dropdown-cart-products::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #eee;
    border-radius: 10px;
}
.dropdown-cart-products::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px #000; 
}

.product-single-share a{
	margin-right: 10px;
}

a.fb-btn {
    width: 35px;
    height: 35px;
    padding: 7px 6px;
    font-size: 16px;
    line-height: 1.33;
    border-radius: 25px;
    border-color: #234e9a;
    min-width: auto;
	color: #234e9a;
}
a.tw-btn {
    width: 35px;
    height: 35px;
    padding: 7px 6px;
    font-size: 16px;
    line-height: 1.33;
    border-radius: 25px;
    border-color: #32aadc;
    min-width: auto;
	color: #32aadc;
}
a.fb-btn:hover, a.fb-btn:focus {
    background: #234e9a;
    border-color: #234e9a;
    color: #fff;
}
a.tw-btn:hover, a.tw-btn:focus {
    background: #32aadc;
    border-color: #32aadc;
    color: #fff;
}

.header-left span{
	margin-right: 10px;
}

@media (max-width: 768px) {
	.header-top .header-dropdown {
		display: none !important;
	}

	.header-top .header-left span:nth-child(2) {
		display: none !important;
	}
}

@media (max-width: 480px) {
	.header-top .header-left {
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		gap: 12px !important;
		width: 100% !important;
	}

	.header-top .header-left span,
	.header-top .header-left span a {
		display: inline-flex !important;
		align-items: center !important;
		white-space: nowrap !important;
	}
}

.menu .menu-item-auth-link > a {
	display: inline-block;
	padding: 0.7rem 1.6rem;
	border-radius: 4px;
	text-transform: uppercase;
	font-weight: 600;
	background-color: #ffd700;
	color: #002c57 !important;
	transition: all 0.2s ease-in-out;
}

.menu .menu-item-auth-link > a:hover,
.menu .menu-item-auth-link > a:focus {
	background-color: #f0c000;
	color: #001d3d !important;
}

.menu .menu-item-auth-link + .menu-item-auth-link {
	margin-left: 1rem;
}

.header-bottom .menu .menu-item-auth-link {
	display: none !important;
}

@media screen and (max-width: 768px) {
	.custom-page-title span::before,
	.custom-page-title span::after {
		width: 25%;
	}
}
@media screen and (max-width: 480px) {
	.custom-page-title span::before,
	.custom-page-title span::after {
		width: 15%;
	}
}
#snackbar {
  visibility: hidden;
  min-width: 250px;
  margin-left: -125px;
  background: rgba(80,230,80,0.8);
  color: #fff;
  text-align: center;
  border-radius: 2px;
  padding: 16px;
  position: fixed;
  z-index: 1;
  left: 50%;
  bottom: 30px;
  font-size: 17px;
  font-family: Arial, Helvetica, sans-serif;
}

#snackbar.show {
  visibility: visible;
  -webkit-animation: fadein 0.5s, fadeout;
  animation: fadein 0.5s, fadeout;
}

.footer {
  background-color: #002c57 !important;
}

.icon-youtube::before {
  content: '\f167';
}

.social-icon .fa {
  font-family: 'FontAwesome' !important;
  font-style: normal;
  font-weight: normal;
  display: inline-block;
}

/* Remove sticky-wrapper */
.mobile-menu-item {
	display: block !important;
	border-bottom: 1px solid #f0f0f0 !important;
	background-color: #ffffff !important;
	list-style: none !important;
}

.mobile-menu-item > a {
	display: block !important;
	padding: 14px 22px !important;
	color: #002c57 !important;
	font-size: 1.4rem !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	letter-spacing: 0.03em !important;
	transition: all 0.25s ease-in-out !important;
}

.mobile-menu-item > a:hover,
.mobile-menu-item > a:focus {
	background-color: #eef3f9 !important;
	padding-left: 24px !important;
}

.mobile-menu-divider {
	display: block !important;
	height: 1px !important;
	background: rgba(0, 44, 87, 0.15) !important;
	margin: 10px 22px !important;
	list-style: none !important;
	border: none !important;
	padding: 0 !important;
}

.mobile-menu-btn {
	border: none !important;
	margin: 6px 22px !important;
	border-radius: 8px !important;
	overflow: hidden !important;
	background: transparent !important;
	border-bottom: none !important;
	padding: 0 !important;
	list-style: none !important;
}

.mobile-menu-btn > a {
	display: block !important;
	padding: 12px 20px !important;
	text-align: center !important;
	border-radius: 8px !important;
	color: #ffffff !important;
	font-size: 1.35rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.04em !important;
	text-transform: uppercase !important;
	box-shadow: none !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.mobile-menu-btn--primary > a {
	background-color: #002c57 !important;
}

.mobile-menu-btn--accent > a {
	background-color: #ffd700 !important;
	color: #002c57 !important;
}

.mobile-menu-btn > a:hover,
.mobile-menu-btn > a:focus {
	transform: none !important;
	box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08) !important;
}

@media (max-width: 480px) {
	.mobile-menu-item > a {
		padding: 12px 18px !important;
		font-size: 1.35rem !important;
	}

	.mobile-menu-btn {
		margin: 6px 18px !important;
	}

	.mobile-menu-btn > a {
		padding: 11px 18px !important;
		font-size: 1.3rem !important;
	}

	.mobile-menu-divider {
		margin: 8px 18px !important;
	}
}

.mobile-menu-contact {
	display: flex !important;
	align-items: flex-start !important;
	gap: 12px !important;
	margin: 10px 22px !important;
	padding: 12px 16px !important;
	border-radius: 10px !important;
	background-color: #f3f6fb !important;
	list-style: none !important;
	border: 1px solid rgba(0, 44, 87, 0.12) !important;
}

.mobile-menu-contact-icon {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 42px !important;
	height: 42px !important;
	border-radius: 50% !important;
	background-color: #002c57 !important;
	color: #ffffff !important;
	font-size: 1.6rem !important;
	flex-shrink: 0 !important;
}

.mobile-menu-contact-details {
	display: flex !important;
	flex-direction: column !important;
	gap: 4px !important;
}

.mobile-menu-contact-label {
	font-size: 1.2rem !important;
	font-weight: 600 !important;
	color: #002c57 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.04em !important;
}

.mobile-menu-contact-details a,
.mobile-menu-contact-text {
	font-size: 1.3rem !important;
	color: #002c57 !important;
	text-decoration: none !important;
	line-height: 1.4 !important;
	word-break: break-word !important;
}

.mobile-menu-contact-details a:hover {
	text-decoration: underline !important;
}

@media (max-width: 480px) {
	.mobile-menu-contact {
		margin: 8px 18px !important;
		padding: 10px 14px !important;
		gap: 10px !important;
	}

	.mobile-menu-contact-icon {
		width: 38px !important;
		height: 38px !important;
		font-size: 1.4rem !important;
	}

	.mobile-menu-contact-label {
		font-size: 1.1rem !important;
	}

	.mobile-menu-contact-details a,
	.mobile-menu-contact-text {
		font-size: 1.2rem !important;
	}
}

@media (prefers-reduced-motion: reduce) {
  .banner-headphone-img {
    animation: none !important;
    transform: none !important;
  }
}