.modal-popup._inner-scroll .modal-content {
    overflow: unset !important;
}
#searchbox {
    max-width: 55%;
}
#searchbox .searchbox-input {
    border: none;
    background-color: #EDEDED;
    border-radius: 50rem;
    height: calc(1.5em + 1.25rem + 2px);
    padding: .625rem 1.125rem;
    font-size: 14px;
    line-height: 1.5;
    transition: none;
}
#popup-search-target .searchbox-wrapper input {
    background-color: white !important;
    color: #777777 !important;
}
.searchbox-result {
    position: absolute;
    display: grid;
    background-color: white;
    top: 5rem;
    z-index: 99999;
    border-radius: 8px;
    max-height: 70vh;
    overflow-x: hidden;
    overflow-y: scroll;
}
.searchbox-result::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}
.searchbox-result::-webkit-scrollbar
{
    width: 6px;
}
.searchbox-result::-webkit-scrollbar-thumb
{
    background-color: #8c98a4;
    border-radius: 3px;
}
.reset-keyword-search {
    top: 12%;
}
@media (max-width: 767px) {
    #searchbox {
        max-width: 100% !important;
    }
    .modal-popup .modal-header, .modal-popup .modal-content, .modal-popup .modal-footer {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    .reset-keyword-search {
        top: 20% !important;
    }
}
.animation-search-input {
    float: right;
    transform-origin: right;
    opacity: 0;
    transition: opacity 0.3s ease;
    animation: expandWidth 1s ease-out forwards;
}
.modal-popup._show .animation-search-input {
    opacity: 1;
    animation: expandWidth 1s ease-out forwards;
}
@keyframes expandWidth {
    0% {
        transform: scaleX(0);
        opacity: 0;
    }
    100% {
        transform: scaleX(1);
        opacity: 1;
    }
}
.ext-description {
    color: #1e2022;
    font-size: 16px;
}
.text-search {
    font-size: 20px;
    font-weight: 400;
}
.modal-content {
    padding: 1.2rem;
    display: flex;
    justify-content: space-evenly;
}
.modal-content #search-input {
    padding: 1rem;
}
.ais-SearchBox-form {
    border-radius: 10rem;
}
.logo img {
    width: 121px;
    max-width: 121px !important;
    margin-top: 0 !important;
}

.logo img:hover {
    cursor: pointer;
}

.page-header.type5 .logo {
    all: unset;
}

.ais-SearchBox-input {
    height: 44px !important;
    width: 100% !important;
    background-color: #EDEDED !important;
    border: 0 !important;
}
.ais-SearchBox-input:focus {
    box-shadow: none !important;
}
.ais-SearchBox-input:not(:placeholder-shown) + .ais-SearchBox-submit {
    display: none;
}
.ais-SearchBox-resetIcon path, .ais-SearchBox-submitIcon path {
    fill: #777777;
}
.ais-SearchBox-input::placeholder {
    color: #777777 !important;
}
.ais-SearchBox-submit {
    right: 0.8rem;
    left: unset;
}
.transition-3d-hover:focus, .transition-3d-hover:hover {
    transform: translateY(-3px);
}
.transition-3d-hover {
    transition: all 0.2s ease-in-out;
}
.d-none {
    display: none !important;
}
.d-block {
    display: block !important;
}
.space-header {
    margin-top: 6rem;
}

.content-scroll {
    display: none;
}
.content-scroll .navbar-nav > .nav-item {
    margin-bottom: 0;
}
#userPopup {
    right: 0;
    top: 45px;
    margin-top: 0;
    box-shadow: 1px 1px 4px 0 #0000001A;
    background-color: #FFFFFF;
}
#userPopup ul li{
    padding: 10px 0;
    margin: 0;
}
.search-result {
    top: 125%;
    max-width: 94% !important;
}
.open-search-mobile {
    display: none;
}

.mp-icon-search .modal-inner-wrap {
    margin: 0;
    width: 100%;
    transform: translateY(-50px);
    transition: transform .3s ease-in-out;
}
.mp-icon-search .modal-inner-wrap  .modal-header {
    display: none;
}
.search-result-modal {
    width: 60% !important;
}
.no-extension {
    color: #4B4D4E;
    font-size: 16px;
    font-weight: 400;
}
.shadow-lg {
    box-shadow: 0 10px 40px 10px rgba(140,152,164,.2)!important;
}
.font-size-20 {
    font-size: 1.429rem;
}
@media (min-width: 1200px) {
    .hs-mega-menu.services-menu {
        left: 5% !important
    }
}
.u-header__nav-link-toggle:hover::after {
    content: "\f106" !important;
}

#navBar {
    font-size: 1.2rem
}

.hs-mega-menu .u-header__sub-menu-title {
    font-weight: unset !important
}

a.nav-link:focus, a.nav-link:hover {
    color: #01007f !important
}
.nav-item.u-header__nav-item > a {
    color: #1E2022;
    font-weight: 400 !important;
    font-size: 18px !important;
}
.nav-item.u-header__nav-item ul li a {
    color: #000000 !important;
    font-size: 16px;
}
.nav-item.u-header__nav-item ul li a.nav-link:focus,
.nav-item.u-header__nav-item ul li a.nav-link:hover {
    color: #01007f !important;
}
.btn-outline {
    background-color: white;
    border-color: #01007F;
}
.btn-outline:hover {
    color: white !important;
    background-color: #01007F;
    border-color: #01007F;
}
.text-header {
    color: #1E2022 !important;
}
.sub-text-header {
    color: #1E202280 !important;
}
.best-sellers {
    background: linear-gradient(
        to right,
        #80ffdb 1.3%,
        #72efdd 10.68%,
        #64dfdf 18.67%,
        #56cfe1 28.48%,
        #48bfe3 42.85%,
        #4ea8de 55.39%,
        #5390d9 64.29%,
        #5390d9 72.69%,
        #6930c3 87.06%,
        #7400b8 55.39%
    );
    color: transparent !important;
    background-size: 200% auto;
    background-clip: text;
    -webkit-background-clip: text;
    animation: shine 3s linear infinite;
}
@keyframes shine {
    to {
        background-position: -200% center;
    }
}
.best-sellers:hover {
    color: transparent;
}
@media (min-width: 768px) {
    .d-md-block {
        display: block !important;
    }

    .d-md-none {
        display: none !important;
    }
}
@media (min-width: 992px) {
    .navbar-expand-lg .u-header__navbar-nav .u-header__sub-menu {
        border: 1px solid #F1F1F1 !important;
        box-shadow: 0 5px 9px rgba(55,125,255,.2), 0 5px 9px rgba(119,131,143,.2);
        border-radius: 10px;
    }
    .d-lg-block {
        display: block !important;
    }
    .d-lg-none {
        display: none !important;
    }
    .space-header {
        margin-top: 6rem;
    }
    .header.content {
        margin-top: -15px;
    }
    .open-search-mobile {
        display: none !important;
    }
    .wrap-header {
        display: flex !important;
    }
    .#header #menu {
        display: flex;
    }
    .icon-header:hover {
        background: #01007F33;
        border-radius: 4px;
    }
    .logo-mobile {
        display: none !important;
    }
    .navbar-expand-md .u-header__navbar-nav .u-header__sub-menu {
        border-top: 0.1875rem solid #377dff;
        border-radius: 0.3125rem;
        box-shadow:0 5px 9px rgba(55,125,255,.075), 0 5px 9px rgba(119,131,143,.075)
    }
}
/* 992-1050px: menu labels wrap to 3+ lines, growing the fixed header past
   the 6rem .space-header offset and covering the breadcrumbs below it.
   A slightly smaller nav font keeps labels at 2 lines (header stays 86px). */
@media (min-width: 992.02px) and (max-width: 1049.98px) {
    #header .navbar-nav .nav-link {
        font-size: 15px !important;
    }
}
@media only screen and (max-width: 992px) {
    .search-result-modal {
        width: 100% !important;
    }
    .page-header.type5 .logo img {
        width: 88px;
    }
    .content-scroll {
        display: none !important;
    }
    .contact-wrap {
        display: none !important;
    }
    #header {
        display: block !important;
        max-width: 100%;
        margin: 0;
        padding: 0;
    }
    #menu {
        background-color: white;
        margin-top: 0;
        padding: 5px 30px;
    }
    .mpnews-menu.customer-welcome {
        display: none !important;
    }
    .toggle-menu-mobile {
        display: block !important;
    }

    #toggle {
        width: 20px;
    }
    #toggle span, #toggle span:after, #toggle span:before {
        background-color: #1E2022;
    }
    #toggle span:before {
        top: -7px;
    }
    #toggle span:after {
        top: 7px;
    }
    #toggle.on span:after {
        transform: rotate(-45deg) translate(5px, -5px);
    }
    .navbar-expand-md .hs-mega-menu-opened .u-header__nav-link-toggle::after,
    .navbar-expand-md .hs-sub-menu-opened .u-header__nav-link-toggle::after {
        transform: rotate(360deg);
    }
    #menu {
        display: none;
    }
    #toggle {
        display: block;
        margin: 30px auto 30px;
        float: right;
    }
    #toggle span, #toggle span:after, #toggle span:before {
        width: 100%;
        height: 2px;
        transition: all 0.3s;
        backface-visibility: hidden;
        border-radius: 2px;
    }
    #toggle span {
        position: relative;
        display: block;
    }
    #toggle span:after, #toggle span:before {
        content: "";
        position: absolute;
        left: 0;
    }
    .dropdown-menu {
        position: static;
        float: none;
    }
    #toggle.on span:before {
        transform: rotate(45deg) translate(5px, 5px);
    }
    #toggle.on span {
        background-color: transparent;
    }
    #navBar ul .u-header__nav-item {
        width: 100%;
        padding: 15px 5px;
        margin: 0;
        border-bottom: 1px solid #E8E9E9;
    }
    #navBar ul .u-header__nav-item:last-child {
        border-bottom: 0;
    }
    .nav-item.u-header__nav-item > a:after {
        position: absolute;
        right: 10px;
        top: 5px;
    }
    .navbar-expand-lg .u-header__sub-menu:not(.u-header__promo) {
        border-left: 0;
        padding-left: 5px;

    }
    .navbar-expand-lg .u-header__sub-menu-nav-group {
        padding-top: 0;
        padding-left: 1rem;
    }
    #menu {
        left: 0 !important;
        min-width: 300px;
        top: 8%;
        width: 100%;
        position: fixed;
        max-height: 70vh;
        overflow: auto;
    }
    .u-header__nav-link-toggle:hover::after {
        content: "\f107" !important;
    }
}
.slideInUp {
    animation-name: slideInUp;
}
@keyframes slideInUp {
    0% {
        transform: translate3d(0, 10px, 0);
        visibility: visible;
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}
.img-menu-service {
    display: none;
}
@media (min-width: 1024px) {
    .popup-menu-magento-ext {
        max-height: 80vh;
        overflow-y: scroll;
    }
    .img-menu-service {
        display: block !important;
    }
}
