/* HEADER TOP-BAR */
.top-bar-contact-us {
    top: 8px;
    left: 1591px;
    width: 179px;
    height: 34px;
    border-radius: 17px;
    opacity: 1;
}

.top-bar-cart {
    top: 0px;
    left: 667px;
    height: 3.125rem;
    background: #34ac74 0% 0% no-repeat padding-box;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.header-hours{
    align-items: start;
    justify-content: center;
    display: flex;
    flex-direction: column;
}

.header-contact {
    justify-content: space-around;
    align-items: center;
    border-right:1px solid #ffffff20;
}

.header-contact div{
    width:100%;
    height:100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:4px 5px;
    transition:0.3s;
}

.header-contact div:nth-child(3){
    align-items: start;
}

.header-contact div:hover  {
    background-color: rgb(52 172 116 / 1);
    color:white;
}

.header-contact div:hover i,
.header-contact div:hover a {
    color:white;
    
}

/* MENU */
#desktopMenuToggle {
    display: flex;
    align-items: center;
    max-width: none;
    line-height: normal;
    flex: 0;
    padding: 1.4375rem 3rem 1.4375rem 2rem;
    background: #2c3792;
    transition: 0.3s ease-in-out;
    border: 1px solid transparent;
}

#desktopMenuToggle:hover {
    background-color: #34ac74;
}

#desktopMenuToggle.hamburger--squeeze:hover .hamburger-inner {
    width: 15px;
}

#desktopMenuToggle.hamburger--squeeze.is-active:hover .hamburger-inner {
    width: 24px;
}

#desktopMenuToggle span {
    font-weight: 500;
    color: white;
    padding-left: 0.625rem;
}

#desktopMenuToggle.active-menu {
    background: white;
    border: 1px solid #2c379233;
}

#desktopMenuToggle.active-menu span {
    color: #2c3792;
}

#desktopMenuToggle i.far.fa-bars {
    font-size: 1.3rem;
    font-weight: bold;
    color: #f3b558;
    margin-right: 0.75rem;
}

a#desktopMenuToggle i.fal.fa-angle-down {
    margin-left: 0.5rem;
    color: #111;
    font-size: 1rem;
    font-weight: bold;
}

#desktopMenuToggle.active-menu i.fal.fa-angle-down,
#desktopMenuToggle:hover i.fal.fa-angle-down {
    color: #fff;
}

#desktopMenuToggle.menu-open {
    background-color: white;
    border: 1px solid #2c379233;
}

#desktopMenuToggle.menu-open span {
    color: #2c3792;
}

/* hambunger */

.hamburger {
    font: inherit;
    display: inline-block;
    overflow: visible;
    margin: 0;
    padding: 15px;
    cursor: pointer;
    transition-timing-function: linear;
    transition-duration: 0.15s;
    transition-property: opacity, filter;
    text-transform: none;
    color: inherit;
    border: 0;
    background-color: transparent;
}

.hamburger.is-active:hover,
.hamburger:hover {
    opacity: 0.7;
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner:after,
.hamburger.is-active .hamburger-inner:before {
    background-color: #fff;
}

.hamburger-box {
    position: relative;
    display: inline-block;
    width: 24px;
    height: 17px;
}

.hamburger-inner {
    top: 50%;
    display: block;
    margin-top: -2px;
    /* transition: .3s ease-in-out; */
}

.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
    position: absolute;
    width: 24px;
    height: 3px;
    transition-timing-function: ease;
    transition-duration: 0.15s;
    transition-property: transform;
    border-radius: 4px;
    background-color: #e8a93d;
}

.hamburger-inner:after,
.hamburger-inner:before {
    display: block;
    content: "";
}

.hamburger-inner:before {
    top: -7px;
}

.hamburger-inner:after {
    bottom: -7px;
}

.hamburger--squeeze .hamburger-inner {
    /* transition-timing-function: cubic-bezier(.55,.055,.675,.19);
    transition-duration: 75ms */
    transition: 0.3s ease-in-out;
}

.hamburger--squeeze .hamburger-inner:before {
    transition: top 75ms ease 0.12s, opacity 75ms ease;
}

.hamburger--squeeze .hamburger-inner:after {
    transition: bottom 75ms ease 0.12s, transform 75ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.hamburger--squeeze.is-active .hamburger-inner {
    transition-delay: 0.12s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: rotate(45deg);
}

.hamburger--squeeze.is-active .hamburger-inner:before {
    top: 0;
    transition: top 75ms ease, opacity 75ms ease 0.12s;
    opacity: 0;
}

.hamburger--squeeze.is-active .hamburger-inner:after {
    bottom: 0;
    transition: bottom 75ms ease, transform 75ms cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s;
    transform: rotate(-90deg);
}

/* hamburger */

.header-main-block.header-right .icon-span {
    font-size: 1.5rem;
    color: #252525;
}

div#desktop-menu {
    position: fixed;
    left: 0;
    top: 100%;
    display: none;
    z-index: 1000;
    opacity: 1;
    background-color: gray;
    width: 100%;
    height: 100vh;
}
#desktop-menu .desktop-menu-container {
    display: flex;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    align-items: start;
    /* background-color: #fff; */
    max-width: 80vw;
}
#desktop-menu .main-nav {
    width: 21.75rem;
    background: #fff;
    position: relative;
    z-index: 3;
    top: auto;
    height: auto;
    flex-direction: column;
}
#desktop-menu .navbar {
    flex-direction: column;
    width: fit-content;
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0;
    padding: 0;
    /* padding-top: 0.75rem; */
    /* padding-bottom: 0.75rem; */
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    overflow-y: auto;
    height: 100%;
    position: static;
}

#desktop-menu .navbar .containerr-xxl {
    background: white;
    height: 100%;
}

#desktop-menu .navbar .collapse.navbar-collapse {
    height: 100%;
    align-items: flex-start;
    box-shadow: 0px 3px 15px #2c379226;
}
.menu-overlay {
    display: none;
}
.active-menu__box .menu-overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.dropdown.has-megamenu {
    position: static;
}
.navbar-nav > .nav-item {
    margin-left: var(--space-half);
    margin-right: var(--space-half);
    display: flex;
    justify-content: center;
    align-items: center;
}
#desktop-menu .navbar-nav > .nav-item {
    margin: 0;
    padding: 0 1rem;
    flex: 0 0 100%;
    width: 100%;
    flex: 1;
    border-bottom: 1px solid #64646440;
    transition: 0.3s ease-in-out;
}

#desktop-menu .navbar-nav > .nav-item:hover {
    background: #34ac74;
}

#desktop-menu .navbar-nav > .nav-item:hover a {
    color: white;
}

#desktop-menu .navbar-nav > .nav-item:hover ul li a {
    color: black;
    flex-direction: column;
}

#desktop-menu .navbar-nav > .nav-item ul li a:hover {
    color: #34ac74;
}

#desktop-menu .navbar-nav > .nav-item .nav-link {
    transition: 0.3s ease-in-out;
    color: #2c3792;
    font-weight: bold;
}

#desktop-menu .navbar-nav > .nav-item .nav-link:hover,
#desktop-menu .navbar-nav > .nav-item .nav-link:active {
    color: white;
}

#desktop-menu .navbar-nav > .nav-item,
#desktop-menu .navbar-nav > .nav-item > .nav-link > span.nav-link-desc,
#desktop-menu .navbar-nav > .nav-item > .nav-link [class*="menuicon-"],
#desktop-menu .navbar-nav > .nav-item > .nav-link > .menuc--,
#desktop-menu .navbar-nav > .nav-item > .nav-link > .menuc--:before,
#desktop-menu ul.megamenu-categories > li > a,
#desktop-menu .dropdown .dropdown-toggle::after,
.slideshow-slide-wrapper-col img,
.drill-item-wrap .list-group-item {
    -webkit-transition: all 0.05s linear;
    -moz-transition: all 0.05s linear;
    -o-transition: all 0.05s linear;
    -ms-transition: all 0.05s linear;
    transition: all 0.05s linear;
}
#desktop-menu .dropdown .dropdown-toggle::after {
    border: none;
    content: "\f105";
    font-family: "Font Awesome 6 Pro";
    position: absolute;
    right: 0;
}
#desktop-menu .dropdown.has-megamenu .dropdown-menu {
    left: 100% !important;
    width: 1000px !important;
    top: 0 !important;
    width: calc(100vw - 520px) !important;
    border: none;
    height: 100%;
    /* overflow: hidden; */
    z-index: 9999;
    background-color: #fff;
    box-shadow: inset 0px 3px 6px #00000029;
}
#desktop-menu .dropdown-megamenu-wrap {
    padding-left: var(--space-small);
    padding-right: var(--space-small);
    background: #fff;
}
#desktop-menu .dropdown-menu-top-content {
    padding-bottom: var(--space-small);
    border-bottom: 1px solid #e1e1e1;
    display: flex;
    flex-direction: column;
    margin-bottom: var(--space-small);
}
#desktop-menu .dropdown-menu-top-content h3 {
    font-weight: bold;
    font-size: 1.5rem;
    color: var(--color-main);
}
#desktop-menu .dropdown-menu-top-content .dropdown-menu-text {
    font-weight: 600;
    color: #808080;
}
.dropdown.has-megamenu .dropdown-menu {
    width: 100%;
}
.dropdown.show .dropdown-menu {
    opacity: 1;
    display: flex;
    flex-wrap: wrap;
}
.dropdown .dropdown-menu {
    border-radius: 0;
    border: var(--generic-border);
    padding: var(--space);
    background-clip: unset !important;
    top: 0;
    margin-top: 0;
}

.header-main .fa-times {
    font-size: 1.4rem;
    font-weight: bold;
    color: #f3b558;
    margin-right: 0.75rem;
}

/* MENU */

/* HOMEPAGE CATEGORIES - DOWN */
img.down-menu-img {
    position: absolute;
    top: 20px;
    right: 50px;
}
/* HOMEPAGE CATEGORIES - DOWN */

/* HOMEPAGE-CONTENT-UP-WRAPPER */
.homepage-content-up-wrapper {
    background: transparent linear-gradient(180deg, #f5f6fc 0%, #ebeeff 100%) 0% 0% no-repeat padding-box;
    opacity: 1;
    padding-top: 1.875rem;
}
/* HOMEPAGE-CONTENT-UP-WRAPPER */

.input-quantity-cart {
    width: 8%;
    text-align: center;
}

.cart_item-total {
    display: flex;
    align-items: center;
}

@media (max-width: 1400px) {
    #desktopMenuToggle {
        padding: 1.2rem 2rem 1.2rem 1rem;
    }

    /* .hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {
        width: 20px;
    } */
}

@media (max-width: 1366px) {
}

@media (max-width: 500px) {
    .m_header-main .header-main-wrapper .offcanvas {
        top: 0;
        left: 0;
        transition: transform 0s;
    }

    /* Set the width and height to 100% to cover the entire screen */
    .m_header-main .header-main-wrapper .offcanvas-body {
        width: 100vw;
        height: 100vh;
        overflow-y: auto; /* Enable vertical scrolling if the content is too long */
        transition: transform 0s;
        padding-bottom: 6rem;
    }
}

.header-account-customers-wrapper {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid #12195a29;
    padding-bottom: 1rem;
}

.filter-category input {
    display: none;
}

.form-check-category {
    border: 1px solid #2c379226;
    /* padding: 10px; */
    border-radius: 5px;
    margin-bottom: 1px;
    position: relative;
    font-size: 0.875rem;
    font-weight: 600;
    transition: .3s ease-in-out;
    cursor: pointer;
}

.form-check-category label {
    padding: 10px;
    position: relative;
    display: flex;
    cursor: pointer;
}

.form-check-category:hover, .form-check-category.active {
    background: #34AC74;
    color: white;
}

.form-check-category label::after {
    content: "\f105";
    font-family: "Font Awesome 5 Pro";
    position: absolute;
    right: 1rem;
    font-size: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
}

.filter-group-container {
    border-bottom: 1px solid #E1E1E1;
    padding-bottom: 1rem;
}

.account-wrap .btn.btn-primary{
    background-color: #2c3792;
    color:white;
    transition:0.3s;
}

.account-wrap .btn.btn-primary:hover{
    background-color: #34ac74;
    color:white;
    transition:0.3s;
}


@media (max-width: 991px) {
    #product-category aside#column-left #ho-filter-block31 {
        width: 100%;
        opacity: 0;
        pointer-events: none;
        position: fixed;
        left: 0;
        top: 0;
        width: 100vw;
        height: 100vh;
        z-index: 9999;
        overflow-y: auto;
        background-color: white;
        padding: 1rem;
        transition: .2s all ease-out;
    }

    #product-category aside#column-left #ho-filter-block31.active{
        opacity: 1;
        pointer-events: auto;
    }
}