:root {
    --primary: #2E2F33;
    --secondary: #DFF1EC;
    --tertiary: #F6F6F7;
    --quaternary: #2B2565;

    --radius-s: 1rem;
    --radius-m: 2rem;
    --radius-x: 3rem;

    --swiper-navigation-color: var(--primary);
    --swiper-navigation-size: x-large;
}

@font-face {
    font-family: fontl;
    src: url(../font/light.woff) format("woff"),
    url(../font/light.woff2) format("woff2");
}

@font-face {
    font-family: fontbold;
    src: url(../font/bold.woff2) format("woff2"),
    url(../font/bold.woff) format("woff");
    font-display: swap;
}

@font-face {
    font-family: fontmedium;
    src: url(../font/regular.woff2) format("woff2"),
    url(../font/regular.woff) format("woff");
    font-display: swap;
}


@keyframes alarm {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

html,
body,
div,
a,
p,
input,
textarea,
select,
label,
li,
ul,
ol,
blockquote,
noscript,
button,
abbr,
article,
aside,
figcaption,
figure,
footer,
header,
menu,
nav,
section,
details,
summary,
dialog,
dt,
dd {
    font: medium fontmedium;
    outline: none !important;
    scroll-behavior: smooth;
}

b,
strong {
    font-family: fontbold;
    font-weight: normal;
}

a {
    color: currentColor;
    transition: 0.2s;
}

a:focus,
a:hover {
    color: currentColor;
    text-decoration: none;
}

h1 { font-size: 1.7rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.3rem; }
h4 { font-size: 1.15rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.85rem; }

@media (max-width: 768px) {
    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.3rem; }
    h3 { font-size: 1.15rem; }
    h4 { font-size: 1rem; }
    h5 { font-size: 0.9rem; }
    h6 { font-size: 0.75rem; }
}


.mainContainer {
    position: relative;
}

.mainContainer section {
    margin-bottom: 4rem;
}

.container {
    max-width: 1280px;
}

@media screen and (max-width: 1200px) {
    .container {
        max-width: 1024px;
    }
}

@media screen and (max-width: 992px) {
    .mainContainer section {
        margin-bottom: 1.5rem;
    }

    .container {
        max-width: 960px;
    }
}

@media screen and (max-width: 768px) {
    .container {
        max-width: 720px;
    }
}

@media screen and (max-width: 576px) {
    .container {
        max-width: 540px;
    }
}

header.header {
    margin-top: 1rem;
    box-shadow: 0px 1rem 2rem 0px #0000000A;
    margin-bottom: 3rem;
}

.header_container {
    display: flex;
    align-items: center;
    height: 3rem;
    background: white;
    margin-bottom: 2rem;
}


.sticky {
    right: 0;
    left: 0;
    z-index: 4;
    transition: 0.2s;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    height: auto;
    max-width: none;
    opacity: 1 !important;
}

.mobile_menu {
    display: none;
}

.search_area {
    margin: 0 auto;
    flex: 0 1 50%;
    border-radius: 2rem;
    background: var(--tertiary);
    height: 100%;
}

.search_area #header-search {
    display: flex;
    position: relative;
}

.logo_area img {
    width: 120px;
    height: 35px;
    object-fit: contain;
}

#product-q-list {
    padding: 0;
    display: none;
    background: var(--tertiary);
    z-index: 3;
    position: absolute;
    list-style: none;
    width: 100%;
    margin-bottom: 0;
    max-height: 300px;
    overflow-y: auto;
    border-radius: 1rem;
    top: 46px;
}

.search_button {
    position: absolute;
    inset: 0;
    left: auto;
    right: 1rem;
    margin: auto 0;
    padding: 0;
    background: none;
    border-radius: 1rem;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

#q-search {
    border: none;
    background: transparent;
    text-indent: 3rem;
}

.dSearch {
    background: var(--primary);
    border-radius: var(--radius-m);
    border: none;
    border-left: 3px solid #FFFFFF;
    padding: 0 1rem;
    color: white;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dSearch::after {
    margin-right: 1rem;
    margin-left: 0px;
}

.entity_search_header .dropdown-menu {
    min-width: auto;
    background: var(--secondary);
    border: none;
    border-radius: .5rem;
    color: var(--primary);
}

.entity_search_header .dropdown-menu input {
    display: none;
}


.login_area {
    padding: 0 1.5rem;
    border-radius: var(--radius-s);
    color: var(--primary) !important;
    background: var(--tertiary);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: .2s;
}

.login_area:hover {
    background: var(--quaternary);
    color: whitesmoke !important;
}

.login_area svg * {
    transition: .2s;
}

.login_area:hover svg * {
    stroke: whitesmoke;
}

.basket_area {
    padding: 0 1rem;
    margin-right: 1rem;
    background: var(--tertiary);
    border-radius: 1rem;
    height: 100%;
    transition: .2s;
}

.basket_area .box {
    display: flex;
    align-items: center;
    justify-content: center;
}

.basket_area:hover {
    background: var(--quaternary);
}

.basket_area svg * {
    transition: .2s;
}

.basket_area:hover svg * {
    fill: white;
}

.basket_area:hover .header-count {
    color: white;
}

.header-count {
    color: var(--primary);
    margin-right: .25rem;
}

.auto_item {
    margin-bottom: 5px;
    color: var(--primary);
}

.auto_item .auto_item_link {
    padding: 5px 10px;
    display: flex;
    align-items: center;
}

.auto_img img {
    width: 100%;
    border-radius: 5px;
    object-fit: contain;
    border: 1px solid var(--primary);
}

.auto_title {
    width: calc(100% - 50px);
}

.auto_img {
    width: 40px;
    margin-left: 10px;
}

.add_to_cart_dropdown {
    width: 330px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.16);
    background-color: #ffffff;
    left: 0;
    top: calc(100% - 10px) !important;
    right: unset;
    display: none;
    padding: 0 0 45px;
    line-height: 22px;
    border: 0;
    border-radius: 3px;
    overflow: hidden;
}

.cart_summary_list {
    max-height: 293px;
    overflow: auto;
    padding: 0 15px;
    list-style: none;
}

.mini_cart_footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border-top: 1px solid #eee;
    position: absolute !important;
    bottom: 0;
    left: 0;
    right: 0;
}

.cart_summary_list_item_content {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: 100%;
    color: black;
}

.cart_summary_list_item_img {
    display: inline-flex;
    align-items: center;
    width: 75px;
    height: 75px;
    justify-content: center;
    flex: 0 0 75px;
    max-width: 75px;
    position: relative;
    border-radius: 3px;
}

.cart_summary_list_item_detail {
    padding-right: 10px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex-grow: 1;
}

.mini_cart_img {
    max-width: 100%;
    height: 100%;
    border-radius: 3px;
    object-fit: contain;
}

.cart_summary_list_item_params {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 12px;
}

.cart_summary_list_item_remove {
    position: absolute;
    top: 65%;
    transform: translateY(-50%);
    left: 0;
    border-radius: 50%;
    background-color: #ffffff;
    width: 15px;
    height: 15px;
    border: none;
    z-index: 2;
    cursor: pointer;
}

.cart_summary_list_item_remove::before {
    content: "\f1f8";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    color: var(--primary);
    width: 14px;
    height: 14px;
    background-size: 100%;
    position: absolute;
    top: 0;
    right: 3px;
}

.cart_summary_list_item_submit {
    font-size: small;
    line-height: 26px;
    letter-spacing: -0.5px;
    color: var(--primary);
    text-align: center;
    padding-top: 9px;
    padding-bottom: 10px;
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart_summary_list li:first-child {
    display: none;
}

.cart_basket_link {
    background: var(--primary);
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    bottom: 0;
    justify-content: center;
    padding-left: 15px;
    padding-right: 15px;
    transition: background-color 0.3s ease-in-out;
    align-items: center;
    color: #ffffff !important;
    width: 40%;
}

.cart_summary_list li:not(:last-child) {
    border-bottom: 1px solid var(--primary);
}

.cart_summary_list_item:first-child {
    border-bottom: 0;
}

.cart_summary_list_item {
    padding: 10px 0 10px 0;
    position: relative;
    min-height: 88px;
    display: block;
    border-bottom: 1px solid var(--primary);
}

.cart_summary_header_total {
    font-size: small;
}

.cart_summary_header_total span:first-child {
    color: var(--primary);
    font-size: medium;
    font-family: fontbold;
    margin: 0 4px;
}

.empty_mini_cart {
    width: 190px;
    text-align: center;
    padding: 25px 0;
}

.empty_mini_cart img {
    max-width: 60%;
    object-fit: contain;
}

.empty_mini_cart p {
    margin-bottom: 0px;
    margin-top: .5rem;
    font-family: fontbold;
}

header.header hr {
    border-color: var(--secondary);
    margin: 2rem auto;
}

.header_menu .logo_area {
    height: 0%;
    display: none;
    position: absolute;
    overflow: hidden;
}

.login_area .desktop {
    display: block;
}

.login_area .mobile {
    display: none;
}

@media screen and (max-width: 992px) {
    .header_menu:not(.mm-menu) {
        max-height: 0;
        max-width: 0;
        overflow: hidden;
    }

    :root {
        --radius-s: .5rem;
        --radius-m: .5rem;
        --radius-x: .5rem;
    }

    .mobile_menu {
        display: block;
        flex: 0 1 auto;
        background: var(--tertiary);
        padding: 0.3rem .5rem;
        border-radius: .5rem;
        line-height: normal;
    }

    header.header hr {
        display: none;
    }

    header.header {
        padding: 1rem 0 .5rem 0;
        border-radius: .8rem;
        margin-top: 0;
        margin-bottom: 1.5rem;
    }

    .header_container {
        flex-wrap: wrap;
        height: auto;
        row-gap: 1rem;
        margin-bottom: 0;
    }

    .logo_area {
        flex: 0 1 auto;
        margin: 0 auto;
    }

    .logo_area img {
        max-height: 24px;
    }

    .search_area {
        order: 6;
        flex: 1 1 100%;
        height: 45px;
        border-radius: .5rem;
    }

    .dSearch {
        border-radius: .5rem;
    }

    .drpsearch {
        display: none;
    }

    .login_area {
        flex: 0 1 auto;
        padding: .5rem;
        border: 1px solid #A6A7AE;
        font-size: small;
    }

    .login_area .desktop {
        display: none;
    }

    .login_area .mobile {
        display: block;
    }

    .basket_area {
        flex: 0 1 auto;
        padding: 0.6rem;
        position: relative;
        border-radius: .5rem;
        margin-right: .5rem;
    }

    .header-count {
        position: absolute;
        left: 11px;
        bottom: -5px;
        margin-right: 0;
        line-height: 1;
        background: var(--quaternary);
        color: white;
        border-radius: 3px;
        font-size: small;
        padding: 0.1rem 0.2rem;
    }

}

/*
    Mega menu
*/

@media screen and (min-width: 993px) {

    .hojre_menu .hmenu-mega > ul > li:hover > ul {
        display: block;
    }

    .hojre_menu .hmenu-mega > ul > li > ul > li {
        display: inline-block;
    }

    .header_menu.toolbar {
        position: fixed;
        top: -80px;
        opacity: 0;
        background: white;
        padding: .5rem 0;
    }

    .header_menu.toolbar > .container {
        display: flex;
        align-items: center;
    }

    .header_menu.toolbar .header_menu > ul {
        flex: 1 1 auto;
    }

    .header_menu > ul > li > a {
        padding: 0 15px;
    }

    #search_fix {
        padding: .5rem;
        border-radius: 1rem;
        background: var(--tertiary);
    }

    #search_fix .dropdown-menu {
        min-width: 100%;
        border: none;
        padding-top: 1rem;
        padding-bottom: 1rem;
        margin: 0;
        inset: 0 !important;
        top: 57px !important;
        transform: none !important;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
        max-width: 85%;
        height: 77px;
    }

    #search_fix .search_area {
        max-width: 75%;
    }


    .header_menu.sticky .logo_area {
        height: 100%;
        display: inline-block;
        position: relative;
    }


    .hojre_menu .hmenu-mega > a img {
        margin-left: 4px;
    }

    .hojre_menu .hmenu-mega > ul {
        background: whitesmoke;
        box-shadow: unset;
        border-radius: 0 0 .5rem .5rem !important;
    }

    .hojre_menu .hmenu-mega > ul > li > a {
        color: #424750;
    }

    .hojre_menu .hmenu-mega > a::before {
        background: var(--quaternary);
    }

    .hojre_menu .hmenu-mega > a::after {
        content: '';
        height: 15px;
        width: 1px;
        background: #e0e0e2;
        position: absolute;
        left: 0;
    }

    .hojre_menu .hmenu-mega > a {
        color: #3f4064;
    }

    .activedmenu {
        border: 1px solid;
        border-right: 0;
        border-left: 0;
        border-color: #f0f0f1 !important;
        color: #fc971d !important;
    }

    .hojre_menu .hmenu-mega > ul > li:hover > a, .activedmenu {
        background: white;
        border-color: #f0f0f1;
        color: #fc971d;
    }

    .header_menu > ul > li > ul a:hover {
        color: #fc971d !important;
    }

    .icon_menu.second {
        display: none;
    }

    .hojre_menu .hmenu-mega > ul > li:hover > a > .icon_menu.second, .activedmenu .icon_menu.second {
        display: block !important;
    }

    .hojre_menu .hmenu-mega > ul > li:hover > a > .icon_menu.first, .activedmenu .icon_menu.first {
        display: none !important;
    }

    .hojre_menu .hmenu-mega > ul > li > ul {
        overflow-x: hidden;
        overflow-y: auto;
        columns: 6 200px;
        column-gap: 1rem;
        border-radius: 0 0 0 .5rem !important;
        column-fill: auto;
    }

    .hojre_menu .hmenu-mega > ul > li > ul > li > a {
        color: #555;
        margin: 6px 0;
    }

    .hojre_menu .hmenu-mega > ul > li > ul > li > a::before {
        background: #fc971d;
        width: 2px;
    }

    .hojre_menu .hmenu-mega > ul > li > ul > li > a::after {
        content: url("../img/chevronLeft.svg");
        display: flex;
        margin-right: 0.5rem;
    }

    .hojre_menu .hmenu-mega > ul > li > ul > li > ul li > a {
        color: #81858b;
    }

    .hojre_menu .hmenu-mega > ul > li > ul > li > ul li > a {
        padding-right: 0;
    }

    ._mask {
        position: absolute;
        right: 0;
        height: 100%;
        width: 100%;
        top: 142px;
        bottom: 0;
        content: "";
        background: rgba(0, 0, 0, 0.2);
        opacity: 0;
        z-index: 2;
        -webkit-transition: opacity .2s cubic-bezier(.215, .61, .355, 1) .1s;
        transition: opacity .2s cubic-bezier(.215, .61, .355, 1) .1s;
        pointer-events: none;
    }

    .header_menu ul.active {
        display: block !important
    }
}

@media screen and (max-width: 1200px) {
    .header_menu > ul > li > ul > li > ul {
        overflow: auto;
    }
}

/* headerCarousel  */

.headerCarousel {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    align-items: center;
}

.titleHeaderCarousel {
    margin-bottom: 0;
    padding: 5px 0;
    background: white;
    border-radius: var(--radius-s);
    position: relative;
    font-family: fontbold;
    font-size: large;
    color: var(--primary);
    flex: 1 1 auto;
    text-align: center;
}

.buttonHeaderCarousel {
    padding: .5rem 1rem;
    border-radius: var(--radius-s);
    background: var(--tertiary);
    color: var(--primary);
    font-size: small;
    transition: .2s;
}

.buttonHeaderCarousel:hover {
    background: var(--quaternary);
    color: white;
}

@media screen and (max-width: 992px) {
    .buttonHeaderCarousel {
        padding: .25rem .5rem;
        border-radius: 1rem;
    }

    .headerCarousel {
        margin-bottom: 1rem;
    }
}

/* 
  slider
*/


.controlSliderAndContent {
    position: absolute;
    bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    z-index: 2;
    width: 100%;
    padding: 0 1.5rem;
}

.controlSliderAndContent .swiper-pagination-bullets {
    width: max-content !important;
    margin-right: auto;
    background: rgba(255, 255, 255, 0.32);
    border-radius: 1rem;
    padding: .12rem .5rem;
    gap: .2rem;
    display: none;
}

.controlSliderAndContent .swiper-pagination-bullet {
    background: white;
}

.sliderAndContent .sliderItemImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--radius-x);
}

.sliderAndContent .swiper-pagination {
    background: url('../img/pagination.svg');
    background-repeat: no-repeat;
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    bottom: 0;
}

.sliderAndContent .swiper-pagination-bullet-active {
    background: var(--tertiary);
    width: 1rem;
    border-radius: 1rem;
}

@media screen and (max-width: 992px) {
    .controlSliderAndContent .swiper-pagination-bullets {
        display: flex;
    }

    .controlSliderAndContent {
        padding: 0 .5rem;
        bottom: .5rem;
    }
}

/* 
  banner
*/

.bannerContainer {
    display: flex;
    gap: 2rem;
}

.BannerItem {
    flex: 1 1 auto;
    max-width: 100%;
}

.BannerImg {
    width: 100%;
    object-fit: cover;
    border-radius: var(--radius-s);
}

@media screen and (max-width: 992px) {
    .bannerContainer {
        flex-wrap: wrap;
        gap: .5rem;
    }
}


/*
    Edit Admin Btn
*/

.editAdminBtn {
    opacity: 0;
    position: absolute;
    top: 15px;
    right: 15px;
    border-radius: 5px;
    padding: 5px 10px;
    transition: 0.2s;
    z-index: 1;
}

.editAdminBtn a {
    color: white !important;
    font-size: small;
    font-family: fontbold;
}


.editAdminBtn.btn-danger {
    right: 55px;
}

:is(.fiveBannerItem,
  .linkSliderItem,
  .aboutBrand,
  .menuFooterArea,
  .menuArea,
  .entity_item,
  .BannerItem,
  .swiper-slide):hover .editAdminBtn {
    opacity: 1;
}

.editWidget .editAdminBtn {
    opacity: 1;
    position: unset;
    display: inline-block;
}

.editWidget {
    padding-top: 15px;
    margin-bottom: 10px;
}

/* link */

.link_widget .link_box {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.link_box .linkSliderItem {
    width: calc((100% / 8) - 1.32rem);
}

@media screen and (max-width: 992px) {
    .link_widget .link_box {
        gap: .5rem;
    }

    .link_widget .link_box.type_3 {
        overflow-x: auto;
        flex-direction: column;
        max-height: 570px;
        justify-content: flex-start;
    }

    .link_box .linkSliderItem {
        width: calc((100% / 3) - 0.4rem);
    }

    .link_box.type_3 .linkSliderItem {
        width: calc((100% / 3.5) - 0.5rem);
    }

}

/* link slider */

.linkSliderContainer .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
}

.linkSliderContainer {
    padding: .5rem;
}

.linkSliderTitle {
    color: var(--primary);
    font-size: small;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 40px;
}

.linkSliderItem {
    color: var(--primary);
    font-size: small;
    font-family: fontbold;
    position: relative;
}

.linkSliderImgBox {
    /*box-shadow: 0px 0px 2rem 0px #0000000A;*/
    /*border: 1.5px solid var(--tertiary);*/
    /*padding: 1rem;*/
    /*border-radius: var(--radius-m);*/
    margin-bottom: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.linkSliderImg {
    object-fit: contain;
    margin-bottom: 0;
}

.swiper_controller {
    margin-top: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.swiper_controller .swiper-pagination-bullets {
    display: flex;
    gap: .5rem;
}

.swiper_controller .swiper-pagination-bullet {
    width: 6rem;
    height: .5rem;
    opacity: 1;
    border-radius: .5rem;
    background: var(--tertiary);
}

.swiper_controller .swiper-pagination-bullet-active {
    background: #E1E2E4 !important;

}

.arrow_component {
    display: flex;
    gap: .5rem;
}

.arrow_component > div {
    padding: 0.5rem 2rem;
    border-radius: var(--radius-m, 1rem);
    background: var(--tertiary);
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.08);
    cursor: pointer;
}

.arrow_component > div .mobile {
    display: none;
}

.arrow_component > .swiper-button-disabled {
    box-shadow: none;
    opacity: .5;
}

.productsCarouselWrapper .arrow_component {
    padding: .5rem;
}

@media screen and (max-width: 992px) {
    .linkSliderImgBox {
        padding: .25rem;
        border-radius: 100%;
    }

    .swiper_controller .swiper-pagination-bullets {
        gap: 0;
    }

    .swiper_controller .swiper-pagination-bullet {
        width: 4px;
        height: 4px;
        margin: 0 2px;
        background: #bbb9ce;
    }

    .swiper_controller .swiper-pagination-bullet-active {
        background: var(--quaternary) !important;
    }

    .arrow_component > div .mobile {
        display: block;
    }

    .arrow_component > div .desktop {
        display: none;
    }

    .arrow_component > div {
        padding: 0;
        box-shadow: none;
        border-radius: 100%;
        background: none;
    }

    .arrow_component svg path {
        stroke: white;
    }

}

/* 
  productsCarousel
*/

.productsCarousel.lastVisit {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.productsCarousel.lastVisit .productsCarouselContainer {
    border-radius: var(--border-radius, 2rem);
    border: 1.5px solid #E1E2E4;
    padding: 1rem 1.5rem;
}

.productsCarousel.hasBackground .productsCarouselContainer {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.productsCarousel.hasBackground .arrow_component > div, .productsCarousel.hasBackground .swiper_controller .swiper-pagination-bullet {
    background: white;
}

.productsCarousel.hasPromotion .productsCarouselWrapper {
    border: 1px solid #EF394F;
    border-radius: var(--radius-x);
    padding: 1.5rem;
}

.productsCarousel.hasPromotion .headerCarousel {
    display: none;
}

.productsCarousel.hasBackground .titleHeaderCarousel {
    text-indent: 1rem;
}

.productsCarousel.hasBackground .buttonHeaderCarousel {
    border: 1.5px solid white;
}

.productsCarouselContainer .swiper-slide {
    display: flex;
    height: auto;
}

.productsCarousel:not(.hasBackground,.hasPromotion) .productsCarouselContainer .swiper-slide {
    margin-bottom: .25rem;
}

.productsCarouselWrapper.hasImage {
    display: flex;
    gap: 2rem;
}

.productsCarouselWrapper.hasImage .swiper-container {
    flex: 1 1 auto;
}

.productsCarousel.hasBackground .entity_item {
    background: white;
}

.productsCarouselWrapper.hasImage .productsCarouselImageBox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}

.productsCarouselWrapper.hasImage .productsCarouselImageBox .box {
    border: 1.5px solid var(--tertiary);
    border-radius: 0 0 2rem 2rem;
    border-top: none;
}

.productsCarouselWrapper.hasImage .productsCarouselImageBox .box a {
    display: flex;
    margin: 12px 1rem;
    padding: 10px 1rem;
    background: var(--tertiary);
    border-radius: 1rem;
    font-size: x-small;
}

#countdown {
    color: #EF394F;
    font-size: small;
    position: absolute;
    top: 55px;
}

.productsCarouselWrapper.hasImage .productsCarouselImage {
    max-height: 500px;
    max-width: 300px;
    object-fit: contain;
}

@media screen and (max-width: 992px) {
    .productsCarouselWrapper.hasImage .productsCarouselImageBox {
        display: none;
    }

    .productsCarouselWrapper.hasImage .productsCarouselImageBox .box {
        border: none;

    }

    .productsCarouselWrapper.hasImage .productsCarouselImageBox .box a {
        margin: .5rem 0 0 0;
    }

    .productsCarouselWrapper.hasImage .productsCarouselImage {
        max-width: 100%;
        height: auto;
    }

    .productsCarousel.hasPromotion .productsCarouselContainer {
        background: #EF394F;
        padding-top: .5rem;
        padding-bottom: .5rem;
        border-radius: 0;
        position: relative;
    }

    .productsCarousel.hasPromotion .productsCarouselWrapper {
        border: none;
        padding: 0;
    }

    .productsCarousel.hasPromotion .productsCarouselContainer .entity_item {
        background: white;
    }

    .productsCarousel.hasPromotion .headerCarousel {
        display: flex;
        flex-direction: column;
        gap: .25rem;
        width: max-content;
        margin-right: auto;
    }

    .productsCarousel.hasPromotion .buttonHeaderCarousel {
        display: none;
    }

    .productsCarousel.hasPromotion .titleHeaderCarousel {
        background: none;
        color: white;
        border-bottom: 1px solid white;
        border-radius: 0;
    }

    #countdown {
        position: unset;
        color: white;
    }

    .productsCarousel.hasPromotion .discount_image {
        position: absolute;
        right: 0;
        top: 0;
    }
}

/* 
    Entity item
*/

.entity_item:not(.notProduct) {
    width: 100%;
    padding: 1rem .5rem;
    border-radius: 1rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: .2s;
    border: 1.5px solid #F6F6F7;
    align-items: center;
}

.entity_item:not(.notProduct):hover {
    border-color: #E1E2E4;
    background: var(--tertiary);
}

.entity_item > a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    height: 100%;
}

.entity_item.notProduct {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: 1rem;
    border: 1.5px solid var(--tertiary, #F6F6F7);
    border-radius: 1rem;
    width: 100%;
}

.notProduct .entity_image {
    width: 96px;
    height: 96px;
    border-radius: .5rem;
    object-fit: contain;
}

.entity_image_box {
    margin: auto;
}

.entity_image {
    max-width: 100%;
    /* width: 165px; */
    /* height: 256px; */
    /* object-fit: contain; */
    /* border-radius: var(--radius-m); */
}

.entity_image_box.product:not(.error) {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.entity_image_box.product:not(.error) .entity_image {
    border-radius: .5rem 2px 2px .5rem;
    overflow: hidden;
}

.entity_image_box.product:not(.error)::after {
    content: unset;
    position: absolute;
    left: 93.69%;
    right: 5.41%;
    top: 0;
    bottom: 0;
    background: -webkit-gradient(linear, left top, right top, from(#111), to(hsla(0, 0%, 7%, 0)));
    background: -webkit-linear-gradient(left, #111, hsla(0, 0%, 7%, 0));
    background: linear-gradient(90deg, #111, hsla(0, 0%, 7%, 0));
    opacity: .35;
}

.entity_image_box.product:not(.error)::before {
    content: unset;
    position: absolute;
    left: 94.59%;
    right: 3.6%;
    top: 0;
    bottom: 0;
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, .42)), color-stop(49.73%, #fff), to(hsla(0, 0%, 100%, .28)));
    background: -webkit-linear-gradient(left, hsla(0, 0%, 100%, .42), #fff 49.73%, hsla(0, 0%, 100%, .28));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, .42), #fff 49.73%, hsla(0, 0%, 100%, .28));
    opacity: .35;
}

.entity_name {
    color: var(--primary);
    margin-bottom: 0.5rem;
    margin-top: 10px;
    font-weight: normal;
    line-height: normal;
    font-size: medium;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 50px;
    max-width: 100%;
    /* font-family: fontl; */
}

.entity_item.notProduct .entity_name {
    font-family: fontbold;
    color: var(--primary);
    width: 100%;
    margin: 0;
    text-align: right;
}

.entity_item:not(.notProduct) .entity_information {
    /*display: flex;*/
    /*justify-content: flex-end;*/
    /*align-items: flex-end;*/
    /*flex-wrap: wrap;*/
    margin-top: auto;
    width: 100%;
    position: relative;
}

.entity_item.notProduct .entity_information {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 1 1 auto;
}

.entity_item.notProduct ._row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.entity_item.notProduct ._row a {
    border-radius: 1rem;
    padding: .5rem 1rem;
    background: var(--tertiary, #F6F6F7);
    transition: .2s;
}

.entity_item.notProduct ._row a:hover {
    background: var(--quaternary);
    color: white;
}

.entity_information .add_basket {
    display: flex;
    align-content: center;
    justify-content: center;
    padding: .41rem .5rem;
    background: var(--tertiary);
    border-radius: .5rem;
    max-width: max-content;
    margin-right: auto;
    transition: .2s;
}

.entity_item:not(.notProduct):hover .entity_information .add_basket {
    background: #A87902;
}

.entity_item:not(.notProduct):hover .entity_information .add_basket svg * {
    fill: white;
}

.entityOriginalPrice {
    color: #A6A7AE;
    margin-left: .5rem;
    font-size: small;

}

.entityDiscountPercent {
    background: #F93F3F;
    color: white;
    border-radius: 1rem;
    padding: 0px 10px;
    font-size: small;
}

.entityPrice {
    flex: 1 1 100%;
    color: var(--primary);
    font-family: fontbold;
    justify-content: center;
    margin-top: 10px;
    display: flex;
    gap: .5rem;
}

.entityPrice small {
    font-family: fontl;
}

.addBasketControl.fullControl.basket-quick-add-modal {
    width: calc(50% - 10px);
}

.addBasketControl .hidden {
    display: none !important;
}

.addBasketControl .basket_quick {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--tertiary);
    border-radius: .5rem;
    margin-left: auto;
    padding: .25rem 0.5rem;
    gap: .5rem;
}

.basket_quick button {
    box-shadow: none !important;
}

.addBasketControl .basket_quick .basket-item-update-count {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.addBasketControl .basket_quick .basket-item-update-count img {
    width: 17px;
    height: 17px;
    object-fit: contain;
}

.addBasketControl .basket-count {
    color: var(--primary);
    padding: .1rem .5rem;
    background: white;
    border-radius: .5rem;
    font-size: 20px;
    line-height: 1;
}


@media screen and (max-width: 480px) {
    .entityOriginalPrice {
        font-size: x-small;
    }

    .entityPrice {
        font-size: small;
    }

    .entity_item:not(.notProduct) {
        border-color: #E1E2E4;
    }

    .addBasketControl.fullControl.basket-quick-add-modal .each-item-outer-wrapper {
        position: absolute;
        width: 100%;
        inset: 0;
        top: auto;
        bottom: -10px;
        margin: auto;
    }

    .notProduct .entity_image {
        width: 72px;
        height: 72px;
    }

    .entity_item.notProduct ._row {
        font-size: small;
    }

    .entity_item.notProduct ._row a {
        font-size: small;
        padding-top: .5rem;
        padding-bottom: .5rem;
    }
}


/* 
  blog
*/

.blog .blogContainer .blogItem {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.blog .blogContainer .blogDetails {
    background: #FFFFFF;
    border-radius: var(--radius-m);
    padding: 1rem;
    margin-top: -1rem;
}

.blog .blogContainer .blogDetails hr {
    margin: .5rem 0;
}

.blog .blogContainer .time {
    color: #BDBDBD;
    font-size: small;
}

.blog .blogContainer .footer {
    color: var(--primary);
    font-size: small;
    text-align: left;
}

.blog .blogContainer .blogItem:hover .blogImage {
    width: 100%;
}

.blog .blogContainer .blogImage {
    width: 85%;
    height: 200px;
    object-fit: cover;
    border-radius: var(--radius-x);
    transition: .2s;
}

/*
    footer
*/

/*
  benefit
*/

.benefitContainer {
    display: flex;
    justify-content: space-between;
}

.benefitItem {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 20px;
    padding: .5rem 0;
    color: var(--primary);
    flex: 1 1 auto;
}

.benefitItem:not(:last-child) {
    border-left: 1px solid #E1E2E4;
}

@media screen and (max-width: 992px) {
    .benefitContainer {
        flex-wrap: wrap;
        gap: 1rem;
        background: var(--tertiary);
        padding-top: .5rem;
    }

    .benefitItem {
        width: auto;
        flex: 1 1 auto;
        border: none !important;
        padding: 0;
        flex-direction: row;
        gap: .25rem;
        font-size: x-small;
    }
}

.footer {
    background: var(--tertiary);
    margin-bottom: 2rem;
    padding: 1.5rem 0;
}

.footer_container {
    display: flex;
    flex-direction: column;
    position: relative;
    margin-bottom: 3rem;
    color: #616161;
}

.goToUP {
    display: flex;
    gap: .5rem;
    align-items: center;
    cursor: pointer;
    border: 1px solid #E1E2E4;
    padding: .5rem 1rem;
    border-radius: 1rem;
}

.goToUP:hover {
    background: #E1E2E4;
}

.footer_menu ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.footer_menu ul a {
    color: #616161;
    font-family: fontl;
}

.footer_menu > ul {
    display: flex;
    align-items: flex-start;
    gap: 4rem;
}

.footer_menu > ul > li > a {
    font: large fontbold;
    margin-bottom: 1.25rem;
    display: block;
}

.footer_menu > ul > li > ul {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.social_box .social {
    display: flex;
    gap: 1.3rem;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 2rem;
}

.social_box .mb-3 {
    color: #616161;
}

.licenses {
    display: flex;
    gap: 1rem;
}

.licenses .box {
    padding: .5rem;
    border-radius: 1rem;
    background: white;
}

.licenses .box {
    padding: .5rem;
    border-radius: 1rem;
    background: white;
}

.licenses .box img {
    width: 80px;
    height: 80px;
    object-fit: contain;
}

.footer_container ._row._b {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.footer_container .right_box ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer_container .right_box ul a {
    display: block;
    color: var(--tertiary);
}

.footer_container .right_box ul a:hover {
    color: var(--primary);
}

.footer_container .right_box > ul {
    display: flex;
    align-items: flex-start;
    gap: 50px;
}

.footer_container .right_box > ul > li > ul > li {
    margin-bottom: 20px;
}

.footer_container .right_box > ul > li > a {
    font-family: fontbold;
    margin-bottom: 20px;
}

.footer_container .left_box {
    flex: 0 1 500px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.footer_container .left_box .telephone {
    padding: 15px 20px;
    background: whitesmoke;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.footer_container .left_box .telephone a {
    margin-right: auto;
}

.footer_container .left_box .telephone b {
    margin: 0 3px;
    color: var(--primary);
}

.footer_container .left_box .social {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.footer_container .left_box .social .social_item img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.footer_container .left_box .social > * {
    padding: 20px;
    background: whitesmoke;
    border-radius: 10px;
}

.footer_container .left_box .social .box img {
    width: 120px;
    height: 120px;
    object-fit: contain;
}

.footer_container .about_brand {
    flex: 1 1 100%;
    margin-top: 1rem;
}

.titleBrand {
    font-size: large;
    margin-bottom: .5rem;
    font-weight: normal;
    line-height: normal;
    color: #616161;
}

.descriptionBrand {
    font-size: medium;
    font-family: fontl;
    color: #616161;
    line-height: 2;
}


.copy_right {
    text-align: center;
    font-size: x-small;
    color: var(--primary);
    margin-bottom: 2rem;
}

.copy_right a {
    font-size: small;
    font-family: fontbold;
    color: #222A5F !important;
    margin-right: 4px;
}

@media screen and (max-width: 992px) {
    .footer_container .logo_area {
        margin-right: 0;
    }

    .goToUP {
        padding: .5rem 1rem;
        border: 1.5px solid #E1E2E4;
        border-radius: 1rem;
    }

    .footer_container ._row._b {
        flex-direction: column;
        gap: 1rem;
    }

    .footer_menu {
        order: 2;
    }

    .footer_menu > ul {
        flex-wrap: wrap;
    }

    .social_box {
        width: 100%;
    }

    .licenses {
        justify-content: flex-end;
    }

}

/*
    Products list page
*/

.productsListPage {
    position: relative;
}

:is(.productsListPage,.productDetailPage) .contentBox {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border: 1px solid var(--tertiary);
    border-radius: 1rem;
    padding: 1rem;
    margin-bottom: 1.75rem;
}

.productDetailPage .contentBox {
    margin-bottom: 0;
    border-color: #E1E2E4;
}

.productsListPage .contentBox .image img {
    width: 100px;
    height: 100px;
    object-fit: contain;
    border-radius: .5rem;
}

.productsListPage .contentBox .image img.rounded {
    border-radius: 999px !important;
}

.productDetailPage .contentBox .image img {
    width: 115px;
    height: 115px;
    object-fit: cover;
    border-radius: .5rem;
}

.productsListPage .contentBox .text {
    max-width: calc(100% - (100px + 1rem));
    flex: 1 1 auto;
}

.productDetailPage .contentBox .text {
    max-width: calc(100% - (115px + 1rem));
    flex: 1 1 auto;
}

:is(.productsListPage,.productDetailPage) .contentBox .text > * {
    color: var(--primary);
}

.productsListPage .contentBox .body-entity {
    font-family: fontl;
}

.productDetailPage .contentBox .body-entity * {
    font-family: fontl;
}

:is(.productsListPage,.productDetailPage) .contentBox .text .goToDown {
    display: flex;
    align-items: center;
    position: relative;
    padding: 10px;
    color: #3A86FF;
    background: unset;
    border: 0;
    z-index: 2;
    border-radius: 1rem;
    margin-right: auto;
    max-width: max-content;
}

:is(.productsListPage,.productDetailPage) .contentBox .text > :is(h1,h3) {
    font-size: large;
    font-family: fontbold;
    margin-bottom: 1rem;
    width: 100%;
    display: inline-block;
}

.content_product_q {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
}

.content_product_q > .image .boxx {
    width: 300px;
}

.content_product_q > .text {
    width: calc((100% - 300px) - 1.5rem);
}

.content_product_q > .image img {
    object-fit: contain;
    border-radius: .5rem;
}

.productsListPageContainer {
    display: flex;
    justify-content: space-between;
}

.productsListPageAside {
    width: 270px;
    background: white;
    margin-bottom: 0;
    position: fixed;
    inset: 0;
    left: auto;
    right: -500px;
    box-shadow: 0 0 2rem 1rem #0000000A;
    z-index: 3;
    padding-top: 2rem;
    overflow-y: auto;
}

.activeAside .productsListPageAside {
    right: 0;
}

.stickyHeaderActive.productsListPageAside {
    padding-top: 4rem;
}

.productsListPageContent {
    width: 100%;
}

.productsList {
    display: flex;
    /*justify-content: space-between;*/
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 1rem;
}

.option_list_container {
    display: none;
}

.productsList > .product {
    width: 23.8%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.productsList .product .entity_item {
    box-shadow: none;
    height: 100%;
    max-width: 240px;
}

.productsListPage .box {
    background: white;
    border-radius: var(--radius-m);
    padding: 0 1rem;
}

.productsListPage .box:not(:last-child) {
    margin-bottom: 30px;
}

.productsListPage .header {
    color: var(--primary) !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 1px solid #F4FAFE;
    margin-bottom: 10px;
    font-family: fontbold;
    transition: .2s;
    margin-top: 0;
}

.productsListPage .input, .productsListPage .select2-container--default .select2-selection--multiple {
    background: #EEEEEE;
    border-radius: 7px;
    padding: 10px;
    width: 100%;
    border: none;
}

.productsListPage *::placeholder {
    color: var(--primary);
    font-family: fontl;
}

.productsListPage .remove_filter {
    color: var(--danger);
    cursor: pointer;
}

#sidebar-category {
    margin-bottom: 0;
}

#sidebar-category.category a {
    font-size: medium;
    font-family: fontl;
    color: var(--tertiary);
    display: inline-block;
}

#sidebar-category.category a:hover {
    color: var(--primary);
}

#sidebar-category.category a.selected, .li_category.has-selected > a {
    text-shadow: none;
    color: var(--primary);
    font-family: fontbold;
}

#sidebar-category .li_category:not(:last-child) {
    margin-bottom: 20px;
}

#sidebar-category > li > ul > li > a {
    font-size: small;
}

#sidebar-category > li ul {
    margin-top: 10px;
}

.searchAsideBox {
    position: relative;
}

.productsListPage .searchBtn {
    background: transparent;
    border: none;
    position: absolute;
    left: 10px;
    top: 0;
    bottom: 0;
    padding: 0;
}

.productsListPage .select2-container--default .select2-search--inline .select2-search__field {
    margin: 0;
    line-height: 1;
}

/* 
  toggle old
*/

.toggel-aside-filter div:last-child {
    margin-bottom: 0px;
}

.toggel-aside-filter div {
    display: flex;
    margin-bottom: 20px;
    align-items: center;
    justify-content: space-between;
}

.toggel-aside-filter label {
    margin: 0;
}

.slider-existing {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #E2E2E2;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    border-radius: 7px;

}

.slider-existing:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 20px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    border-radius: 5px;
}

input:checked + .slider-existing {
    background-color: var(--primary);
}

input:focus + .slider-existing {
    box-shadow: 0 0 1px var(--primary);
}

input:checked + .slider-existing:before {
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px);
}

.switch-existing {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 20px;
}

.switch-existing input {
    opacity: 0;
    width: 0;
    height: 0;
}

.input_switcher {
    width: 18px;
    height: 18px;
    accent-color: var(--primary);
    margin-left: 5px;
}

.input_switcher:hover {
    border-color: var(--primary);
}

.c_switch {
    margin-bottom: 0;
    font-size: medium;
    color: #444444;
    display: flex;
    align-items: center;
}

/* 
  toggle new
*/

.toggle_component {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.toggle_component label {
    margin-bottom: 0;
}

.toggle_component input {
    display: none;
}

.toggle_component_controller {
    display: flex;
    gap: 1rem;
}

/* 
  not checked
*/

.toggle_component input:not(:checked) + .toggle_component_controller .false .background {
    fill: var(--primary);
}

.toggle_component input:not(:checked) + .toggle_component_controller .false .shape {
    fill: var(--secondary);
}

.toggle_component input:not(:checked) + .toggle_component_controller .true .background {
    fill: var(--secondary);
}

.toggle_component input:not(:checked) + .toggle_component_controller .true .shape {
    fill: var(--primary);
}

/* 
  checked
*/

.toggle_component input:checked + .toggle_component_controller .true .background {
    fill: var(--primary);
}

.toggle_component input:checked + .toggle_component_controller .true .shape {
    fill: var(--secondary);
}

.toggle_component input:checked + .toggle_component_controller .false .background {
    fill: var(--secondary);
}

.toggle_component input:checked + .toggle_component_controller .false .shape {
    fill: var(--primary);
}

.item_collapse_aside:not(:last-child) {
    margin-bottom: 10px;
}

.filter_content ul li {
    max-width: 100%;
    margin-left: 10px;
    margin-top: 5px;
}

.filter_content ul {
    padding: 0;
    margin: 8px 2px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

.filter_content ul li div {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    max-width: 100%;
    background: var(--secondary);
    border: 1px solid var(--primary);
    border-radius: 5px;
    color: var(--primary);
    letter-spacing: 0.3px;
    font-size: small;
    font-family: fontbold;
    line-height: 30px;
    padding: 0 10px 0 31px;
    position: relative;
}

.cancel_option::after {
    content: "\f00d";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    left: 11px;
    top: 0;
    position: absolute;
    font-size: 10px;
    cursor: pointer;
}

.nothing_found {
    text-align: center;
    width: 100%;
    font-family: fontbold;
    letter-spacing: 0.7px;
    font-size: large;
}

.header[aria-expanded="true"] {
    transition: .2s;
}

.header[aria-expanded="false"] {
    border-color: transparent;
    margin-bottom: 0;
    padding-bottom: 0;
}

.header[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.productsPageContentHeader {
    display: flex;
    align-items: center;
    background: var(--tertiary);
    padding: .5rem 1rem;
    border-radius: 2rem;
    margin-bottom: 1.5rem;
}

.productsSort {
    display: flex;
    align-items: center;
    font-family: fontbold;
    color: var(--tertiary);
    font-size: small;
}

.productsSort span {
    cursor: pointer;
    border-radius: 1rem;
    padding: .25rem 1rem;
    display: inline-block;
    color: var(--primary);
    position: relative;
}

.productsSort span:not(:last-child) {
    margin: 0 1rem;
}

.productsSort span::before {
    content: '';
    position: absolute;
    inset: 0;
    right: -1rem;
    width: 1px;
    height: 8px;
    background: black;
    margin: auto 0;
}

.productsSort span.selected {
    background: white;
}

.sort_q {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-left: 1rem;
}

.view_more_button {
    display: flex;
    align-items: center;
    padding: 1rem;
    background: var(--tertiary);
    border-radius: 1rem;
    border: none;
    margin: 1.5rem auto 0 auto;
}

.c_pagination {
    margin: 50px 0 30px 0;
}

.c_pagination .pagination {
    list-style: none;
    padding: 0;
    margin-bottom: 0;
}

.c_pagination .pagination .l {
    background: #E5E4F5;
    border-radius: 17px;
}

.c_pagination .pagination a {
    border: none;
    background: transparent;
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 10px;
    margin: 0 3px;
    font-size: small;
}

.c_pagination .all_count {
    display: none;
}

.c_pagination .pagination .double_angle a {
    padding-right: 5px;
    padding-left: 5px;
    border-radius: 17px;
    background: var(--primary);
    color: var(--secondary);
    font-family: fontbold;
}

.c_pagination .page-item {
    max-height: 45px;
}

.c_pagination .page-item.active .page-link {
    background-color: #222A5F;
    color: var(--secondary);
    border: none;
    border-radius: 17px;
    padding-bottom: 12px;
}

.btn-modal-filter {
    width: 100%;
    background: white;
    border: none;
    border-radius: 2rem;
    padding: .25rem 1rem;
    color: var(--primary);
    display: block;
}

.text_category_q, .list_tag {
    margin: 20px 0;
    font-family: fontbold;
    font-size: medium;
    line-height: 2;
}

.list_tag {
    color: var(--quaternary);
}

.text_category_q img, .content_product_q > .text img {
    margin-top: .5rem !important;
    margin-bottom: .5rem !important;
}

.text_category_q a, .content_product_q > .text a {
    font-family: inherit;
    font-size: inherit;
    color: var(--quaternary) !important;
}

.text_category_q *:not(h1,h2,h3,h5,b,strong), .text_category_q, .content_product_q > .text, .content_product_q > .text *:not(h1,h2,h3,h5,b,strong) {
    color: #9e9fb1;
    line-height: 2;
}

.text_category_q *:is(h1,h2,h3,h5,b,strong), .content_product_q > .text *:is(h1,h2,h3,h5,b,strong) {
    color: #5a5c7a;
    line-height: 2;
}

._prf {
    margin-left: 10px;
    display: none;
}

._prf img {
    border-radius: 100%;
    object-fit: contain;
}

._brandImag img {
    width: 100%;
    object-fit: contain;
    margin-bottom: 10px;
    border-radius: 10px;
}

._brandImag {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: fontbold;
    color: #444444;
    font-size: medium;
}

.filter-dropdown-box {
    display: none;
}

@media screen and (max-width: 992px) {
    .btn-modal-filter {
        font-size: small;
    }

    .sort_q {
        width: 100%;
        margin-left: 0;
    }

    .sort_q > * {
        flex: 1 1 100%;
    }

    .productsListPage .box {
        box-shadow: none;
        padding: 20px 0;
    }

    .productsListPageAside {
        padding: 0 1rem;
    }

    .productsListPageContent {
        width: 100%;
    }

    ._prf {
        display: block;
    }

    ._brandImag {
        display: none;
    }

    .productsSort {
        display: none;
    }

    .filter-dropdown-box {
        display: block;
    }

    :is(.productsListPage,.productDetailPage) .contentBox {
        flex-direction: column;
        align-items: center;
        max-width: 90%;
        margin-top: 70px;
    }

    .productDetailPage .contentBox {
        max-width: 100%;
    }

    :is(.productsListPage,.productDetailPage) .contentBox .image {
        margin-top: -75px;
    }

    :is(.productsListPage,.productDetailPage) .contentBox .image img {
        width: 115px;
        height: 115px;
        border-radius: 100%;
    }

    .view_more_button {
        padding-top: .5rem;
        padding-bottom: .5rem;
    }

    :is(.productsListPage,.productDetailPage) .contentBox .text .goToDown {
        margin-left: auto;
    }

    :is(.productsListPage,.productDetailPage) .contentBox .text {
        max-width: unset;
    }

    .productsListPage .contentBox .text .body-entity {
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .content_product_q > .image {
        display: none;
    }

    .content_product_q > .text {
        width: 100%;
    }

}

@media screen and (max-width: 768px) {

    .products_count {
        display: none;
    }

    .productsList {
        gap: .5rem;
    }

    .productsList > .product {
        width: calc(33.3% - 0.25rem);
    }

    .productsList .product .entity_item {
        max-width: 100%;
    }
}

@media screen and (max-width: 576px) {
    .productsList > .product {
        width: calc(50% - 0.25rem);
    }
}

@media screen and (max-width: 320px) {
    .productsList > .product {
        width: 100%;
    }
}


/*
    id
*/

.productDetailPageContainer {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.productDetailPageRightBox {
    width: 280px;
}

.productDetailPageLeftBox {
    width: calc(100% - 304px);
    display: flex;
    flex-direction: column;
}

.productDetailPageLeftBoxRow {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
}

.productDetailPageLeftBox hr {
    margin-top: 0;
    margin-bottom: 0;
    border-color: #E1E2E4;
    width: 100%;
}

.technical_specifications ul {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(50% - .8rem), 1fr));
    grid-gap: 1.5rem;
    padding: 0;
    list-style: none;
    margin-bottom: 0;
}

.technical_specifications ul > li {
    padding: .5rem 1rem;
    background: #F5F5F5;
    border-radius: 1rem;
    display: flex;
}

.technical_specifications ul > li .key {
    margin-left: 1rem;
    padding-left: 1rem;
    border-left: 1px solid #E1E2E4;
    width: 20%;
}

.technical_specifications ul > li .value {
    max-width: 70%;
}

/*.main_image {*/
/*    height: 319px;*/
/*    width: 228px;*/
/*    border-radius: 15px;*/
/*    margin-right: 20px;*/
/*}*/


.related_products {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-bottom: 4rem;
}

.related_product {
    display: flex;
    padding: 1rem 1.5rem;
    border-radius: 1rem;
    border: 2px solid #E1E2E4;
    align-items: center;
}

.related_product .img {
    margin-left: .5rem;
}

.related_product .img img {
    width: 45px;
    height: 45px;
    border-radius: 100%;
    object-fit: cover;
}

.related_product .price {
    display: flex;
    align-items: center;
    margin-right: auto;
    margin-left: 1rem;
    padding-left: 1rem;
    border-left: 2px solid #2E2F33;
}

.related_product .price .entityPrice {
    margin-top: 0;
}


.related_product .add_basket {
    padding: .3rem 1.7rem;
    border-radius: 1rem;
    background: #E5E4F5;
    transition: .2s;
}

.related_product .add_basket:hover {
    background: var(--quaternary);
    color: white;
}

.related_product .add_basket .mobile {
    display: none;
}


.main_image {
    max-width: 100%;
    margin-bottom: 1rem;
}

.productImages .thumbs {
    width: 100%;
    height: max-content;
}

.main_image .entity_image_box:not(.product) img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.productImages {
    display: flex;
    background: var(--tertiary);
    border-radius: 1rem;
    padding: 1rem;
    margin-bottom: 2rem;
    flex-direction: column-reverse;
}

.thumbs img {
    height: 63px;
    width: 63px;
    border-radius: .5rem;
    object-fit: cover;
}

.arrowNext:after, .arrowPrev:after {
    font-size: x-large;
    color: var(--primary);
    display: none;
}

.productImages .paginationProduct {
    margin-top: 1rem;
    display: flex;
    gap: 1rem;
}

.productImages .paginationProduct .swiper-pagination-bullet {
    height: 4px;
    margin: 0;
    flex: 1 1 auto;
    max-width: 70px;
    border-radius: 0.5rem;
    background: #E1E2E4;
}

.productImages .paginationProduct .swiper-pagination-bullet-active {
    background: var(--quaternary);
}

.productImages .thumbs .swiper-slide:nth-child(4):after {
    content: '';
    position: absolute;
    width: 63px;
    height: 63px;
    border-radius: 17px;
    filter: blur(10px);
    inset: 0;
    bottom: auto;
    z-index: 10;
}

.availabilityProduct {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    background: white;
    background: white;
    border-radius: 17px;
    margin-bottom: 30px;
}

.remainCount {
    text-align: right;
    color: var(--danger);
    font-size: small;
    width: 100%;
}

.availabilityProduct > * {
    font-family: fontl;
    color: #C4C4C4;
    font-size: small;
}

.availabilityProduct strong {
    font-weight: normal;
    color: var(--primary);
}

.availabilityProduct img {
    margin-left: 10px;
}

.purchaseInformation {
    padding: 1rem;
    background: var(--tertiary);
    border-radius: 1rem;
    align-items: center;
    flex-wrap: wrap;
    opacity: 0;
    display: none;
    transition: .2s;
}

.purchaseInformation.active {
    display: flex;
    opacity: 1;
}

.priceBoxProduct {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.discountProduct .discount {
    padding: 0px 7px;
    background: #FF4B4B;
    border-radius: 17px;
    color: white;
    font-family: fontbold;
    font-size: small;
}

.discountProduct .originalPrice {
    color: #C4C4C4;
    margin-left: 5px;
}

.priceProduct {
    font-family: fontbold;
    font-size: medium;
}

.priceProduct small {
    font-family: fontl;
    color: #C4C4C4;

}

.addToBasket {
    margin-right: auto;
}

.addToBasket :where(.add_basket, .notify_me) {
    background: var(--quaternary);
    color: white;
    padding: 1rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: medium;
    transition: .2s;
    margin-right: auto;
    width: 100%;
    gap: .5rem;
}

.addToBasket #basket-quick-add-modal {
    width: 100%;
    position: relative;
}

.addToBasket .go_to_basket {
    font-size: small;
    color: #19bfd3;
    position: absolute;
    bottom: -25px;
    width: 110px;
    left: 0;
    text-align: left;
}

@media screen and (max-width: 992px) {

    .addToBasket .go_to_basket {
        left: calc(-100% - .5rem);
        bottom: auto;
    }

    .hasSameProducts .addToBasket .go_to_basket {
        /*left: calc(-100% - .5rem);*/
        /*bottom: auto;*/
        position: unset;
    }

}

.addToBasket .addBasketControl.fullControl.basket-quick-add-modal .each-item-outer-wrapper {
    position: unset;
}

.addToBasket .addBasketControl .basket_quick {
    background: var(--quaternary);
    gap: 1rem;
    border-radius: 1rem;
    padding-top: .3rem;
    padding-bottom: .3rem;
    margin-bottom: 1rem;
}

.addToBasket .addBasketControl button {
    color: white;
    font-size: x-large;
}

.addToBasket * {
    font-size: medium;
}

.addToBasket > .add_basket {
    font-family: fontbold;
}

.addToBasket .mobile {
    display: none;
}

.multi_price_title {
    flex: 1 1 100%;
    padding: 0;
    margin-bottom: 0;
    list-style: none;
    display: flex;
    gap: .5rem;
    color: var(--tertiary);
    margin-left: auto;
    margin-top: .5rem;
}

.multi_price_title > * {
    font-size: small;

}

.vendros_box {
    border: 1px solid var(--primary);
    border-radius: .5rem;
    overflow: hidden;
}

.vendor_header {
    background: var(--primary);
    color: var(--secondary) !important;
    width: 100%;
    border-radius: .5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .5rem 1rem;
    font-family: fontbold;
}

.vendros_box .vendor_item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .5rem;
    padding-top: 0;
    margin-top: 1rem;
}

.vendros_box .vendor_item:not(:last-child) {
    border-bottom: 1px solid var(--primary);
}

.vendros_box .vendor_item .vendor_info > span {
    color: var(--primary);
}

.vendor_item .addToBasket {
    border: none;
    border-radius: .5rem;
}

#changeVendor .submit {
    background: var(--primary);
    color: var(--secondary) !important;
}

#changeVendor .unsubmit {
    background: var(--secondary);
    color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.multi_price_btn_group {
    width: calc(100% - 120px);
    background: var(--secondary);
    color: var(--primary);
    border-radius: 15px;
    position: relative;
    margin-right: auto;
}

.multi_price_box {
    background: transparent;
    color: var(--primary);
    border: none;
    padding: 8px;
    text-align: center;
    line-height: normal;
    font-weight: normal;
    font-size: medium;
    font-family: fontbold;
    width: calc(100% - 35px);
}

.multi_price_btn_group .dropdown-toggle-split {
    width: 30px;
    border: none;
    background: var(--primary);
    color: var(--secondary);
    border-bottom-right-radius: 17px;
    border-top-right-radius: 17px;
}

.multi_price_label {
    width: 100px;
    overflow: hidden;
    color: var(--primary);
    font-size: medium;
}

.multi_price_box:after {
    margin-right: 10px;
}

.multi_price_names {
    border: none;
    border-radius: 5px;
    background: #F5F5F5;
    color: #B9B9B9;
    width: 100%;
}

.multi_price_names .dropdown-item {
    padding: 5px 10px;
    min-width: 38px;
    font-size: medium;
    text-align: center;
}

.multi_price_names .dropdown-item.active, .multi_price_names .dropdown-item:active {
    background: var(--primary);
}

.productDetailPageInfo {
    width: calc(100% - 239px);
    position: relative;
}

.productDetailPageInfo.dontHaveSuggestion {
    width: 100%;
}

.productDetailPageInfoHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.productDetailPageInfoHeader .productTitle {
    width: calc(100% - 172px);
}

.productDetailPageInfoHeader .productTitle h1 {
    font-size: 1.7rem;
    font-family: fontbold;
    margin-bottom: .5rem;
    color: var(--primary);
}

.productDetailPageInfoHeader .productTitle h2 {
    font-size: 1rem;
    font-family: fontl;
    margin-bottom: 0;
    color: var(--primary);
}

.productScore .star_vote {
    width: 20px;
    height: 25px;
    overflow: hidden;
    transition: .2s;
    margin-right: 10px;
}

.productScore:hover .star_vote {
    width: 115px;
}

.productScore {
    display: flex;
    align-items: center;
    font-family: fontl;
    font-size: small;
    color: #EBB513;
    cursor: pointer;
}

.productScore > span {
    font-family: fontbold;
    font-size: medium;
    margin-left: 1px;
}

.productDetailPageInfoProperty {
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
}

.productDetailPageInfoProperty .left {
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
}

.productAddToBasket {
    /*position: absolute;*/
    /*left: 0;*/
    /*bottom: 0;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    padding: 1rem;
    background: #f5f8fd;
    border-radius: 1rem;
}

.productAddToBasket .addToBasket .add_basket {
    padding: .5rem 1rem;
}

.productDetailPageInfoProperty .right {
    max-width: calc((100% - 250px) - 1rem);
    flex: 1 0 auto;
}


.productDetailPageInfoProperty ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 1rem;
    overflow-x: auto;
    height: 160px;
}

.hasSameProducts .productDetailPageInfoProperty ul {
    max-height: 200px;
    height: max-content;
}

.productDetailPageInfoProperty ul li {
    max-width: 260px;
}

.productDetailPageInfoProperty .relatedImg {
    width: 20px;
    height: 20px;
    object-fit: contain;
    background: white;
    border-radius: 100%;
    transition: .2s;
}

.productDetailPageInfoProperty .relatedImg:hover {
    scale: 2.2;
}

.productDetailPageInfoProperty .key {
    font-family: fontl;
    color: #616161;
    margin-left: 10px;
    font-size: medium;
}

.productDetailPageInfoProperty .value {
    font-family: fontbold;
    color: #616161;
}

.productDetailPageInfoProperty .value a, .productDetailPageInfoProperty .category a {
    color: var(--quaternary);
    font-family: fontbold;
    font-size: inherit;
    /*text-decoration: underline 1px dashed var(--primary);*/
    cursor: pointer;
    /*text-underline-offset: 5px;*/
}

.productDetailPageInfoProperty .value:not(:last-child) {
    margin-left: 10px;
    margin-bottom: 10px;
}

.productDetailPageInfoProperty :is(.brand, .author) .value {
    /*background: var(--secondary);*/
    border-radius: .5rem;
    padding: 2px 6px;
    display: inline-block;
    transition: .2s;
    color: var(--quaternary);
}

.productDetailPageInfoProperty :is(.brand, .author) .value:hover {
    background: var(--quaternary);
}

.productDetailPageInfoProperty :is(.brand, .author) .value:hover a {
    color: white;
}

.productDetailPageInfoProperty :is(.brand, .author) .value a {
    text-decoration: none;
}

.productDetailPageAction {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.productDetailPageAction > * {
    width: 1.75rem;
    height: 1.75rem;
    background: var(--tertiary);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.add-like[status="1"] ._liked {
    display: block !important;
}

.add-like[status="1"] ._like {
    display: none !important;
}

.add-like[status="0"] ._liked {
    display: none;
}

.add-bookmark[status="1"] ._liked {
    display: block !important;
}

.add-bookmark[status="1"] ._like {
    display: none !important;
}

.add-bookmark[status="0"] ._liked {
    display: none;
}

.productDetailPageInfoRow {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.downloadPdf {
    border: 1px solid var(--quaternary);
    padding: .5rem 1rem;
    border-radius: 1rem;
    color: var(--quaternary);
    font-size: small;
    /*position: absolute;*/
    inset: 0;
    width: max-content;
    height: max-content;
    margin: auto auto auto 0;
}

.downloadPdf svg {
    margin-left: 7px;
}

.downloadPdf svg path {
    transition: .2s;
}

.downloadPdf:hover svg path {
    stroke: white;
}

.downloadPdf:hover {
    background: var(--quaternary);
    color: white;
}

.taaghche {
    display: flex;
    align-items: center;
    gap: 1rem;
    border-radius: var(--radius-m);
    padding: .5rem 1rem;
    color: white !important;
    font-family: fontbold;
    background: #00a2a4;
}

.taaghche img {
    width: 25px;
    height: 25px;
    object-fit: contain;
}

.productDetailPageTag {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.productDetailPageTag > span {
    font-family: fontl;
}

.productDetailPageTag .swiper-slide {
    width: max-content;
}

.productDetailPageTag a {
    border-radius: 1rem;
    border: 1.5px solid #E1E2E4;
    padding: .25rem 1rem;
    color: var(--primary);
    font-family: fontl;
    display: block;
}

.productDetailPageTag a:hover {
    background: var(--tertiary);
    /*font-family: fontbold;*/
}

.categoryProductContainer {
    width: calc(100% - 90px);
    margin-left: 0;
}

.related_content_box {
    display: flex;
}

/*.categoryProductContainer .swiper-button-next, .categoryProductContainer .swiper-button-prev {*/
/*    background: white;*/
/*}*/

/*.categoryProductContainer .swiper-button-next:after, .categoryProductContainer .swiper-button-prev:after {*/
/*    content: none;*/
/*}*/

.tagArrowNext {
    left: 0 !important;
}

.tagArrowPrev {
    right: 0 !important;
}

.categoryProductContainer .swiper-button-disabled {
    opacity: 0;
}

.productDetailPageBenefit {
    width: 215px;
    margin-left: 0;
    background: var(--tertiary);
    border-radius: 15px;
    padding: 2rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.suggestionHeader {
    font-family: fontbold;
    font-size: 15px;
    color: var(--primary);
    border-bottom: 1px solid var(--tertiary);
    margin-bottom: 10px;
    padding-bottom: 10px;
    position: relative;
}

.suggestionHeader:after {
    content: '';
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 60%;
    height: 1px;
    background: var(--primary);
}

.suggestionItem {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.suggestionImg {
    height: 290px;
    width: 187px;
    object-fit: cover;
    border-radius: 15px;
}

.suggestionPagination {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}

.suggestionPagination .swiper-pagination-bullet {
    background: #CFD1D2;
}

.suggestionPagination .swiper-pagination-bullet-active {
    background: var(--primary);
}

.interactionUser {
    margin-bottom: 2rem;
}

.interactionUser ul {
    padding: .5rem 2rem;
    list-style: none;
    display: flex;
    background: var(--tertiary);
    border-radius: 1rem;
}

.interactionUser > ul a {
    padding: .25rem 0;
    transition: .2s;
    font-family: fontbold;
    border-bottom: 1px solid transparent;
    display: inline-block;
}

.interactionUser > ul a:is(:hover,:focus) {
    border-color: var(--primary);
}

.interactionUser > ul > li {
    margin-left: 1rem;
    padding-left: 1rem;
    position: relative;
}

.interactionUser > ul > li:not(:last-child)::after {
    content: '';
    position: absolute;
    inset: 0;
    right: auto;
    margin: auto;
    margin-left: 0;
    width: 1px;
    height: 16px;
    background: var(--primary);
}

.interactionUser > ul a:focus, .interactionUser > ul a:hover, .interactionUser ul > li:first-child a {
    color: var(--primary);
}

section.detail, .comments {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

section.detail .productsCarouselContainer {
    padding: 1rem 1.5rem;
    border-radius: 2rem;
    border: 1.5px solid #E1E2E4;
}

/*.descriptionProduct {*/
/*    margin-bottom: 4rem;*/
/*}*/

.descriptionProduct .dynamic-height-wrap *:is(h1,h2,h3,h4,h5) {
    font-size: x-large;
    color: #444444;
    font-family: fontbold;
    margin-bottom: 15px;
}

.descriptionProduct .dynamic-height-wrap *:not(h1,h2,h3,h4,h5,strong,b) {
    color: #444444;
    font-family: fontl;
    line-height: 30px;
    text-align: justify;
}

.dynamic-height-wrap {
    width: 100%;
    transition: 0.25s ease-in-out;
    overflow: hidden;
}

.js-dynamic-show-hide:not(.forProperty) {
    display: block;
    position: relative;
    padding: 1rem;
    background: var(--secondary);
    color: #2E2F33;
    border: 0;
    z-index: 1;
    border-radius: 1rem;
    background: var(--tertiary);
}

.js-dynamic-show-hide.forProperty {
    display: block;
    position: relative;
    padding: 0;
    background: transparent;
    color: #008eb2;
    border: 0;
    z-index: 1;
    border-radius: 1rem;
}

.js-dynamic-show-hide > img {
    margin-right: 10px;
}

.btn_more_summary {
    /*padding: 10px 0;*/
    display: flex;
    justify-content: flex-start;
    transition: 0.4s;
    position: relative;
}

/*.dynamic-height-active .btn_more_summary::after {*/
/*    background: linear-gradient(*/
/*            180deg,*/
/*            hsla(0, 0%, 100%, 0),*/
/*            whitesmoke 99%,*/
/*            whitesmoke*/
/*    );*/
/*    content: "";*/
/*    position: absolute;*/
/*    right: 0;*/
/*    left: 0;*/
/*    opacity: 1;*/
/*    bottom: 0;*/
/*    height: 120px;*/
/*    z-index: 1;*/
/*    transition: 0.4s;*/
/*}*/

/*#submit-comment {*/
/*    padding-top: 25px;*/
/*}*/

.inputsReview {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.vInput {
    flex: 1 1 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 0;
    font-family: fontl;
    color: var(--primary);
    max-width: calc(50% - 10px);
}

.textareaReview {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 30px;
}

.textareaReview > label {
    margin-bottom: 0;
    font-family: fontl;
    color: var(--primary);
}

.vInput > input, .textareaReview textarea {
    background: #EEEEEE;
    color: var(--primary);
    border-radius: 17px;
    border: none;
    padding: 17px 20px;
}

.register_captcha .vInput {
    max-width: 370px;
}

.register_captcha .captcha_reload {
    margin-left: auto;
    margin-right: 20px;
}

.submitBtn {
    padding: 1rem 0px;
    color: white;
    background: var(--quaternary);
    border-radius: 1rem;
    border: none;
    width: 200px;
}

/*.bodyReview {*/
/*    margin-top: 2rem;*/
/*    max-height: 400px;*/
/*    overflow-y: auto;*/
/*}*/

.userBox {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    background: var(--tertiary);
    padding: 2rem;
    border-radius: 1rem;
}

.userBox:not(:last-child) {
    margin-bottom: 25px;
}

.userCommentInfo {
    display: flex;
    margin-bottom: .5rem;
}

.usernameComment {
    color: var(var(--tertiary));
    margin-left: 1rem;
}

.dateComment {
    font-family: fontl;
    color: #616161;
    font-size: small;
}

.userComment {
    font-family: fontl;
    text-align: justify;
    line-height: 2;
    color: #616161;
}

.adminComment {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #E0E0E0;
    font-family: fontl;
    display: flex;
    align-items: center;
    color: #616161;
}

.adminComment .title {
    margin-left: 1rem;
}

.adminComment .title img {
    width: 2.5rem;
    height: 2.5rem;
    object-fit: contain;
}

@media screen and (max-width: 992px) {

    .hasSameProducts .productDetailPageInfoProperty ul {
        max-height: unset;
        height: auto;
        gap: .5rem;
    }

    .related_product {
        flex-wrap: wrap;
    }

    .related_product .title {
        flex: 1 1 calc(100% - (.5rem + 45px));
    }

    .related_product .price {
        margin-right: 0;
        margin-left: auto;
        padding-left: 0;
        border-left: none;
    }

    .related_product .add_basket {
        padding: .6rem;
        background: var(--tertiary);
        border-radius: .5rem;
    }

    .related_product .add_basket .mobile {
        display: block;
    }

    .related_product .add_basket .desktop {
        display: none;
    }

    .productDetailPageInfoHeader .productTitle h1 {
        font-size: medium;
    }

    .productDetailPageInfoHeader .productTitle h2 {
        font-size: small;
    }

    .productDetailPageContainer, .productDetailPageLeftBoxRow, .hasSameProducts .productDetailPageInfoRow {
        flex-direction: column;
    }

    .productDetailPageRightBox {
        width: 100%;
    }

    .productImages {
        max-width: 320px;
        margin-right: auto;
        margin-left: auto;
        background: none;
        padding: 0;
    }

    .productImages .entity_image {
        height: 250px;
    }

    .productImages .entity_image_box.product:not(.error) {
        width: max-content;
    }


    .productImages .thumbs {
        display: none;
    }

    .main_image {
        width: 100%;
        height: 100%;
        margin: 0;
    }

    .productDetailPageLeftBox, .productDetailPageInfo {
        width: 100%;
    }

    .productDetailPageInfo::after, .productDetailPageInfo::before {
        content: none;
    }

    .productDetailPageInfo {
        border: none;
        padding: 0;
        margin: 1.5rem 0 0;
    }

    .productDetailPageBenefit {
        display: none;
    }

    .productDetailPageInfoProperty {
        flex-direction: column;
        gap: 1rem;
        margin-bottom: .5rem;
    }

    .productDetailPageInfoProperty ul {
        height: auto;
    }

    .hasSameProducts .productDetailPageAction {
        max-width: unset;
    }

    .hasSameProducts .productDetailPageInfoRow {
        gap: 10px;
    }

    .arrowNext:after, .arrowPrev:after {
        display: block;
    }

    .productDetailPageAction {
        width: 100%;
        justify-content: space-between;
    }

    .productDetailPageAction > * {
        width: 2.5rem;
        height: 2.5rem;
    }

    .productDetailPageAction img {
        width: 1.25rem;
        height: 1.25rem;
    }

    .interactionUser {
        margin-bottom: 1rem;
    }

    section.detail, .comments {
        gap: .5rem;
    }

    .technical_specifications ul {
        grid-template-columns: repeat(auto-fill, 100%);
    }

    section.detail .productsCarouselContainer {
        padding: 0;
        border: none;
    }

    .inputsReview {
        flex-direction: column;
    }

    .vInput {
        max-width: none;
    }

    .productsCarousel.lastVisit .productsCarouselContainer {
        padding: 0 1rem;
        border: none;
    }
}

@media screen and (max-width: 480px) {

    .productDetailPageInfoProperty .relatedImg {
        width: 40px;
        height: 40px;
    }

    .adminComment {
        margin-right: 0;
    }

    .productDetailPageInfoHeader .productTitle {
        font-size: large;
        font-family: fontbold;
        width: 100%;
        margin-bottom: 1rem;
    }

    .productDetailPageInfoHeader {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 1rem;
    }

    .productScore .star_vote {
        width: max-content;
        height: auto;
    }

    .productScore:hover .star_vote {
        width: max-content;
    }

    .productDetailPageTag a {
        font-size: small;
    }

    .productAddToBasket {
        display: none;
    }

    .productBasketBtn {
        display: flex;
        width: 100%;
    }

    .productBasketBtn .basket-quick-add {
        background: transparent;
    }

    .productDetailPageInfoProperty .right {
        max-width: unset;
        width: 100%;
    }

    .productDetailPageInfoProperty .left {
        align-items: flex-start;
        width: 100%;
    }

    .purchaseInformation {
        opacity: 1 !important;
        position: fixed;
        z-index: 100;
        right: 0;
        left: 0;
        margin: auto;
        bottom: 0;
        width: 100%;
        box-shadow: rgba(0, 0, 0, 0.2) 0 25px 20px 20px;
        border-radius: 0;
        flex-direction: row-reverse;
        padding: 1rem;
        background: var(--tertiary);
        display: flex;
    }

    .desktop_vendors_product {
        display: none;
    }

    .addToBasket.unavailable.haveOtherVendor {
        background: none;
        padding: 0;
    }

    .addToBasket.unavailable.haveOtherVendor .desktop {
        display: none;
    }

    .addToBasket.unavailable.haveOtherVendor .mobile {
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        width: 100%;
        gap: .5rem;
    }

    .addToBasket.unavailable.haveOtherVendor .mobile > div {
        font-size: small;
    }

    .addToBasket.unavailable.haveOtherVendor .mobile b {
        color: var(--danger);
    }

    .addToBasket.unavailable.haveOtherVendor .openModal {
        border: none;
        background: var(--primary) !important;
        color: var(--secondary) !important;
        font-family: fontbold;
        border-radius: .5rem;
        padding: .5rem;
    }

    .addToBasket {
        margin-left: auto;
        margin-right: 0;
    }

    .addToBasket .desktop {
        display: none;
    }

    .addToBasket .mobile {
        display: block;
    }

    .downloadPdf {
        position: unset;
        margin: 0;
    }

    .hasSameProducts .productDetailPageInfoRow {
        flex-direction: column
    }

    .hasSameProducts .productDetailPageAction {
        margin-bottom: 15px;
        margin-left: auto;
    }

    .hasSameProducts .downloadPdf {
        width: 100%;
        margin-bottom: 10px;
        text-align: center;
    }

    .hasSameProducts .purchaseInformation {
        width: 100%;
    }

    .interactionUser > ul > li > a {
        display: block;
        width: max-content;
    }

    .interactionUser ul {
        overflow-x: auto;
        padding-right: .5rem;
    }

    .hasSameProducts .addToBasket {
        padding: 10px 25px;
        height: auto;
    }

    .register_captcha label > div {
        width: 100%;
        margin: 15px 0;
    }

}


/*
    blog id
*/

.blog_id > .blog_container {
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
    /* background: #efeeeb; */
    border-radius: 8px;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.blog_id .blog_image {
    margin-bottom: 2rem !important;
}

.blog_id .blog_media {
    width: 100% !important;
    height: auto !important;
    margin-bottom: 2rem !important;
}

.blog_id .blog_header {
    position: relative;
    margin-bottom: 109px;
}

.blog_id .blog_header .blog_title_box {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.blog_id .blog_title {
    color: var(--primary);
    font-family: fontbold;
    margin-bottom: 0;
    line-height: 2;
}

.blog_id .blog_description {
    border-radius: 10px;
    background: #f5f5f5;
    padding: 10px;
    margin-bottom: 20px;
    line-height: 2 !important;
}

.blog_header figure {
    margin-bottom: 0;
}

.tags_blog .tag_blog {
    color: #CF8288;
    font-family: fontbold;
    margin-bottom: 15px;
    margin-left: 10px;
    display: inline-flex;
}

.blog_main {
    margin-bottom: 1rem;
}

.blog_main .blog_body *:not(h1,h2,h3,h4,h5,b,stong) {
    line-height: 2;
    text-align: justify;
}

.blog_main img {
    max-width: 100%;
    height: auto;
    margin: auto;
    display: block;
}

.blog_main a {
    color: var(--primary);
}

.blog_aside > h4 {
    color: var(--tertiary);
    margin-bottom: 30px;
}

.blog_aside .blog_with_tag {
    width: 100%;
}

.blog_related {
    position: relative;
    display: flex;
}

.blog_aside > .blog_related {
    margin-bottom: 45px;
}

.blog_related_img {
    width: 100%;
}

.blog_related_img img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    border-radius: 25px;
}

.blog_related_info {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 15px;
}

.blog_related_info h5 {
    color: var(--primary);
    margin-bottom: 8px;
    font-family: fontbold;
}

.blog_related_info p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--tertiary);
    font-family: fontlight;
    font-size: small;
    max-width: 195px;
}

@media screen and (max-width: 992px) {
    .blog_id > .blog_container {
        flex-direction: column;
    }

    .blog_main {
        width: 100%;
        margin-bottom: 15px;
    }

    .blog_aside {
        width: 100%;
    }

    .blog_related_img img {
        height: 300px;
    }

}

@media screen and (max-width: 768px) {
    .blog_title_box {
        right: 15px;
    }

}

/* 
  blog q
*/

.blogBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 50px;
}

.imageBlogBoxItem img {
    width: 100%;
    height: 170px;
    object-fit: cover;
}

.blogBoxItem {
    display: block;
    border-radius: 15px;
    overflow: hidden;
    transition: 0.3s
}

.blogBoxItem:hover {
    box-shadow: 0 50px 55px 0 rgba(0, 0, 0, 0.05),
    0 -10px 55px 0 rgba(0, 0, 0, 0.05);
}

.contentBlogBoxItem {
    margin-top: -10px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    padding: 15px 20px;
    z-index: 2;
    position: relative;
    background: #F3F3F3;
}

.titleBlogBoxItem {
    font-family: fontbold;
    font-size: medium;
    text-align: right;
    color: var(--primary);
    margin-bottom: 15px;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.bodyBlogBoxItem {
    text-align: justify;
    font-size: small;
    font-family: fontl;
    color: var(--tertiary);
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/*
    use ck
*/


.use_ck img,
.use_ck svg,
.use_ck video {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}


.use_ck img {
    border-radius: .5rem;
}

/*
    breadcrumb
*/
._breadcrumb {
    margin-bottom: 1.5rem;
}

._breadcrumb ol {
    display: flex;
    list-style: none;
    padding: 1rem;
    margin: 0;
    background-color: white;
    border-radius: 1rem;
    overflow-y: auto;
}

._breadcrumb ol > li {
    padding-left: 1rem;
    margin-left: .5rem;
    position: relative;
    min-width: max-content;
}

._breadcrumb ol > li:not(:last-child):after {
    content: '/';
    position: absolute;
    inset: 0;
    right: auto;
    color: #E1E2E4;
}

._breadcrumb a, ._breadcrumb li {
    /*font-family: fontl;*/
    color: var(--primary);
}

._breadcrumb li:last-child a, ._breadcrumb li:last-child {
    color: var(--primary);
}

@media screen and (max-width: 992px) {
    ._breadcrumb {
        margin-bottom: 1rem;
    }
}

/*
     Skeleton
*/
@keyframes skeleton-loading {
    0% {
        background-color: hsl(200, 20%, 80%);
    }
    100% {
        background-color: hsl(200, 20%, 95%);
    }
}

.skeleton {
    position: relative;
    display: block;
    border-radius: 17px;
    max-width: 100%;
    min-height: 250px;
}

.skeleton[alt]::after {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: auto;
    color: transparent;
    text-align: center;
    content: attr(alt);
    background: white url("../../../../file/logos/logo.png") no-repeat 50%;
    background-size: 60%;
    animation: skeleton-loading 1s linear infinite alternate;
}

.entity_image.skeleton {
    max-height: 224px;
}

.notProduct .entity_image.skeleton {
    min-height: 150px;
    max-height: 150px;
}

@media screen  and (max-width: 992px) {
    .entity_image.skeleton {
        min-height: 190px;
    }
}

.qContainer {
    gap: 2rem;
}

.qContainer .itm {
    flex: 1 0 100%;
    max-width: calc((100% / 3) - 1.4rem);
}

@media screen and (max-width: 768px) {
    .qContainer .itm {
        max-width: 100%;
    }
}

.step_dots .dots .dot.active .photo {
    background: var(--quaternary)
}

.step_dots .dots .dot.active a span {
    color: var(--quaternary)
}

.basket_c_btn {
    background: var(--quaternary)
}

.c_form .login_btn {
    background: var(--quaternary)
}

.sign_footer_link > div::after {
    background: var(--quaternary)
}

.c_form .c_input:focus {
    border-color: var(--quaternary)
}

.c_check input:checked ~ .checkmark {
    background-color: var(--quaternary);
}

.c_check:hover input ~ .checkmark {
    background-color: var(--quaternary);
}

.toggle-rating-pill {
    border-color: var(--quaternary) !important;
}

.smile-rating-toggle {
    background: var(--quaternary) !important;
}

.s_dashboard .side_menu header h1 {
    background: var(--quaternary) !important;
}

.step_dots .dots .dot.active:not(:first-child)::before {
    background: var(--quaternary);
}

.s_dashboard .member_dashboard_action a {
    color: var(--quaternary) !important;
}

.s_dashboard .member_dashboard_action span::before {
    border-color: var(--quaternary) !important;
}

/*
    faq
*/

.itemFaq {
    padding: 1rem 2rem;
    border: 1px solid #E1E2E4;
    border-radius: 2rem;
}

.itemFaq:not(:last-child) {
    margin-bottom: .5rem;
}

.btnItemFaq {
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background: none;
    border: none;
    font-family: fontbold;
    color: var(--primary);
    text-align: right;
}

.btnItemFaq[aria-expanded="false"] .b {
    display: none;
}

.btnItemFaq[aria-expanded="true"] .a {
    display: none;
}

.bodyItemFaq {
    margin-top: 1rem;
    color: var(--primary);
    font-family: fontl;
}

@media screen and (max-width: 992px) {
    .btnItemFaq {
        font-size: small;
        font-family: fontmedium;
    }

    .bodyItemFaq {
        font-size: small;
    }
}

/*
    content_box
*/

.contentBoxContainer {
    display: flex;
}

.contentBoxContainer .column {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.contentBoxContainer .column:nth-child(1) .img_box {
    padding: 1.5rem;
    border-radius: 0 var(--radius-x) var(--radius-x) 0;
}

.contentBoxContainer .column:nth-child(2) {
    padding: 1.5rem;
    border-radius: 0 var(--radius-x);
}

.contentBoxContainer .column:nth-child(2) .box {
    padding: 1.5rem;
    background: white;
    border-radius: 2rem;
    text-align: justify;
    height: 100%;
    overflow-y: auto;
    max-height: 460px;
}

.contentBoxContainer .column:nth-child(3) .img_box {
    padding: 1.5rem;
    border-radius: var(--radius-x) 0 0 var(--radius-x);
}

.content_box_link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1rem 0 0;
}

.content_box_link a {
    padding: 1rem 1.5rem;
    border-radius: 1rem;;
}

.contentBoxContainer .img_box {
    padding: 1.5rem;
    border-radius: var(--radius-x);
    position: relative;
}

.content_box_logo {
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    padding: 0 1.5rem;
    position: relative;
    margin: auto 0;
}

.contentBoxContainer .column:nth-child(1) .img_box:after {
    content: '';
    width: 50px;
    height: 50px;
    position: absolute;
    left: 0;
    top: -51px;
    background: white;
    border-radius: 2rem/2rem 0 0 0;
    transform: rotate(-90deg);
}

.contentBoxContainer .column:nth-child(1) .img_box:before {
    content: '';
    width: 50px;
    height: 50px;
    position: absolute;
    left: 0;
    top: -50px;
    background: var(--tertiary);
}

.contentBoxContainer .column:nth-child(3) .img_box:after {
    content: '';
    width: 1rem;
    height: 1rem;
    position: absolute;
    right: 0;
    bottom: -1rem;
    background: white;
    border-radius: 2rem/2rem 0 0 0;
    transform: rotate(90deg);
}

.contentBoxContainer .column:nth-child(3) .img_box:before {
    content: '';
    width: 1rem;
    height: 1rem;
    position: absolute;
    right: 0;
    bottom: -1rem;
    background: var(--tertiary);
}

@media screen and (max-width: 992px) {
    .contentBoxContainer .column:not(:nth-child(2)) {
        display: none;
    }

    .contentBoxContainer .column:nth-child(2) {
        width: 100%;
        background: unset !important;
        padding: 0;
    }

    .contentBoxContainer .column:nth-child(2) .box {
        background: #F6F6F7;
        padding: .5rem;
        max-height: 312px;
    }
}


/*
    mmenu
*/

.mm-menu.mm-offcanvas {
    width: 285px !important;
    min-width: 285px !important;
    background: #ffffff;
    box-shadow: -2px 0 4px 0 rgba(0, 0, 0, 0.13);
}

.mm-listview > li > a {
    font-size: medium;
    line-height: 1.571;
    color: #757575;
    position: relative;
    display: block;
}

.mm-navbars-top {
    border: 0;
    height: 100px;
    border-bottom: 1px solid #e5e5ea;
    background: url("../../../../file/logos/logo.png") no-repeat 50% 30%;
    background-size: auto;
    background-size: auto 43px;
    margin: 0 25px 0 29px;
}

.mm-panels {
    margin-top: 70px;
}

/*.mm-menu .mm-listview > li.mm-opened.mm-vertical > a.mm-next, .mm-menu.mm-vertical .mm-listview > li.mm-opened > a.mm-next {*/
/*    background: red;*/
/*}*/
.mm-menu .mm-listview > li.mm-opened.mm-vertical > .mm-panel, .mm-menu.mm-vertical .mm-listview > li.mm-opened > .mm-panel {
    padding-top: 0;
    padding-bottom: 0;
}

.mm-navbar.mm-hasbtns {
    height: 100%;
}

.mm-navbar .mm-btn:first-child {
    margin: auto 0 auto;
    inset: 0;
}


/*
  five banner
*/

.fiveBanner .bannerContainer {
    display: grid;
    grid-template-columns: calc(30% - .75rem) 1rem calc(25% - .75rem) 1rem calc(20% - .75rem) 1rem calc(25% - .75rem);
    grid-template-rows: calc(50% - .5rem) 1rem calc(50% - .5rem);
    gap: unset;
}

.fiveBannerItem:nth-child(1) {
    grid-column: 1/2;
    grid-row: 1/4;
}

.fiveBannerItem:nth-child(2) {
    grid-column: 3/6;
    grid-row: 1/2;
}

.fiveBannerItem:nth-child(3) {
    grid-column: 7/8;
    grid-row: 1/2;
}

.fiveBannerItem:nth-child(4) {
    grid-column: 3/4;
    grid-row: 3/4;
}

.fiveBannerItem:nth-child(5) {
    grid-column: 5/8;
    grid-row: 3/4;
}

.fiveBannerImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 2rem;
}

@media screen and (max-width: 768px) {
    .fiveBanner .bannerContainer {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
    }

    .fiveBanner .fiveBannerItem {
        flex: 1 1 auto;
    }
}

@media screen and (max-width: 480px) {
    .fiveBanner .bannerContainer {
        gap: .25rem;
    }
}


/*
    category carousel
*/

.category_carousel {
    border-radius: var(--radius-s, 1rem);
    border: 1.5px solid #E1E2E4;
    padding: 1rem 1.5rem;
    margin-bottom: 1.5rem;
}

.category_slider_item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    color: #2E2F33;
}

.category_slider_item img {
    border-radius: 100%;
    height: 80px;
    width: 80px;
    object-fit: cover;
}

@media screen and (max-width: 992px) {
    .category_carousel {
        padding: .5rem;
    }
}


.read_more-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease;
    position: relative;
}

.read_more-button:not(.disable_style) {
    display: inline-block;
    margin-top: 10px;
    padding: 0;
    background-color: unset;
    color: #19bfd3;
    border: none;
    cursor: pointer;
}

.read_more-content:not(.disable_gradient):after {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 98.8%, 0.99) 99%, #fff);
    pointer-events: none;
}

.read_more-box:not(.expanded) .read_more-content:not(.disable_gradient):after {
    display: block;
    content: '';
}