@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Corinthia:wght@400;700&display=swap');
@import url('icofont.min.css');
/* fallback */
@font-face {
    font-family: 'Material Symbols Rounded';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/material-symbols-rounded.woff2') format('woff2');
}

.material-symbols-rounded {
    font-family: 'Material Symbols Rounded';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

@keyframes blink{
    0%{opacity: 1;}
    30%{opacity: 1;}
    50%{opacity: 0;}
    70%{opacity: 1;}
    100%{opacity: 1;}
}

:root{
    --light-gray: #f5f5f5;
    --gray: #494949;
    --dark-gray: #0a1821;
    --so-green: #3fb149;
    --so-green-dark: #3a9344;
    --so-red: #f03545;
    --so-orange: #ef5317;
    --so-blue: #1d9bf0;
    --white: #ffffff;
    --shadow: #dadada;
}
*, ::after, ::before {
    box-sizing: border-box
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 10px;
    font-weight: 200;
    line-height: 1.2;
}
h1, .h1{ font-size: 2.5em;}
h2, .h2{ font-size: 2.3em;}
h3, .h3{ font-size: 2.1em;}
h4, .h4{ font-size: 1.8em;}
h5, .h5{ font-size: 1.6em;}
h6, .h6{ font-size: 1.4em;}
p { margin: 0 0 10px 0;}
p:last-child { margin: 0;}
img { width: 100% }
a{ color: var(--so-green); text-decoration: none; transition: all 0.3s}

body{
    margin: 0;
    font-family: 'Titillium Web', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: var(--dark-gray);
    background-color: var(--light-gray);
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}
.page{
    padding-top: 70px;
}
header{
    background-color: var(--white);
    -webkit-box-shadow: 0 0 5px 0 var(--shadow);
    box-shadow: 0 0 5px 0 var(--shadow);
    z-index: 100;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

@media (max-width: 768px) {
    header{
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 100;
    }
}

.header-main{
    height: 70px;
    display: flex;
    align-items: center;
}
.nav-icon {
    width: 30px;
    height: 30px;
    position: relative;
    margin: 0 15px 0 5px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}
.nav-icon span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background: var(--dark-gray);
    border-radius: 9px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
.nav-icon.open span{
    background: var(--dark-gray);
}
.nav-icon span:nth-child(1) {
    top: 6px;
    width: 80%;
}
.nav-icon span:nth-child(2),.nav-icon span:nth-child(3) {
    top: 14px;
    width: 60%;
}
.nav-icon span:nth-child(4) {
    bottom: 6px;
    width: 30%;
}
.nav-icon.open span:nth-child(1) {
    top: 18px;
    width: 0%;
    left: 50%;
}
.nav-icon.open span:nth-child(2) {
    width: 90%;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.nav-icon.open span:nth-child(3) {
    width: 90%;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.nav-icon.open span:nth-child(4) {
    top: 18px;
    width: 0%;
    left: 50%;
}

.header-main .logo{
    flex-grow: 1;
}
.header-main .logo img{
    width: 80px;
    height: 50px;
}

.header-main .search{
    flex-grow: 4;
    position: relative;
}
.header-main .search .search-results{
    display: none;
    position: absolute;
    top: 69px;
    left: 0;
    right: 0;
    min-height: 100px;
    max-height: calc(100vh - 90px);
    background-color: #fff;
    overflow: hidden;
    overflow-y: auto;
    border-radius: 8px;
    -webkit-box-shadow: 0px 0px 10px 0 rgba(0,0,0,0.4);
    box-shadow: 0px 0px 10px 0 rgba(0,0,0,0.4);
}
.header-main .search .search-results.open{
    display: block;
}
.header-main .search .search-results .search-item {
    width: 100%;
    display: grid;
    grid-template-columns: 80px 1fr 85px;
    grid-template-rows: 1fr;
    grid-column-gap: 15px;
    align-items: center;
    padding: 15px;
    border-bottom: 1px solid #f0f0f0;
    color: var(--dark-gray) !important;
}
.header-main .search .search-results .search-item .image {
    border-radius: 5px;
}
.header-main .search .search-results .search-item .title a{
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-gray) !important;
}
.header-main .search .search-results .search-item .title a:hover{
    color: var(--so-green) !important;
}
.header-main .search .search-results .search-item .c3{
    text-align: right;
}
.header-main .search .search-results .search-item .price {
    font-size: 18px;
    font-weight: 600;
    color: var(--so-green)
}
.header-main .search .search-results .search-item .price.discount {
    color: var(--so-red)
}
.header-main .search .search-results .search-item .price .price-hrk {
    font-size: 12px;
    font-weight: 600;
}
.header-main .search .search-results .search-item .old-price {
    font-size: 12px;
    font-weight: 600;
    text-decoration: line-through;
    color: #8c8c8c;
}
.header-main .search .search-results .search-item .old-price .old-price-hrk {
    font-size: 12px;
    font-weight: 600;
    text-decoration: line-through;
}

.header-main .search .search-results .search-item .add-to-cart {
    display: inline-block;
    padding: 5px 10px;
    color: var(--so-green);
    background-color: #e4ffe4;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
}
.header-main .search .search-results .search-item .add-to-cart:hover {
    color: #fff;
    background-color: var(--so-green);
}

.header-main .search .search-results .search-results-footer .load-more{
    display: none;
    padding: 15px 15px 0;
    text-align: center;
}
.header-main .search .search-results .search-results-footer .load-more.show{
    display: block;
}
.header-main .search .search-results .search-results-footer .search-info{
    padding: 15px;
    font-size: 14px;
    font-weight: 600;
    color: #999999;
    text-align: center;
    display: none;
}
.header-main .search .search-results .search-results-footer .search-info.show{
    display: block;
}

.search-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0);
    transition: all 0.3s;
}
.search-overlay.open{
    display: block;
    background-color: rgba(0,0,0,0.4);
}
@media (max-width: 768px) {
    .header-main{
        height: 60px;
    }
    .header-main .search{
        display: none;
    }
    .header-main .logo img{
        width: 65px;
        height: 40px;
    }
}
#addToCartModal .modal-content {
    border: 1px solid #d6d6d6;
    box-shadow: 0 0 10px rgba(0,0,0,0.4);
}
.header-main .search form{
    position: relative;
}
.header-main .search form input{
    font-family: 'Titillium Web', sans-serif;
    width: 100%;
    line-height: 46px;
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 0 60px 0 15px;
    font-size: 18px;
    font-weight: 400;
    background-color: var(--light-gray);
    -webkit-box-shadow: 0 0 3px 0 var(--shadow);
    box-shadow: 0 0 3px 0 var(--shadow);
    transition: all 0.3s;
}
.header-main .search form input::placeholder{
    color: #aaa;
}
.header-main .search form input:focus{
    outline: none !important;
    box-shadow: 0 0 3px var(--so-green);
    background-color: var(--white);
}

.header-main .search form button{
    position: absolute;
    top: 0px;
    right: 0px;
    width: 48px;
    height: 48px;
    line-height: 48px;
    border: none;
    background-color: transparent;
}
.header-main .search form button:before{
    content: "\e8b6";
    font-family: "Material Symbols Rounded";
    font-size: 26px;
    font-weight: 400;
    color: #aaa;
}
.header-main .search form button:hover:before{
    color: var(--so-green);
}

.mobile-search{
    display: none;
    padding: 10px 0;
}
.mobile-search.open{
    display: block;
    border-top: 1px solid var(--light-gray);
}
@media (min-width: 768px) {
    .mobile-search{
        display: none;
    }
    .mobile-search.open{
        display: none;
    }
}
.mobile-search form {
    position: relative;
}
.mobile-search form input{
    font-family: 'Titillium Web', sans-serif;
    width: 100%;
    line-height: 46px;
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 0 60px 0 15px;
    font-size: 18px;
    font-weight: 400;
    background-color: var(--light-gray);
    -webkit-box-shadow: 0 0 3px 0 var(--shadow);
    box-shadow: 0 0 3px 0 var(--shadow);
    transition: all 0.3s;
}
.mobile-search form input::placeholder{
    color: #aaa;
}
.mobile-search form input:focus{
    outline: none !important;
    box-shadow: 0 0 3px var(--so-green);
    background-color: var(--white);
}

.mobile-search form button{
    position: absolute;
    top: 0px;
    right: 0px;
    width: 48px;
    height: 48px;
    line-height: 48px;
    border: none;
    background-color: transparent;
}
.mobile-search form button:before{
    content: "\e8b6";
    font-family: "Material Symbols Rounded";
    font-size: 26px;
    font-weight: 400;
    color: #aaa;
}
.mobile-search form button:hover:before{
    color: var(--so-green);
}

#mobileSearchModal .modal-header{
    display: grid;
    grid-template-columns: 1fr 40px;
}
#mobileSearchModal .modal-body{
    padding: 0;
}

#mobileSearchModal  form {
    position: relative;
}
#mobileSearchModal form input{
    font-family: 'Titillium Web', sans-serif;
    width: 100%;
    line-height: 46px;
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 0 50px 0 15px;
    font-size: 18px;
    font-weight: 400;
    background-color: var(--light-gray);
    -webkit-box-shadow: 0 0 3px 0 var(--shadow);
    box-shadow: 0 0 3px 0 var(--shadow);
    transition: all 0.3s;
}
#mobileSearchModal form input::placeholder{
    color: #aaa;
}
#mobileSearchModal form input:focus{
    outline: none !important;
    box-shadow: 0 0 3px var(--so-green);
    background-color: var(--white);
}

#mobileSearchModal form button{
    position: absolute;
    top: 0px;
    right: 0px;
    width: 48px;
    height: 48px;
    line-height: 48px;
    border: none;
    background-color: transparent;
}
#mobileSearchModal form button:before{
    content: "\e8b6";
    font-family: "Material Symbols Rounded";
    font-size: 26px;
    font-weight: 400;
    color: #aaa;
}
#mobileSearchModal form button:hover:before{
    color: var(--so-green);
}
.mobile-search-results .search-item {
    width: 100%;
    display: grid;
    grid-template-columns: 60px 1fr;
    grid-template-rows: 1fr;
    grid-column-gap: 10px;
    align-items: center;
    padding: 15px;
    border-bottom: 1px solid #f0f0f0;
    color: var(--dark-gray) !important;
}
.mobile-search-results .search-item .image {
    border-radius: 5px;
}
.mobile-search-results .search-item .title a{
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-gray) !important;
}
.mobile-search-results .search-item .title a:hover{
    color: var(--so-green) !important;
}
.mobile-search-results .search-item .c2-inner{
    width: 100%;
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 1fr;
    grid-column-gap: 10px;
    align-items: center;
    padding-top: 5px;
}
.mobile-search-results .search-item .price {
    font-size: 18px;
    font-weight: 600;
    color: var(--so-green)
}
.mobile-search-results .search-item .price.discount {
    color: var(--so-red)
}
.mobile-search-results .search-item .price .price-hrk {
    font-size: 12px;
    font-weight: 600;
}
.mobile-search-results .search-item .old-price {
    font-size: 12px;
    font-weight: 600;
    text-decoration: line-through;
    color: #8c8c8c;
}
.mobile-search-results .search-item .old-price .old-price-hrk {
    font-size: 12px;
    font-weight: 600;
    text-decoration: line-through;
}
.mobile-search-results .search-item .item-cart-btn{
    text-align: right;
}
.mobile-search-results .search-item .add-to-cart {
    display: inline-block;
    padding: 5px 10px;
    color: var(--so-green);
    background-color: #e4ffe4;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
}
.mobile-search-results .search-item .add-to-cart:hover {
    color: #fff;
    background-color: var(--so-green);
}
#mobileSearchModal .modal-footer{
    display: none;
}
#mobileSearchModal .modal-footer.show{
    display: block;
}
#mobileSearchModal .modal-footer .search-info{
    font-size: 14px;
    font-weight: 600;
    color: #999999;
    text-align: center;
}
#mobileSearchModal .load-more{
    display: none;
    text-align: center;
    padding: 10px 15px;
    font-size: 16px;
    font-weight: 600;
}
#mobileSearchModal .load-more.show{
    display: block;
}
.blob {
    position: relative;
    display: inline-block;
    background: var(--so-green);
    border-radius: 50%;
    margin: 15px;
    height: 50px;
    width: 50px;
    box-shadow: 0 0 0 0 rgb(63, 177, 73);
    transform: scale(1);
    animation: pulse 2s infinite;
    cursor: pointer;
}
#mobileSearchModal .load-more:hover .blob {
    background: var(--so-green-dark);
}
.blob:after {
    content: "\e5db";
    font-family: "Material Symbols Rounded";
    font-size: 24px;
    position: absolute;
    top:0; left: 0;
    width: 50px; height: 50px;
    line-height: 50px;
    text-align: center;
    color: #fff;
    font-weight: 200;
}
@keyframes pulse {
    0% {
        transform: scale(0.90);
        box-shadow: 0 0 0 0 rgba(39, 194, 66, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(154, 226, 160, 0);
    }

    100% {
        transform: scale(0.90);
        box-shadow: 0 0 0 0 rgba(154, 226, 160, 0);
    }
}
.header-main .header-icons{
    flex-grow: 1;
    display: flex;
    justify-content: flex-end;
}

.header-main .header-icons .header-icon{
    position: relative;
    margin-left: 15px;
}
.header-main .header-icons .header-icon:first-child{
    margin-left: 0;
}
.header-main .header-icons .header-icon .mini-cart, .header-main .header-icons .header-icon .mini-profile, .header-main .header-icons .header-icon .mini-search {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: var(--dark-gray);
    cursor: pointer;
}
.header-main .header-icons .header-icon .mini-profile.open, .header-main .header-icons .header-icon .mini-search.open{
    color: var(--so-green);
}
.header-main .header-icons .header-icon .mini-cart:hover, .header-main .header-icons .header-icon .mini-profile:hover, .header-main .header-icons .header-icon .mini-search:hover {
    color: var(--so-green);
}
.header-main .header-icons .header-icon .mini-search{
    display: none;
}
@media (max-width: 768px) {
    .header-main .header-icons .header-icon .mini-search {
        display: inline-block;
    }
}
.header-main .header-icons .header-icon .mini-search:before{
    content: "\e8b6";
    font-family: "Material Symbols Rounded";
    font-size: 29px;
    font-weight: 400;
}
.header-main .header-icons .header-icon .mini-search.open:before{
    content: "\e5cd";
    font-family: "Material Symbols Rounded";
    font-size: 30px;
    font-weight: 400;
}
.header-main .header-icons .header-icon .mini-cart:before{
    content: "\e8cc";
    font-family: "Material Symbols Rounded";
    font-size: 28px;
    font-weight: 400;
}
.header-main .header-icons .header-icon .mini-profile:before{
    content: "\e853";
    font-family: "Material Symbols Rounded";
    font-size: 28px;
    font-weight: 400;
}
.header-main .header-icons .header-icon .mini-cart .mini-cart-qty{
    position: absolute;
    display: inline-block;
    top: 0;
    right: -5px;
    padding: 0 5px;
    min-width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    background-color: var(--so-green);
    color: var(--white);
    font-weight: 600;
    border-radius: 10px;
}
.header-main .header-icons .header-icon .mini-profile .online{
    position: absolute;
    display: inline-block;
    top: 0;
    right: -5px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    background-color: var(--so-green);
    color: var(--white);
    border-radius: 10px;
}
.header-main .header-icons .header-icon .mini-profile .online:before {
    content: "\e5ca";
    font-family: "Material Symbols Rounded";
    font-size: 16px;
    font-weight: 400;
}

.header-main .header-icons .header-icon .header-dropdown{
    z-index: 9999;
    position: absolute;
    top: 50px;
    width: 220px;
    padding: 5px 0;
    background-color: var(--white);
    border-radius: 8px;
    -webkit-box-shadow: 0 0 5px 0 var(--shadow);
    box-shadow: 0 0 5px 0 var(--shadow);
    display: none;
    transition: all 0.9s;
}
.header-main .header-icons .header-icon .header-dropdown.open{
    display: block;
}
.header-main .header-icons .header-icon .header-dropdown.right{
    right: 0;
    position: absolute;
}
.header-main .header-icons .header-icon .header-dropdown.right:before{
    content: "";
    position: absolute;
    top: -10px;
    right: 11px;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #eee;
}
.header-main .header-icons .header-icon .header-dropdown.left{
    left: 0;
}

.header-main .header-icons .header-icon .header-dropdown ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.header-main .header-icons .header-icon .header-dropdown ul li{
    padding: 0;
    font-size: 16px;
    font-weight: 600;
    border-bottom: 1px solid var(--light-gray);
}
.header-main .header-icons .header-icon .header-dropdown ul li:last-child{
    border-bottom: none;
}
.header-main .header-icons .header-icon .header-dropdown ul li a{
    color: var(--dark-gray);
    display: block;
    padding: 10px 15px 10px 15px;
    position: relative;
}
.header-main .header-icons .header-icon .header-dropdown ul li a:hover{
    color: var(--so-green);
}
.header-main .header-icons .header-icon .header-dropdown ul li a:before{
    position: absolute;
    top:12px;
    right:15px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    font-weight: 300;
}
.header-main .header-icons .header-icon .header-dropdown ul li a.icon-login:before{
    content: "\ea77";
}
.header-main .header-icons .header-icon .header-dropdown ul li a.icon-register:before{
    content: "\e8f7";
}
.header-main .header-icons .header-icon .header-dropdown ul li a.icon-profile:before{
    content: "\e853";
}
.header-main .header-icons .header-icon .header-dropdown ul li a.icon-orders:before{
    content: "\e0ee";
}
.header-main .header-icons .header-icon .header-dropdown ul li a.icon-favorite:before{
    content: "\e87d";
}
.header-main .header-icons .header-icon .header-dropdown ul li a.icon-loyalty:before{
    content: "\e89a";
}
.header-main .header-icons .header-icon .header-dropdown ul li a.icon-logout:before{
    content: "\e9ba";
}
/* Mini Cart */
#offcanvasMiniCart.offcanvas-end {
    width: 500px;
}
#offcanvasMiniCart .offcanvas-header {
    border-bottom: 1px solid #e5e5e5;
    padding: 10px 15px 10px 15px;
}
#offcanvasMiniCart .offcanvas-header .offcanvas-cart-title {
    font-size: 18px;
    font-weight: 700;
    position: relative;
    display: inline-block;
}
#offcanvasMiniCart .offcanvas-header .offcanvas-cart-title .bi {
    font-size: 22px;
}
#offcanvasMiniCart .cart-products {
    background-color: unset;
    border-radius: unset;
    overflow: unset;
    margin-bottom: unset;
    -webkit-box-shadow: unset;
    box-shadow: unset;
}
.mini-cart-item{
    display: grid;
    grid-template-columns: 60px 1fr 20px;
    grid-template-rows: 1fr;
    grid-column-gap: 10px;
    align-items: center;
    padding: 10px;
    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.mini-cart-item .mini-cart-image img{
    border-radius: 6px;
}
.mini-cart-item .cart-item-name{
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
}
.mini-cart-item .cart-item-name a{
    color: var(--dark-gray);
}
.mini-cart-item .cart-item-price{
    font-size: 14px;
    font-weight: 700;
    color: var(--so-green);
}
.mini-cart-item .cart-item-remove a .bi{
    font-size: 24px;
    font-weight: 700;
}
.mini-cart-totals {
    margin: 15px;
    padding: 10px;
    background-color: #e7e7e7;
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.mini-cart-total{
    display: grid;
    grid-template-columns: 35% 65%;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    color: #353535;
    padding: 5px 0;
    border-bottom: 1px solid #d4d4d4;
}
.mini-cart-total:last-child{
    font-size: 15px;
    color: #000;
    border-bottom: none;
}
.mini-cart-total .total-title{
    font-weight: 600;
    line-height: 1;
}
.mini-cart-total .total-value{
    font-weight: 700;
    text-align: right;
    line-height: 1;
}
.mini-cart-buttons{
    padding: 15px;
    padding-top: 0;
}
.mini-cart-empty{
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #b1b1b1;
}
.mini-cart-empty span{
    font-size: 30px;
}
@media (max-width: 740px) {
    #offcanvasMiniCart.offcanvas-end {
        width: 90%;
    }
    .mini-cart-item .cart-item-name{
        font-size: 13px;
    }
}
/* Main Menu - Side Menu */
.nav-tabs.so-nav-tabs {
    border-bottom: none;
}
.nav-tabs.so-nav-tabs .nav-link{
    display: block;
    padding: 0.5rem 1rem;
    color: var(--dark-gray);
    text-decoration: none;
    transition: all .4s;
    margin-bottom: 0;
    background: #fff;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    margin-right: 15px;
}
.nav-tabs.so-nav-tabs .nav-link.active{
    color: var(--white);
    background: var(--dark-gray);
}

.main-menu ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.main-menu ul div{
    margin: 25px 0 5px 15px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}
.main-menu ul div:first-child{
    margin: 0 0 5px 15px;
}
.main-menu ul li{
    background-color: #fff;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
    color: var(--dark-gray);
}
.main-menu ul li a{
    display: block;
    position: relative;
    padding: 10px 15px;
    color: var(--dark-gray);
    cursor: pointer;
}
.main-menu ul li a:hover{
    color: var(--so-green);
}
.main-menu ul li a.active{
    color: var(--so-green);
}
.main-menu ul li.has-children a:before{
    content: "\e313";
    font-family: "Material Symbols Rounded";
    font-size: 18px;
    color: var(--dark-gray);
    position: absolute;
    top: 10px;
    right: 10px
}
.main-menu ul li.has-children a.active:before{
    color: var(--so-green);
}

.main-menu ul li ul{
    margin: 0;
    padding: 0 10px 5px;
    list-style: none;
    display: none;
}
.main-menu ul li ul li{
    background-color: transparent;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 5px;
    color: var(--dark-gray);
}
.main-menu ul li ul li a{
    display: block;
    padding: 5px 0;
    margin: 0 15px;
    color: var(--dark-gray);
}
.main-menu ul li.has-children ul li a:before{
    content: "";
}
.main-menu ul li ul li a:hover{
    color: var(--so-green);
}
.offcanvas-social{
    padding: 15px;
}
.offcanvas-social .social{
    display: flex;
    justify-content: center;
}
.offcanvas-social .social .icon{
    position: relative;
    width: 30px;
    height: 30px;
    margin: 0 7.5px;
    display: block;
}
.offcanvas-social .social .icon.facebook svg .facebook0{
    fill: #1d46b5;
}
.offcanvas-social .social .icon.facebook svg .facebook1{
    fill:none;stroke: #1d46b5;stroke-width:5;
}
.offcanvas-social .social .icon.facebook:hover svg .facebook0{
    fill: var(--dark-gray);
}
.offcanvas-social .social .icon.facebook:hover svg .facebook1{
    fill:none;stroke: var(--dark-gray);stroke-width:5;
}
.offcanvas-social .social .icon.instagram svg .insta0{
    fill: #f25c44;
}
.offcanvas-social .social .icon.instagram:hover svg .insta0{
    fill: var(--dark-gray);
}
.offcanvas-social .social .icon.twitter svg .twiiter0{
    fill: #1d9bf0;
}
.offcanvas-social .social .icon.twitter:hover svg .twiiter0{
    fill: var(--dark-gray);
}

@media (max-width: 768px) {
    .page{ padding-top: 60px}
}

.panel{
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 15px;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.panel-flex{
    display: flex;
    align-items: center;
}
.panel-icon{
    font-size: 28px;

    margin-right: 15px;
}

.breadcrumb{
    padding: 0 0;
    margin: 0;
}
.breadcrumb .breadcrumb-list{
    list-style: none;
    margin: 0;
    padding: 0;
}
.breadcrumb .breadcrumb-list .breadcrumb-item{
    display: inline-block;
    padding: 0 0 0 20px;
    position: relative;
    font-size: 12px;
}
.breadcrumb .breadcrumb-list .breadcrumb-item:before{
    content: "\e409";
    font-family: "Material Symbols Rounded";
    font-size: 14px;
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
}
.breadcrumb .breadcrumb-list .breadcrumb-item:first-child{
    padding: 0;
}
.breadcrumb .breadcrumb-list .breadcrumb-item:first-child:before{
    display: none;
}
.breadcrumb .breadcrumb-list .breadcrumb-item a{
    color: var(--dark-gray);
    transition: all 0.4s;
}
.breadcrumb .breadcrumb-list .breadcrumb-item a:hover{
    text-decoration: underline;
}
section{
    padding: 15px 0 30px;
}
.category-title{
    font-size: 2.5em;
    font-weight: 200;
    margin: 15px 0;
}
.module-title{
    font-size: 2.5em;
    font-weight: 200;
    text-align: center;
    margin: 15px 0;
}
@media (max-width: 768px) {
    .module-title{
        font-size: 2em;
        margin: 15px 0;
    }
    .category-title{
        font-size: 22px;
        font-weight: 600;
        margin: 15px 0;
    }
}

/* Banner full slider */
.banner-full{
    overflow: hidden;
    border-radius: 8px;
}
.banner-full .item{
    position: relative;
}
.banner-full .item img{
    width: 100%;
}
.banner-full .item .caption{
    position: absolute;
    bottom:0;
    left: 0;
    width: 100%;
    background-color: rgba(255,255,255,0.5);
    backdrop-filter: blur(4px);
}
.banner-full .item .caption .title{
    padding: 10px 15px 30px 15px;
    font-size: 26px;
    font-weight: 600;
    color: var(--dark-gray);
}

@media (max-width: 768px) {
    .banner-full{
        overflow: hidden;
        border-radius: 8px;
    }
    .banner-full .item{
        position: relative;
    }
    .banner-full .item img{
        width: 100%;
        height: 200px;
        object-fit: cover;
    }
    .banner-full .item .caption .title{
        font-size: 18px;
        font-weight: 600;
    }
}

/* Slideshow */
.module-slideshow .slideshow-item{
    position: relative;
    overflow: hidden;
    padding: 15px 0 5px;
}
.module-slideshow .slideshow-item.bg-gradient-green:before,
.module-slideshow .slideshow-item.bg-gradient-purple:before,
.module-slideshow .slideshow-item.bg-gradient-red:before,
.module-slideshow .slideshow-item.bg-gradient-black:before,
.module-slideshow .slideshow-item.bg-gradient-blue:before,
.module-slideshow .slideshow-item.bg-gradient-orange:before,
.module-slideshow .slideshow-item.bg-gradient-yellow:before,
.module-slideshow .slideshow-item.bg-gradient-gray:before,
.module-slideshow .slideshow-item.bg-gradient-blue-purple:before,
.module-slideshow .slideshow-item.bg-gradient-green-purple:before{
    content: '';
    height: 200px;
    background-repeat: repeat-x;
    background-size: 100% 100%;
    background-position: center center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1;
    opacity: 0.5;
}
.module-slideshow .slideshow-item.bg-gradient-green:before{
    background-image: linear-gradient(
            180deg,
            hsl(125deg 48% 47%) 0%,
            hsl(122deg 41% 54%) 11%,
            hsl(119deg 40% 60%) 22%,
            hsl(118deg 39% 65%) 33%,
            hsl(116deg 39% 70%) 44%,
            hsl(115deg 38% 75%) 56%,
            hsl(114deg 37% 80%) 67%,
            hsl(114deg 34% 86%) 78%,
            hsl(113deg 27% 91%) 89%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-purple:before{
    background-image: linear-gradient(
            180deg,
            hsl(277deg 48% 47%) 0%,
            hsl(277deg 42% 53%) 11%,
            hsl(278deg 42% 58%) 22%,
            hsl(279deg 41% 64%) 33%,
            hsl(279deg 41% 69%) 44%,
            hsl(280deg 40% 74%) 56%,
            hsl(280deg 38% 80%) 67%,
            hsl(281deg 35% 85%) 78%,
            hsl(281deg 28% 91%) 89%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-red:before{
    background-image: linear-gradient(
            180deg,
            hsl(0deg 100% 48%) 0%,
            hsl(8deg 96% 56%) 11%,
            hsl(10deg 100% 62%) 22%,
            hsl(11deg 100% 67%) 33%,
            hsl(12deg 100% 72%) 44%,
            hsl(13deg 100% 77%) 56%,
            hsl(13deg 100% 82%) 67%,
            hsl(13deg 100% 87%) 78%,
            hsl(12deg 90% 92%) 89%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-blue:before{
    background-image: linear-gradient(
            180deg,
            hsl(204deg 100% 71%) 0%,
            hsl(208deg 88% 85%) 50%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-orange:before{
    background-image: linear-gradient(
            180deg,
            hsl(29deg 100% 48%) 0%,
            hsl(26deg 94% 57%) 11%,
            hsl(25deg 97% 63%) 22%,
            hsl(24deg 100% 69%) 33%,
            hsl(24deg 100% 74%) 44%,
            hsl(24deg 100% 79%) 56%,
            hsl(23deg 100% 83%) 67%,
            hsl(22deg 97% 88%) 78%,
            hsl(22deg 77% 92%) 89%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-yellow:before{
    background-image: linear-gradient(
            180deg,
            hsl(58deg 100% 48%) 0%,
            hsl(57deg 92% 60%) 11%,
            hsl(56deg 93% 67%) 22%,
            hsl(55deg 94% 72%) 33%,
            hsl(54deg 94% 76%) 44%,
            hsl(53deg 93% 81%) 56%,
            hsl(52deg 90% 85%) 67%,
            hsl(51deg 83% 89%) 78%,
            hsl(49deg 63% 93%) 89%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-black:before{
    background-image: linear-gradient(
            180deg,
            hsl(0deg 0% 0%) 0%,
            hsl(343deg 0% 11%) 11%,
            hsl(344deg 0% 20%) 22%,
            hsl(344deg 0% 30%) 33%,
            hsl(344deg 0% 40%) 44%,
            hsl(344deg 0% 50%) 56%,
            hsl(344deg 0% 61%) 67%,
            hsl(344deg 0% 72%) 78%,
            hsl(344deg 0% 84%) 89%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-gray:before{
    background-image: linear-gradient(
            180deg,
            hsl(0deg 0% 36%) 0%,
            hsl(344deg 0% 42%) 11%,
            hsl(344deg 0% 49%) 22%,
            hsl(344deg 0% 55%) 33%,
            hsl(344deg 0% 62%) 44%,
            hsl(344deg 0% 68%) 56%,
            hsl(344deg 0% 75%) 67%,
            hsl(344deg 0% 82%) 78%,
            hsl(344deg 0% 89%) 89%,
            hsl(0deg 0% 96%) 100%
    );
}
.module-slideshow .slideshow-item.bg-gradient-blue-purple:before{
    background-image: linear-gradient(
            180deg,
            hsl(277deg 100% 54%) 0%,
            hsl(205deg 100% 50%) 33%,
            hsl(207deg 95% 76%) 66%,
            hsl(0deg 0% 96%) 100%
    );
}


.module-slideshow .slideshow-item .slideshow-item-inner{
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px 15px 30px;
    display: grid;
    align-items: end;
}


.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content{
    z-index: 0;
    position: relative;
    text-align: center;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .banner-logo{
    display: inline-block;
    width: 100px;
    margin-bottom: 20px;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .title{
    font-size: 50px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 15px;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text{
    margin-bottom: 15px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn{
    outline: none;
    outline-color: transparent;
    border: none;
    box-shadow: none;
    font-weight: 400;
    letter-spacing: 1.1px;
    border-radius: 30px;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn:hover{
    outline: none;
    outline-color: transparent;
    border: none;
    box-shadow: none;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content.text-so-green .title,
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content.text-so-green .text{
    color: #3fb149; text-shadow: 2px 2px 5px rgba(0,0,0,0.7);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content.text-so-black .title,
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content.text-so-black .text{
    color: #000; text-shadow: 2px 2px 5px rgba(255,255,255,0.7);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content.text-so-white .title,
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content.text-so-white .text{
    color: #fff; text-shadow: 2px 2px 5px rgba(0,0,0,0.7);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-green .title,
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-green .text{
    color: #3fb149; text-shadow: 2px 2px 5px rgba(0,0,0,0.7);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-black .title,
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-black .text{
    color: #000; text-shadow: 2px 2px 5px rgba(255,255,255,0.7);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-white .title,
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-white .text{
    color: #fff; text-shadow: 2px 2px 5px rgba(0,0,0,0.7);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-red .title,
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text-so-red .text{
    color: #bc0000; text-shadow: 2px 2px 5px rgba(255, 255, 255, 0.7);
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-green{
    background-color: #3fb149; color: #fff;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-white{
    background-color: #fff; color: #333;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-black{
    background-color: #000; color: #fff;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-red{
    background-color: #eb4a4a; color: #fff;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-blue{
    background-color: #4ac9eb; color: #fff;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-purple{
    background-color: #854aeb; color: #fff;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-orange{
    background-color: #ff592d; color: #fff;
}
.module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn-so-yellow{
    background-color: #ffe12d; color: #333;
}
@media (max-width: 1199px) {
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .banner-logo{
        width: 60px;
        margin-bottom: 15px;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .title{
        font-size: 32px;
        margin-bottom: 10px;
    }
}
@media (max-width: 991px) {
    .module-slideshow .slideshow-item{
        position: relative;
        overflow: hidden;
        padding: 15px 0 5px;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner{
        position: relative;
        overflow: hidden;
        border-radius: 8px;
        -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
        box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content{
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 15px 15px 30px;
        display: grid;
        align-items: end;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content.seasonal-banner-content{
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 15px 15px 30px;
        display: grid;
        align-items: end;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content{
        z-index: 0;
        position: relative;
        text-align: center;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .banner-logo{
        display: none;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .title{
        font-size:28px;
        font-weight: 700;
        line-height: 1;
        margin-bottom: 15px;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content.seasonal-banner-content .title{
        margin-bottom: 0;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .text{
        margin-bottom: 15px;
        font-size: 18px;
        font-weight: 600;
        line-height: 1;
    }
    .module-slideshow .slideshow-item .slideshow-item-inner .slideshow-content .content .btn{
        outline: none;
        outline-color: transparent;
        border: none;
        box-shadow: none;
        font-weight: 600;
        letter-spacing: 1.1px;
        border-radius: 30px;
        font-size: 14px;
    }
}


/* Slider-module */
.slider-module{
    overflow: hidden;
    overflow: unset;
}
/* Grid */
.grid-3{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 15px;
    grid-row-gap: 15px;
}
.grid-4{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 15px;
    grid-row-gap: 15px;
}
.grid-5{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 15px;
    grid-row-gap: 15px;
}
.grid-6{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 15px;
    grid-row-gap: 15px;
}
@media (max-width: 1399px) {
    .grid-5 {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
    .grid-6 {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
}
@media (max-width: 991px) {
    .grid-6, .grid-5, .grid-4 {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .grid-3{
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 768px) {
    .grid-6, .grid-5, .grid-4 {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 575px) {
    .grid-3{
        grid-template-columns: 1fr;
    }
}

.grid .item, .slider-module .item{
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background-color: var(--white);
    transition: all 0.3s;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.grid .item:hover, .slider-module .item:hover{
    -webkit-box-shadow: none;
    box-shadow: none;
}
.grid .item img, .slider-module .item img{
    margin-bottom: 0px;
    width: 100%;
}
.grid .item .title, .slider-module .item .title{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px 10px 10px 10px;
    text-align: center;
    font-size: 16px;
    color: var(--dark-gray);
    font-weight:500;
    margin-bottom: 0;
    transition: color 0.4s;
    background-color: rgba(255,255,255,0.8);
    backdrop-filter: blur(4px);
}
.grid .item:hover .title, .slider-module .item:hover .title{
    color: var(--so-green);
}
@media (max-width: 768px) {
    .grid .item .title, .slider-module .item .title{
        font-size: 14px;
        font-weight:500;
    }
}

/* Product Item */
.grid .product-item, .slider-module .product-item{
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background-color: var(--white);
    transition: all 0.4s;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.grid .product-item:hover, .slider-module .product-item:hover{
    -webkit-box-shadow: none;
    box-shadow: none;
}
.grid .product-item .image, .slider-module .product-item .image {
    margin-bottom: 115px;
    padding: 10px;
}
.grid .product-item .image img, .slider-module .product-item .image img {
    width: 100%;
    border-radius: 8px;
}
.grid .product-item .flags, .slider-module .product-item .flags{
    position: absolute;
    top: 5px;
    right: 5px;
    width: 50px;
}
.grid .product-item .flags .recommend,
.grid .product-item .flags .free-shipping,
.grid .product-item .flags .outlet,
.grid .product-item .flags .new-product,
.grid .product-item .flags .savings,
.slider-module .product-item .flags .recommend,
.slider-module .product-item .flags .free-shipping,
.slider-module .product-item .flags .new-product,
.slider-module .product-item .flags .outlet,
.slider-module .product-item .flags .savings{
    width: 50px;
    height: 50px;
    position: relative;
    margin-bottom: 5px;
}
.grid .product-item .flags .recommend:after,
.grid .product-item .flags .free-shipping:after,
.grid .product-item .flags .new-product:after,
.grid .product-item .flags .outlet:after,
.slider-module .product-item .flags .recommend:after,
.slider-module .product-item .flags .free-shipping:after,
.slider-module .product-item .flags .new-product:after,
.slider-module .product-item .flags .outlet:after{
    content: "";
    position: absolute;
    width: 50px;
    height: 50px;
}
.grid .product-item .flags .recommend:after, .slider-module .product-item .flags .recommend:after{
    background-image: url("../images/flag_recommend.svg");
}
.grid .product-item .flags .free-shipping:after, .slider-module .product-item .flags .free-shipping:after{
    background-image: url("../images/flag_free_shipping.svg");
}
.grid .product-item .flags .new-product:after, .slider-module .product-item .flags .new-product:after{
    background-image: url("../images/flag_new_product.svg");
}
.grid .product-item .flags .new-product.new-product-slo:after, .slider-module .product-item .flags .new-product.new-product-slo:after{
    background-image: url("../images/flag_new_product_slo.svg");
}
.grid .product-item .flags .outlet:after, .slider-module .product-item .flags .outlet:after{
    background-image: url("../images/flag_outlet.svg");
}

.grid .product-item .flags .savings, .slider-module .product-item .flags .savings{
    border-radius: 50%;
    background-color: var(--so-red);
    font-size: 8px;
    text-align: center;
    font-weight: 200;
    color: var(--white);
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
}
.grid .product-item .flags .savings, .slider-module .product-item .flags .savings span{
    font-size: 10px;
    font-weight: 600;
}

/*.grid .product-item .info, .slider-module .product-item .info{
    position: absolute;
    bottom: 0;
    left:0;
    width: 100%;
    padding: 10px;
    background-color: var(--white);
    margin-bottom: 40px;
}*/

.grid .product-item .info, .slider-module .product-item .info{
    position: absolute;
    bottom: 0;
    left:0;
    width: 100%;
    padding: 10px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+24,1+100 */
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 24%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 24%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 24%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
    margin-bottom: 40px;
}
.grid .product-item .info .outlet, .slider-module .product-item .info .outlet{
    width: 100%;
    height: 30px;
    position: relative;
    margin-bottom: 10px;
}
.grid .product-item .info .outlet:after, .slider-module .product-item .info .outlet:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 30px;
    background-image: url("../images/label_outlet.svg");
    background-repeat: no-repeat;
}

.grid .product-item .info .external-product, .slider-module .product-item .info .external-product{
    padding: 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--so-red);
    position: relative;
}

.grid .product-item .info .last, .slider-module .product-item .info .last{
    padding: 0 0 0 25px;
    font-size: 12px;
    font-weight: 400;
    color: var(--so-orange);
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.grid .product-item .info .last:after, .slider-module .product-item .info .last:after{
    content: "\f155";
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    position: absolute;
    top: 2px;
    left: 0;
    width: 20px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    color: var(--so-orange);
}
.grid .product-item .info .title, .slider-module .product-item .info .title{
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-gray);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    transition: all 0.4s;
}
/*
.grid .product-item:hover .title, .slider-module .product-item:hover .title{
    color: var(--so-green);
}*/
.grid .product-item .info .prices, .slider-module .product-item .info .prices{
    display: flex;
    align-items: self-end;
    margin-top: 5px;
}
.grid .product-item .info .prices .price, .slider-module .product-item .info .prices .price{
    font-size: 16px;
    color: var(--so-green);
    font-weight: 700;
    flex-grow: 1;
    line-height: 1;
}
.grid .product-item .info .prices .old-price, .slider-module .product-item .info .prices .old-price{
    font-size: 13px;
    color: #8f8f8f;
    font-weight: 400;
    flex-grow: 1;
    text-decoration: line-through;
    text-align: right;
    line-height: 1.2;
}
.grid .product-item .info .prices .discount-price, .slider-module .product-item .info .prices .discount-price{
    font-size: 16px;
    color: var(--so-red);
    font-weight: 700;
    flex-grow: 1;
    line-height: 1;
}
.grid .product-item .info .price-note, .slider-module .product-item .info .price-note{
    font-size: 12px;
    color: #8f8f8f;
    text-align: center;
    margin-top: 10px;
}

/*.grid .product-item .quick-add, .slider-module .product-item .quick-add{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    text-align: center;
    color: var(--dark-gray);
    height: 40px;
    line-height: 40px;
    border-top: 1px solid var(--light-gray);
    cursor: pointer;
    font-weight: 600;
}*/
.grid .product-item .quick-add, .slider-module .product-item .quick-add{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    text-align: center;
    color: var(--white);
    height: 40px;
    line-height: 40px;
    background-color: var(--so-green);
    cursor: pointer;
    font-weight: 600;
}

.grid .product-item span.not-avail, .slider-module .product-item span.not-avail{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    text-align: center;
    color: var(--so-orange);
    height: 40px;
    line-height: 1;
    cursor: pointer;
    font-weight: 600;
}

span.icon{
    display: inline-block;
    width: 20px;
    height: 20px;
    position: relative;
    margin-right: 10px;
}
span.icon.fs30{
    display: inline-block;
    width: 30px;
    height: 30px;
    position: relative;
    margin-right: 10px;
}
span.icon:before{
    font-family: "Material Symbols Rounded";
    position: absolute;
    width: 20px;
    height: 20px;
    top: 0;
    left: 0;
    text-align: center;
    line-height: 20px;
    font-size: 20px;
    font-weight: 400;
}
span.icon.fs30:before{
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 30px;
}
span.icon.cart:before{
    content: "\e8cc";
}
span.icon.add-to-cart:before{
    content: "\e854";
}
span.icon.user:before{
    content: "\e853";
}
span.icon.orders:before{
    content: "\f1cc";
}
span.icon.loyalty:before{
    content: "\e89a";
}
span.icon.favorite:before{
    content: "\e87d";
}
/*.grid .product-item .quick-add:hover, .slider-module .product-item .quick-add:hover{
    color: var(--white);
    background: var(--so-green);
}*/
.grid .product-item .quick-add:hover, .slider-module .product-item .quick-add:hover{
    color: var(--white);
    background: var(--so-green-dark);
}

.add-msg .cart-err {
    color: var(--so-red);
}

@media (max-width: 768px) {
    .grid .product-item .image, .slider-module .product-item .image{
        margin-bottom: 115px;
    }
    .grid .product-item .title, .slider-module .product-item .title{
        font-size: 12px !important;
        font-weight: 500;
    }
}
/*+++++++++++++++++++*/
/* Product Item */
.grid .product-item2, .slider-module .product-item2{
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background-color: var(--white);
    transition: all 0.4s;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.grid .product-item2:hover, .slider-module .product-item2-item:hover{
    -webkit-box-shadow: none;
    box-shadow: none;
}
.grid .product-item2 .image, .slider-module .product-item2 .image {
    margin-bottom: 45px;
    padding: 10px;
}
.grid .product-item2 .image img, .slider-module .product-item2 .image img {
    width: 100%;
    border-radius: 8px;
}
.grid .product-item2 .flags, .slider-module .product-item2 .flags{
    position: absolute;
    top: 5px;
    right: 5px;
    width: 50px;
}
.grid .product-item2 .flags .recommend,
.grid .product-item2 .flags .free-shipping,
.grid .product-item2 .flags .new-product,
.grid .product-item2 .flags .outlet,
.grid .product-item2 .flags .savings,
.slider-module .product-item2 .flags .recommend,
.slider-module .product-item2 .flags .free-shipping,
.slider-module .product-item2 .flags .new-product,
.slider-module .product-item2 .flags .outlet,
.slider-module .product-item2 .flags .savings{
    width: 50px;
    height: 50px;
    position: relative;
    margin-bottom: 5px;
}
.grid .product-item2 .flags .recommend:after,
.grid .product-item2 .flags .free-shipping:after,
.grid .product-item2 .flags .new-product:after,
.grid .product-item2 .flags .outlet:after,
.slider-module .product-item2 .flags .recommend:after,
.slider-module .product-item2 .flags .free-shipping:after,
.slider-module .product-item2 .flags .new-product:after,
.slider-module .product-item2 .flags .outlet:after{
    content: "";
    position: absolute;
    width: 50px;
    height: 50px;
}
.grid .product-item2 .flags .recommend:after, .slider-module .product-item2 .flags .recommend:after{
    background-image: url("../images/flag_recommend.svg");
}
.grid .product-item2 .flags .free-shipping:after, .slider-module .product-item2 .flags .free-shipping:after{
    background-image: url("../images/flag_free_shipping.svg");
}
.grid .product-item2 .flags .new-product:after, .slider-module .product-item2 .flags .new-product:after{
    background-image: url("../images/flag_new_product.svg");
}
.grid .product-item2 .flags .new-product:after, .slider-module .product-item2 .flags .new-product.new-product-slo:after{
    background-image: url("../images/flag_new_product_slo.svg");
}
.grid .product-item2 .flags .outlet:after, .slider-module .product-item2 .flags .outlet:after{
    background-image: url("../images/flag_outlet.svg");
}

.grid .product-item2 .flags .savings, .slider-module .product-item2 .flags .savings{
    border-radius: 50%;
    background-color: var(--so-red);
    font-size: 8px;
    text-align: center;
    font-weight: 200;
    color: var(--white);
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
}
.grid .product-item2 .flags .savings, .slider-module .product-item2 .flags .savings span{
    font-size: 10px;
    font-weight: 600;
}
.grid .product-item2 .info, .slider-module .product-item2 .info{
    position: absolute;
    bottom: 0;
    left:0;
    width: 100%;
    padding: 10px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+24,1+100 */
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 24%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 24%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 24%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
    margin-bottom: 40px;
}
.grid .product-item2 .info .outlet, .slider-module .product-item2 .info .outlet{
    width: 100%;
    height: 30px;
    position: relative;
    margin-bottom: 10px;
}
.grid .product-item2 .info .outlet:after, .slider-module .product-item2 .info .outlet:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 30px;
    background-image: url("../images/label_outlet.svg");
    background-repeat: no-repeat;
}

.grid .product-item2 .info .last, .slider-module .product-item2 .info .last{
    padding: 0 0 0 25px;
    font-size: 12px;
    font-weight: 400;
    color: var(--so-orange);
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.grid .product-item2 .info .last:after, .slider-module .product-item2 .info .last:after{
    content: "\f155";
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    position: absolute;
    top: 2px;
    left: 0;
    width: 20px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    color: var(--so-orange);
}
.grid .product-item2 .info .title, .slider-module .product-item2 .info .title{
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-gray);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    transition: all 0.4s;
}
.grid .product-item2 .info .prices, .slider-module .product-item2 .info .prices{
    display: flex;
    align-items: self-end;
    margin-top: 5px;
}
.grid .product-item2 .info .prices .price, .slider-module .product-item2 .info .prices .price{
    font-size: 16px;
    color: var(--so-green);
    font-weight: 700;
    flex-grow: 1;
    line-height: 1;
}
.grid .product-item2 .info .prices .old-price, .slider-module .product-item2 .info .prices .old-price{
    font-size: 13px;
    color: #8f8f8f;
    font-weight: 400;
    flex-grow: 1;
    text-decoration: line-through;
    text-align: right;
    line-height: 1.2;
}
.grid .product-item2 .info .prices .discount-price, .slider-module .product-item2 .info .prices .discount-price{
    font-size: 16px;
    color: var(--so-red);
    font-weight: 700;
    flex-grow: 1;
    line-height: 1;
}
.grid .product-item2 .info .price-note, .slider-module .product-item2 .info .price-note{
    font-size: 12px;
    color: #8f8f8f;
    text-align: center;
    margin-top: 10px;
}
.grid .product-item2 .quick-add, .slider-module .product-item2 .quick-add{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    text-align: center;
    color: var(--white);
    height: 40px;
    line-height: 40px;
    background-color: var(--so-green);
    cursor: pointer;
    font-weight: 600;
}

.grid .product-item2 span.not-avail, .slider-module .product-item2 span.not-avail{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    text-align: center;
    color: var(--so-orange);
    height: 40px;
    line-height: 1;
    cursor: pointer;
    font-weight: 600;
}
.grid .product-item2 .quick-add:hover, .slider-module .product-item2 .quick-add:hover{
    color: var(--white);
    background: var(--so-green-dark);
}
.add-msg .cart-err {
    color: var(--so-red);
}
@media (max-width: 768px) {
    .grid .product-item2 .image, .slider-module .product-item2 .image{
        margin-bottom: 50px;
    }
    .grid .product-item2 .title, .slider-module .product-item2 .title{
        font-size: 12px !important;
        font-weight: 500;
    }
    .grid .product-item2 .quick-add, .slider-module .product-item2 .quick-add{
        font-size: 12px;
    }
    .grid .product-item2 .quick-add .icon, .slider-module .product-item2 .quick-add .icon{
        width: 14px;
        height: 20px;
        position: relative;
        margin-right: 5px;
    }
    .grid .product-item2 .quick-add .icon:before , .slider-module .product-item2 .quick-add .icon:before{
        width: 14px;
        height: 20px;
        text-align: center;
        font-size: 16px;
    }
    .grid .product-item2 .info .prices .old-price, .slider-module .product-item2 .info .prices .old-price{
        display: none;
    }
    .grid .product-item2 span.not-avail, .slider-module .product-item2 span.not-avail{
        font-size: 10px;
    }
}

.extra-tiles{
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 15px;
    grid-row-gap: 15px;
}
.extra-tiles #subinfo{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 15px;
    grid-row-gap: 15px;
}
@media (max-width: 991px) {
    .extra-tiles{
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-column-gap: 0px;
        grid-row-gap: 0px;
    }
    .extra-tiles #subinfo{
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-column-gap: 0px;
        grid-row-gap: 0px;
    }
}

/* Pagination */
.pagination{
    margin-top: 15px;
}
.pagination .page-item .page-link{
    padding: 10px 15px;
    position: relative;
    display: block;
    color: var(--so-green);
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid var(--light-gray);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.pagination .page-item .page-link.active{
    color: var(--white);
    background-color: var(--so-green);
}
.pagination .page-item:first-child .page-link {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}
.pagination .page-item:last-child .page-link {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}
.pagination .page-item .page-link:focus, .pagination .page-item .page-link:hover{
    z-index: 3;
    color: var(--white);
    background-color: var(--so-green-dark);
    outline: 0;
    box-shadow: none;
}

/* Item grid slider */
.slider-module .banner{
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}
.slider-module .banner:hover{
    -webkit-box-shadow: 0 0 5px 0 var(--shadow);
    box-shadow: 0 0 5px 0 var(--shadow);
}
.slider-module .banner img{
    width: 100%;
}
.slider-module .banner .caption{
    position: absolute;
    top: 10px;
    left: 0;
    width: 100%;
}
.slider-module .banner .caption .title{
    padding: 10px 20px 10px 20px;
    font-size: 26px;
    font-weight: 600;
    color: var(--dark-gray);
    text-shadow: 1px 1px 0 #FFFFFF;
    transition: color 0.4s;
}
.slider-module .banner:hover .caption .title{
    color: var(--so-green);
}

@media (max-width: 768px) {
    .slider-module .banner .caption .title{
        font-size: 18px;
        font-weight: 600;
    }
}
@media (max-width: 599px) {
    .slider-module .banner .caption .title{
        font-size: 26px;
        font-weight: 600;
    }
}

.special-info{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 30px;
    grid-row-gap: 40px;
}
.special-info .block{
    position: relative;
    padding: 10px 0 0 70px;
    font-size: 16px;
}
.special-info .block:before{
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    width: 60px;
    height: 60px;
}
.special-info .block.free-shipping:before{
    background-image: url("../images/free-shipping.svg?v=0.1");
}
.special-info .block.secure-shopping:before{
    background-image: url("../images/secure-shopping.svg?v=0.1");
}
.special-info .block.satisfaction-guarantee:before{
    background-image: url("../images/satisfaction-guarantee.svg?v=0.1");
}
.special-info .block.satisfied-customers:before{
    background-image: url("../images/satisfied-customers-1.svg?v=0.1");
}

.special-info .block span{
   font-weight: 700;
}

@media (max-width: 1399px) {
    .special-info{
        grid-column-gap: 40px;
    }
    .special-info .block{
        padding: 60px 0 0 0;
        text-align: center;
    }
    .special-info .block:before{
        content: "";
        position: absolute;
        top: 0;
        left: calc(50% - 30px);
    }
}
@media (max-width: 991px) {
    .special-info{
        grid-template-columns: 1fr 1fr;
    }
    .special-info .block{
        font-size: 14px;
    }
}
@media (max-width: 768px) {
    .special-info .block{
        font-size: 14px;
    }
}

/* Comments */
.comment-item{
    padding: 10px 0;
}
.comment-item .comment-info{
    display: flex;
    align-items: center;
}
.comment-item .comment-info .customer-avatar{
    overflow: hidden;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 3px;
    background: #3fb149; /* Old browsers */
    background: -moz-linear-gradient(top,  #3fb149 0%, #94fcab 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #3fb149 0%,#94fcab 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #3fb149 0%,#94fcab 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.comment-item .comment-info .customer-avatar .inside{
    overflow: hidden;
    width: 44px;
    height: 44px;
    line-height: 44px;
    border-radius: 50%;
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    color: var(--so-green);
    background-color: white;
}
.comment-item .comment-info .customer-name{
    display: flex;
    font-size: 16px;
    font-weight: 600;
    margin-left: 15px;
}
.comment-item .comment-info .customer-name .customer-verified{
    font-size: 12px;
    font-weight: 600;
    display: flex;
    margin-left: 15px;
    color: var(--so-green);
    line-height: 20px;
    align-items: center;
}
.comment-item .comment-info .customer-name .customer-verified .verified{
    display: inline-block;
    width: 20px;
    height: 20px;
    position: relative;
    margin-right: 0px;
}
.comment-item .comment-info .customer-name .customer-verified .verified:before{
    content: "\ef76";
    font-family: "Material Symbols Rounded";
    position: absolute;
    width: 20px;
    height: 20px;
    top: 0;
    left: 0;
    text-align: center;
    line-height: 20px;
    font-size: 16px;
    font-weight: 400;
}
.comment-item .comment-text{
    position: relative;
    background-color: #fff;
    padding: 15px;
    font-size: 14px;
    font-weight: 600;
    margin-top: 15px;
    border-radius: 15px;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.comment-item .comment-text .comment-text-inner{
    overflow: hidden;
    position: relative;
    max-height: 86px;
}
.comment-item .comment-text .comment-text-inner.expand:before{
    content: '';
    position: absolute;
    bottom: 0;
    left:0;
    width: 100%;
    height: 20px;
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%);
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 80%);
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 80%);
}
.comment-item .comment-text .comment-text-inner.expand.open:before{
    height: 0px;
}
.comment-item .comment-text .comment-text-inner.open{
    max-height: none;
}

.comment-item .comment-text .comment-footer{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}
.comment-item .comment-text .comment-footer .comment-readmore{
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: var(--gray);
    cursor: pointer;
}
.comment-item .comment-text .comment-footer .comment-readmore:hover{
    color: var(--so-green);
}
.comment-item .comment-text .comment-footer .comment-date{
    font-size: 12px;
    font-weight: 600;
    color: #b6b6b6;
}
.comment-item .comment-text:before{
    content: '';
    position: absolute;
    top: -25px;
    left: 10px;
    width: 30px;
    height: 30px;
    border-left: 15px solid transparent;
    border-bottom: 15px solid #fff;
    border-right: 15px solid transparent;
    border-top: 15px solid transparent;
}
.comment-item .comment-text .stars{
    display: flex;
    align-items: center;
}
.comment-item .comment-text .stars .stars-title{
    display: inline-block;
    margin-right: 5px;
    font-size: 12px;
    font-weight: 600;
    color: #b6b6b6;
}
.comment-item .comment-text .stars .star-rating{
    display: inline-block;
}
.comment-item .comment-text .stars .star-rating:after {
    content: "";
    display: inline-block;
    border-radius: 4px;
    background-color: transparent;
    color: #febe42;
    font-size: 12px;
    line-height: 15px;
    font-weight: 700;
    padding: 0;
    position: relative;
    margin-top: 5px;
}
.comment-item .comment-text .stars .star-rating .star{
    display: inline-block;
    margin: 0;
    padding: 0;
    margin-right: 3px;
    position: relative;
}
.comment-item .comment-text .stars .star-rating .star:before {
    font-family: bootstrap-icons;
    content: "\F586";
    display: block;
    color: #febe42;
    font-size: 14px;
}
.comment-item .comment-text .stars .star-rating .star.half:after {
    font-family: bootstrap-icons;
    content: "\F587";
    display: block;
    color: #febe42;
    font-size: 14px;
    position: absolute;
    top: 0;
    width: 50%;
    height: 100%;
    overflow: hidden;
}
.comment-item .comment-text .stars .star-rating .star.empty:before {
    color: #ddd !important;
}


/* Product page */
.product-main{
    overflow: hidden;
    background: var(--white);
    border-radius: 8px;
    margin-top: 20px;
    display: grid;
    grid-template-columns: 50% 50%;
    grid-template-rows: auto auto;
    grid-column-gap: 0;
    grid-row-gap: 0px;
}
.product-main .product-images{
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    width: 100%;
    position: relative;
    border-right: 1px solid var(--light-gray);
}

.product-main .product-images .product-outlet{
    width: 100%;
    height: 50px;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
}
.product-main .product-images .product-outlet:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 50px;
    background-image: url("../images/label_outlet.svg");
    background-repeat: no-repeat;
}

.product-main .product-images .product-video{
    position: absolute;
    bottom: 50px;
    left: calc(50% - 108px);
    z-index: 2;
    display: flex;
    justify-content: center;
    height: 36px;
    line-height: 36px;
    padding: 0 10px;
    border: none;
    font-size: 14px;
    font-weight: 600;
    background-color: rgba(255,255,255,0.7);
    color: var(--so-green-dark);
    border-radius: 6px;
    -webkit-box-shadow: 0 0 0 1px var(--so-green);
    box-shadow: 0 0 0 1px var(--so-green);
    backdrop-filter: blur(4px);
}
.product-main .product-images .product-video .material-symbols-rounded{
    font-size: 20px;
    display: block;
    line-height: 36px;
    margin-right: 5px;
}
.product-main .product-images .product-video:hover{
    -webkit-box-shadow: 0 0 0 3px var(--so-green);
    box-shadow: 0 0 0 3px var(--so-green);
}

.product-main .product-images .product-flags{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 60px;
    z-index: 2;
}
.product-main .product-images .product-flags .recommend,
.product-main .product-images .product-flags .free-shipping,
.product-main .product-images .product-flags .new-product,
.product-main .product-images .product-flags .outlet,
.product-main .product-images .product-flags .savings{
    width: 60px;
    height: 60px;
    position: relative;
    margin-bottom: 10px;
}
.product-main .product-images .product-flags .recommend:after,
.product-main .product-images .product-flags .outlet:after,
.product-main .product-images .product-flags .new-product:after,
.product-main .product-images .product-flags .free-shipping:after{
    content: "";
    position: absolute;
    width: 60px;
    height: 60px;
}
.product-main .product-images .product-flags .recommend:after{
    background-image: url("../images/flag_recommend.svg");
}
.product-main .product-images .product-flags .free-shipping:after{
    background-image: url("../images/flag_free_shipping.svg");
}
.product-main .product-images .product-flags .new-product:after{
    background-image: url("../images/flag_new_product.svg");
}
.product-main .product-images .product-flags .new-product.new-product-slo:after{
    background-image: url("../images/flag_new_product_slo.svg");
}
.product-main .product-images .product-flags .outlet:after{
    background-image: url("../images/flag_outlet.svg");
}

.product-main .product-images .product-flags .savings{
    border-radius: 50%;
    background-color: var(--so-red);
    font-size: 9px;
    text-align: center;
    font-weight: 200;
    color: var(--white);
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
}
.product-main .product-images .product-flags .savings span{
    font-size: 12px;
    font-weight: 600;
}

.product-main .product-images .product-gallery{
    overflow: hidden;
}
.product-main .product-images .product-gallery .product-image{
    cursor: grab;
}
.product-main .product-images .product-gallery .product-image img{
    width: 100%;
}
.product-main .product-info{
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    padding: 15px 15px 15px 15px;
}

.product-main .product-info .product-title-block{
    display: grid;
    grid-template-columns: 1fr 46px;
    grid-column-gap: 15px;
}

.product-main .product-info .product-title{
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 0;
}
.product-main .product-info .product-code{
    font-size: 14px;
    font-weight: 600;
    margin-top: 5px;
}
.product-main .product-info .product-title-block .product-favorite{
    width: 46px;
    height: 60px;
}
.product-main .product-info .product-title-block .product-favorite .favorite-icon{
    width: 46px;
    height: 60px;
    border-radius: 8px;
    color: var(--gray);
    position: relative;
    cursor: pointer;
    background-color: var(--light-gray);
}
.product-main .product-info .product-title-block .product-favorite .favorite-icon .favorite-text{
    padding-top: 40px;
    font-size: 10px;
    text-align: center;
}
.product-main .product-info .product-favorite .favorite-icon.fav-on{
    color: var(--white);
    background-color: var(--so-red);
}
.product-main .product-info .product-favorite .favorite-icon:before{
    content: '\e87d';
    font-family: "Material Symbols Rounded";
    font-size: 30px;
    text-align: center;
    width: 46px;
    height: 46px;
    line-height: 49px;
    position: absolute;
    top: 0;
    left: 0;
}

.product-main .product-info .prices{
    display: flex;
    justify-content: space-between;
    margin: 25px 0;
    padding: 15px 0;
    border-top: 1px solid var(--light-gray);
    border-bottom: 1px solid var(--light-gray);
    overflow: hidden;
    position: relative;
}
/*.product-main .product-info .prices:before{
    content: "";
    position: absolute;
    top: calc(50% - 150px);
    left: calc(50% - 350px);
    width: 300px;
    height: 300px;
    border: 2px solid var(--light-gray);
    z-index: 0;
    transform: rotate(-45deg);
    -webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.1);
    box-shadow: 0 0 5px 0 rgba(0,0,0,.1);
}*/
.product-main .product-info .prices .prices-left{
    z-index: 1;
}
.product-main .product-info .prices .price{
    font-size: 28px;
    font-weight: 700;
    line-height: 1.15;
    color: var(--so-green);
}
.product-main .product-info .prices .price div{
    font-size: 13px;
    font-weight: 500;
    display: block;
    line-height: 1.15;
    color: var(--gray);
    margin-bottom: 5px;
}
.product-main .product-info .prices .discount-price{
    font-size: 28px;
    font-weight: 700;
    line-height: 1.15;
    color: var(--so-red);
}
.product-main .product-info .prices .discount-price div{
    font-size: 13px;
    font-weight: 500;
    display: block;
    line-height: 1.15;
    color: var(--gray);
    margin-bottom: 5px;
}
.product-main .product-info .prices .old-price{
    font-size: 16px;
    font-weight: 600;
    line-height: 1.15;
    color: var(--gray);
    text-decoration: line-through;
}
.product-main .product-info .prices .prices-right{
    text-align: right;
    z-index: 1;
}
.product-main .product-info .prices .prices-right.loyalty{
    padding: 10px;
    border-radius: 6px;
    background: rgb(53, 7, 80);
    background: -moz-linear-gradient(top, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(53, 7, 80, 1) 0%, #db620b 100%);
    background: linear-gradient(to bottom, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#350750', endColorstr='#8c11d6', GradientType=0);
}
.product-main .product-info .prices .loyalty-price{
    font-size: 28px;
    font-weight: 700;
    line-height: 1.15;
    color: #fff;
}
.product-main .product-info .prices .loyalty-price div{
    font-size: 13px;
    font-weight: 500;
    display: block;
    line-height: 1.15;
    color: #fff;
    margin-bottom: 5px;
}
.product-main .product-info .prices .loyalty-percent{
    font-size: 16px;
    font-weight: 700;
    display: block;
    line-height: 1.15;
    color: var(--gray);
}
.product-main .product-info .prices .loyalty-off{
    font-size: 13px;
    font-weight: 700;
    line-height: 1.15;
    color: var(--so-orange);
    margin-top: 10px;
}

.product-main .product-info .product-notices{
    font-size: 14px;
}
.product-main .product-info .product-notices .last{
    font-weight: 600;
    color: var(--so-red);
    padding: 0 0 0 25px;
    position: relative;
    font-size: 15px;
}
.product-main .product-info .product-notices .last:after {
    content: "\f155";
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    position: absolute;
    top: 2px;
    left: 0;
    width: 20px;
    height: 20px;
    line-height: 18px;
    text-align: center;
    color: var(--so-red);
    font-weight: 400;
}
.product-main .product-info .product-notices .price-notice{
    color: #777;
    padding: 0 0 0 25px;
    position: relative;
}
.product-main .product-info .product-notices .price-notice:after{
    content: "\e4fc";
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    position: absolute;
    top: 4px;
    left: 0;
    width: 20px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    color: inherit;
}
.product-main .product-info .product-notices .price-notice span{
    font-weight: 700;
}
.product-main .product-info .product-notices .quantity-notice{
    padding: 0 0 0 25px;
    font-weight: 600;
    color: var(--so-red);
    position: relative;
    margin-top: 5px;
}
.product-main .product-info .product-notices .quantity-notice:after{
    content: "\f155";
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    font-weight: 400;
    position: absolute;
    top: 4px;
    left: 0;
    width: 20px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    color: var(--so-red);
}
.product-main .product-info .product-notices .quantity-notice.blink{
    animation: blink 3s linear infinite;
}

.product-main .product-info .product-cart{
    margin-top: 20px;
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-column-gap: 15px;
}
.product-main .product-info .product-cart .quantity, .sticky-cart .product-infos .add .quantity{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 0px;
}
.product-main .product-info .product-cart .quantity .qty-minus, .product-cart .quantity .qty-plus,
.sticky-cart .product-infos .add .quantity .qty-minus, .sticky-cart .product-infos .add .quantity .qty-plus{
    display: block;
    height: 60px;
    width: 100%;
    background-color: var(--light-gray);
    cursor: pointer;
    position: relative;
    line-height: 60px;
    text-align: center;
}
.product-main .product-info .product-cart .quantity .qty-minus,
.sticky-cart .product-infos .add .quantity .qty-minus{
    -webkit-border-top-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}
.product-main .product-info .product-cart .quantity .qty-plus,
.sticky-cart .product-infos .add .quantity .qty-plus{
    -webkit-border-top-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    -moz-border-radius-bottomright: 6px;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}
.product-main .product-info .product-cart .quantity .qty-minus:after,
.product-main .product-info .product-cart .quantity .qty-plus:after,
.sticky-cart .product-infos .add .quantity .qty-minus:after,
.sticky-cart .product-infos .add .quantity .qty-plus:after{
    content: "\e15b";
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    font-weight: 700;
    position: absolute;
    width: inherit;
    height: inherit;
    text-align: center;
    line-height: inherit;
    top: 0;
    left:0;
    color: var(--gray);
}
.product-main .product-info .product-cart .quantity .qty-plus:after,
.sticky-cart .product-infos .add .quantity .qty-plus:after{
    content: "\e145";
}
.product-main .product-info .product-cart .quantity .qty-minus:hover,
.product-info .product-cart .quantity .qty-plus:hover,
.sticky-cart .product-infos .add .quantity .qty-minus:hover,
.sticky-cart .product-infos .add .quantity .qty-plus:hover{
    background-color: var(--so-green);
}
.product-main .product-info .product-cart .quantity .qty-minus:hover:after,
.product-main .product-info .product-cart .quantity .qty-plus:hover:after,
.sticky-cart .product-infos .add .quantity .qty-minus:hover:after,
.sticky-cart .product-infos .add .quantity .qty-plus:hover:after{
    color: #fff;
}
.product-main .product-info .product-cart .input-quantity,
.sticky-cart .product-infos .add .quantity .input-quantity
{
    display: block;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    border-radius: 0;
    border: none;
    border-top: 1px solid var(--light-gray);
    border-bottom: 1px solid var(--light-gray);
}
.product-main .product-info .product-cart .cart-add,
.sticky-cart .product-infos .add .cart-add{
    display: flex;
    justify-content: center;
    height: 60px;
    line-height: 60px;
    padding: 0;
    border: none;
    font-size: 20px;
    font-weight: 600;
    background-color: var(--so-green);
    border-radius: 6px;
}
.product-main .product-info .product-cart .cart-add .material-symbols-rounded,
.sticky-cart .product-infos .add .cart-add .material-symbols-rounded {
    font-size: 28px;
    display: block;
    line-height: 60px;
    margin-right: 10px;
}
.product-main .product-info .product-cart .cart-add .btn-text,
.sticky-cart .product-infos .add .cart-add .btn-text{
    display: block;
}
.product-main .product-info .product-cart .cart-add:hover,
.sticky-cart .product-infos .add .cart-add:hover{
    background-color: var(--so-green-dark);
}

.sticky-cart{
    padding: 15px 0;
    display: grid;
    grid-template-columns: 66px 1fr;
    grid-column-gap: 15px;
}
.sticky-cart .product-image{
    width: 66px;
}
.sticky-cart .product-image img{
    border-radius: 6px;
    border: 1px solid #f1f1f1;
    width: 100%;
}
.sticky-cart .product-infos{
    padding: 0;
}
.sticky-cart .product-infos .title{
    font-size: 14px;
    font-weight: 400;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.sticky-cart .product-infos .add{
    margin-top: 5px;
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-column-gap: 5px;
}
.sticky-cart .product-infos .add .quantity .qty-minus, .sticky-cart .product-infos .add .quantity .qty-plus{
    height: 40px;
    width: 100%;
    line-height: 40px;
}
.sticky-cart .product-infos .add .quantity .qty-minus:after,
.sticky-cart .product-infos .add .quantity .qty-plus:after{
    font-size: 14px;
    font-weight: 700;
}
.sticky-cart .product-infos .add .quantity .input-quantity {
    font-size: 18px;
    font-weight: 700;
}
.sticky-cart .product-infos .add .cart-add{
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    font-weight: 600;
}
.sticky-cart .product-infos .add .cart-add .material-symbols-rounded {
    font-size: 20px;
    display: block;
    line-height: 40px;
    margin-right: 10px;
}

.product-main .product-info .locations-availability{
    margin-top: 20px;
}
.product-main .product-info .locations-availability .la-title{
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 5px;
}
.product-main .product-info .locations-availability .location{
    display: inline-block;
    padding: 0 8px 0 6px;
    height: 30px;
    line-height: 30px;
    background-color: var(--light-gray);
    border-radius: 6px;
    color: var(--so-green);
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 3px;
}
.product-main .product-info .locations-availability .location.not-aval{
    background-color: var(--light-gray);
    color: #878486;
}
.product-main .product-info .locations-availability .location .icon-available, .product-main .product-info .locations-availability .location .icon-not-available{
    display: inline-block;
    width: 20px;
    height: 15px;
    position: relative;
}
.product-main .product-info .locations-availability .location .icon-available:before, .product-main .product-info .locations-availability .location .icon-not-available:before{
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    font-weight: 400;
    color: inherit;
    width: 20px;
    height: 20px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
}
.product-main .product-info .locations-availability .location .icon-available:before{
    content: '\e86c';
}
.product-main .product-info .locations-availability .location .icon-not-available:before{
    content: '\e5c9';
}

.product-main .product-info .product-visitors{
    color: #777;
    padding: 5px 10px 5px 10px;
    position: relative;
    margin-top: 15px;
    border-radius: 6px;
    border: 1px solid var(--so-blue);
    color: var(--so-blue);
    display: flex;
    justify-content: center;
}
.product-main .product-info .product-visitors .material-symbols-rounded{
    display: block;
    margin-right: 5px;
}
.product-main .product-info .product-share{
    margin-top: 20px;
}
.product-main .product-info .product-share .share-title{
    margin-bottom: 5px;
    font-weight: 600;
    color: var(--gray);
    position: relative;
    padding: 0 0 0 25px;
}
.product-main .product-info .product-share .share-title:after{
    content: "\e80d";
    font-family: "Material Symbols Rounded";
    font-size: 20px;
    position: absolute;
    top: 4px;
    left: 0;
    width: 20px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    color: inherit;
}
.product-main .product-info .product-share .share-icon{
    width: 48px;
    height: 48px;
    background: #fff;
    border: 1px solid var(--light-gray);
    border-radius: 6px;
    transition: all .3s;
    display: inline-block;
    line-height: 48px;
    text-align: center;
    color: #868686;
    font-size: 24px;
    margin-right: 5px;
}
.product-main .product-info .product-share .share-icon.email{ color: var(--dark-gray); font-size: 20px}
.product-main .product-info .product-share .share-icon.sms{ color: #ffa136;}
.product-main .product-info .product-share .share-icon.facebook{ color: #1d46b5;}
.product-main .product-info .product-share .share-icon.twitter{ color: #1d9bf0;}
.product-main .product-info .product-share .share-icon.whatsapp{ color: #128c7e;}
.product-main .product-info .product-share .share-icon.viber{ color: #563dbd;}

.product-main .product-info .product-share .share-icon.email:hover{ border-color: var(--dark-gray) }
.product-main .product-info .product-share .share-icon.sms:hover{ border-color: #ffa136 }
.product-main .product-info .product-share .share-icon.facebook:hover{ border-color: #1d46b5 }
.product-main .product-info .product-share .share-icon.twitter:hover{ border-color: #1d9bf0 }
.product-main .product-info .product-share .share-icon.whatsapp:hover{ border-color: #128c7e }
.product-main .product-info .product-share .share-icon.viber:hover{ border-color: #563dbd }

.product-main .product-desc{
    grid-column: 1 / 3;
    grid-row: 2 / 3;
    padding: 15px;
    border-top: 1px solid var(--light-gray);
    font-size: 16px;
}
.product-main .product-desc h3{
    font-size: 22px;
    font-weight: 600;
}
.product-main .product-desc .desc-title, .product-main .product-faq .faq-title {
    font-size: 22px;
    font-weight: 600;
}
.product-main .product-desc :last-child{
    margin-bottom: 0;
}

.product-main .product-faq{
    grid-column: 1 / 3;
    grid-row: 3 / 4;
    padding: 15px;
    border-top: 1px solid var(--light-gray);
}
.product-main .product-faq .faq-item{
    border: 1px solid var(--light-gray);
    border-radius: 8px;
    overflow: hidden;
    background-color: var(--light-gray);
    margin-bottom: 10px;
}
.product-main .product-faq .faq-item:last-child{
    margin-bottom: 0;
}
.product-main .product-faq .faq-item .faq-link{
    display: block;
    position: relative;
    padding: 15px 50px 15px 15px;
    font-size: 16px;
    font-weight: 600;
    border-bottom: 1px solid #e1e1e1;
    color: var(--dark-gray);
    transition: all 0.4s;
}
.product-main .product-faq .faq-item .faq-link:after{
    content: "\e145";
    font-family: "Material Symbols Rounded";
    font-size: 24px;
    position: absolute;
    top: calc(50% - 15px);
    right: 10px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    transition: all 0.2s;
}
.product-main .product-faq .faq-item .faq-link.open:after{
    transform: rotate(135deg);
}
.product-main .product-faq .faq-item .faq-link.open{
    color: var(--so-green);
}
.product-main .product-faq .faq-item .faq-content{
    padding: 15px 15px 15px 15px;
}

.product-main .product-comments{
    grid-column: 1 / 3;
    grid-row: 4 / 5;
    padding: 15px;
    padding-bottom: 30px;
    background-color: #fff4d6;
}
.product-main .product-comments .comments-title {
    font-size: 24px;
    font-weight: 600;
}

@media (max-width: 992px) {
    .product-main{
        grid-template-columns: 100%;
        grid-row-gap: 0px;
    }
    .product-main .product-images{
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        border-right: none;
    }
    .product-main .product-info{
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        padding: 15px;
    }
    .product-main .product-desc{
        grid-column: 1 / 2;
        grid-row: 3 / 4;
        padding: 15px;
        border-top: 1px solid var(--light-gray);
        border-right: none;
        font-size: 14px;
    }
    .product-main .product-desc h3{
        font-size: 20px;
        font-weight: 600;
    }
    .product-main .product-faq{
        grid-column: 1 / 2;
        grid-row: 4 / 5;
        border-top: 1px solid var(--light-gray);
    }
    .product-main .product-comments{
        grid-column: 1 / 2;
        grid-row: 5 / 6;
    }
    .product-main .product-info .product-title{
        font-size: 22px;
        font-weight: 700;
    }
    .product-main .product-info .prices{
        margin: 15px 0;
    }
    .product-info .product-cart{
        margin-top: 20px;
    }
    .sticky-cart{
        padding: 15px 0;
        grid-template-columns: 60px 1fr;
        grid-column-gap: 10px;
    }
    .sticky-cart .product-image{
        width: 60px;
    }
    .sticky-cart .product-infos .title{
        font-size: 12px;
        font-weight: 400;
    }
}
@media (max-width: 768px) {
    .product-main .product-images .product-outlet{
        width: 100%;
        height: 30px;
    }
    .product-main .product-images .product-outlet:after{
        width: 100%;
        height: 30px;
    }
    .product-main .product-info .prices .price{
        font-size: 22px;
        font-weight: 700;
        line-height: 1.15;
        color: var(--so-green);
    }
    .product-main .product-info .prices .discount-price{
        font-size: 22px;
        font-weight: 700;
        line-height: 1.15;
        color: var(--so-red);
    }
    .product-main .product-info .prices .old-price{
        font-size: 15px;
        font-weight: 600;
        line-height: 1.15;
        color: var(--gray);
        text-decoration: line-through;
    }
    .product-main .product-info .prices .loyalty-price{
        font-size: 22px;
        font-weight: 700;
        line-height: 1.15;
    }
    .product-description{
        padding: 15px;
    }
}
@media (max-width: 576px) {
    .hide-576{
        display: none;
    }
    .mobile-hpn{
        padding-left: 0;
        padding-right: 0;
    }
    .product-main{
        border-radius: 0;
        margin-top: 0;
    }
    .product-main .product-images{
        padding: 0;
        border-right: none;
    }
    .product-main .product-images .product-gallery .product-image img{
        border-radius: 0;
    }

    .product-main .product-images .product-flags{
        width: 56px;
        top: 10px;
        right: 5px;

    }
    .product-main .product-images .product-flags .recommend,
    .product-main .product-images .product-flags .free-shipping,
    .product-main .product-images .product-flags .new-product,
    .product-main .product-images .product-flags .savings{
        width: 56px;
        height: 56px;
    }
    .product-main .product-images .product-flags .recommend:after,
    .product-main .product-images .product-flags .free-shipping:after,
    .product-main .product-images .product-flags .new-product:after{
        width: 56px;
        height: 56px;
    }
    .product-main .product-images .product-flags .recommend:after{
        background-image: url("../images/flag_recommend.svg");
    }
    .product-main .product-images .product-flags .free-shipping:after{
        background-image: url("../images/flag_free_shipping.svg");
    }
    .product-main .product-images .product-flags .new-product:after{
        background-image: url("../images/flag_new_product.svg");
    }
    .product-main .product-images .product-flags .new-product.new-product-slo:after{
        background-image: url("../images/flag_new_product_slo.svg");
    }

    .product-main .product-images .product-flags .savings{
        font-size: 8px;
    }
    .product-main .product-images .product-flags .savings span{
        font-size: 11px;
    }

    .product-main .product-info .product-title{
        font-size: 18px;
        font-weight: 700;
    }
    .sticky-cart{
        grid-template-columns: 63px 1fr;
    }
    .sticky-cart .product-image{
        width: 63px;
    }
}

/* Cart - Checkout */
.cart-products{
    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 15px;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.cart-products .cart-item{
    display: grid;
    grid-template-columns: 80px 1fr;
    grid-template-rows: auto;
    grid-column-gap: 20px;
    padding: 15px;
    border-bottom: 1px solid #eee;
    position: relative;
}
.cart-products .cart-item .image img{
    border-radius: 6px;
}
.cart-products .cart-item .info{
    margin-bottom: 0;
    padding: 0;
    border-radius: 0;
}
.cart-products .cart-item .info .title{
    font-weight: 600;
    margin-bottom: 15px;
    padding-right: 40px;
}
.cart-products .cart-item .info .title .err-qty{
    color: var(--so-red);
}
.cart-products .cart-item .info .prices{
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    grid-column-gap: 15px;
}
.cart-products .cart-item .info .prices .quantity{
    display: flex;
    align-content: end;
    align-items: center;
}
.cart-products .cart-item .info .prices .quantity .qty{
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    padding: 3px 5px;
    border: 2px solid #eee;
    border-radius: 4px;
    margin-right: 5px;
    width: 33px;
}
.cart-products .cart-item .info .prices .quantity .qty.error{
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    padding: 3px 5px;
    border: 2px solid var(--so-red);
    border-radius: 4px;
    margin-right: 5px;
    width: 33px;
}
.cart-products .cart-item .info .prices .quantity span:not(.eur){
    display: inline-block;
    margin-right: 5px;
    font-size: 16px;
    font-weight:600;
    color: #999;
    line-height: 1;
}
.cart-products .cart-item .info .prices .total{
    text-align: right;
    font-size: 16px;
    font-weight:600;
    line-height: 1;
}
.cart-products .cart-item .remove{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    color: #aaa;
}
.cart-products .cart-item .remove:after{
    content: "\e5c9";
    font-family: "Material Symbols Rounded";
    top: 0px;
    left: 0px;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-size: 24px;
    position: absolute;
}
.cart-products .cart-item .remove:hover{
    color: var(--so-red);
}

/* Cart Totals */
.cart-totals{
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}
.cart-totals > .title{
    padding: 10px 15px 10px 15px;
    border-bottom: 1px solid #ddd;
    font-size: 18px;
    font-weight: 600;
}
.cart-totals .item{
    padding: 10px 15px 10px 15px;
    border-bottom: 1px solid #eee;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 10px;
}
.cart-totals .item:last-child{
    padding: 10px 15px 10px 15px;
    border-bottom: none;
    font-size: 16px;
}
.cart-totals .item .title{
    text-align: left;
}
.cart-totals .item .value{
    text-align: right;
    font-weight: 600;
}

.cart-discount-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

/* Cart Coupon */
.cart-coupon-active{
    display: grid;
    grid-template-columns: 100px 1fr 1.2fr;
    grid-template-rows: auto auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    background: rgb(103,32,4);
    background: linear-gradient(180deg, rgba(103,32,4,1) 0%, rgba(121,58,9,1) 35%, rgba(255,188,0,1) 100%);
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 15px;
}
.cart-coupon-active .lottie-player{
    width: 100px;
    height: 100px;
    grid-column: 1/2;
    grid-row: 1/3;
}
.cart-coupon-active .content{
    grid-column: 2/4;
    grid-row: 1/2;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
}
.cart-coupon-active .content .small-text{
    font-size: 14px;
    font-weight: 600;
}
.cart-coupon-active .form{
    grid-column: 2/4;
    grid-row: 2/3;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}
.cart-coupon-active .form .input-field{
    border-radius: 4px !important;
}
.cart-coupon-active .form .input-field::placeholder{
    color: #fff;
}
.cart-coupon-active .form .btn{
    height: 44px;
    padding: 0 15px;
    line-height: 40px;
    display: block;
}

.cart-discount-grid .cart-coupon-active{
    display: grid;
    grid-template-columns: 100px 1fr 1.2fr;
    grid-template-rows: auto auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    background: rgb(103,32,4);
    background: linear-gradient(180deg, rgba(103,32,4,1) 0%, rgba(121,58,9,1) 35%, rgba(255,188,0,1) 100%);
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 15px;
}
.cart-discount-grid .cart-coupon-active .lottie-player{
    width: 100px;
    height: 100px;
    grid-column: 1/2;
    grid-row: 1/3;
}
.cart-discount-grid .cart-coupon-active .content{
    grid-column: 2/4;
    grid-row: 1/2;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
}
.cart-discount-grid .cart-coupon-active .content .small-text{
    font-size: 14px;
    font-weight: 600;
}
.cart-discount-grid .cart-coupon-active .form{
    grid-column: 2/4;
    grid-row: 2/3;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}
.cart-discount-grid .cart-coupon-active .form .input-field{
    border-radius: 4px !important;
}
.cart-discount-grid .cart-coupon-active .form .input-field::placeholder{
    color: #fff;
}
.cart-discount-grid .cart-coupon-active .form .btn{
    height: 44px;
    padding: 0 15px;
    line-height: 40px;
    display: block;
}

/* Cart Loyalty */
.cart-loyalty, .cart-loyalty-active{
    background: rgb(53, 7, 80);
    background: -moz-linear-gradient(top, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(53, 7, 80, 1) 0%, #db620b 100%);
    background: linear-gradient(to bottom, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 15px;
}
.cart-loyalty a{
    display: flex;
    align-items: center;
}
.cart-loyalty a .lottie-player{
    width: 100px;
    height: 100px;
}
.cart-loyalty .content{
    font-size: 18px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
    margin-left: 10px;
}
.cart-loyalty .content .small-text{
    font-size: 14px;
    font-weight: 600;
}

.cart-loyalty-active{
    display: grid;
    grid-template-columns: 100px 1fr 1.2fr;
    grid-template-rows: auto auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}
.cart-loyalty-active .lottie-player{
    width: 100px;
    height: 100px;
    grid-column: 1/2;
    grid-row: 1/3;
}
.cart-loyalty-active .content{
    grid-column: 2/3;
    grid-row: 1/3;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
    margin-top: 25px;
}
.cart-loyalty-active .content .small-text{
    font-size: 14px;
    font-weight: 600;
}
.cart-loyalty-active .form{
    grid-column: 3/4;
    grid-row: 1/3;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    margin-top: 25px;
}
.cart-loyalty-active .form .input-field{
    border-radius: 4px !important;
}
.cart-loyalty-active .form .input-field::placeholder{
    color: #fff;
}
.cart-loyalty-active .form .btn{
    height: 44px;
    padding: 0 15px;
    line-height: 40px;
    display: block;
}

.cart-discount-grid .cart-loyalty, .cart-loyalty-active{
    background: rgb(53, 7, 80);
    background: -moz-linear-gradient(top, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(53, 7, 80, 1) 0%, #db620b 100%);
    background: linear-gradient(to bottom, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 15px;
}
.cart-discount-grid .cart-loyalty a{
    display: flex;
    align-items: center;
}
.cart-discount-grid .cart-loyalty a .lottie-player{
    width: 100px;
    height: 100px;
}
.cart-discount-grid .cart-loyalty .content{
    font-size: 18px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
    margin-left: 10px;
}
.cart-discount-grid .cart-loyalty .content .small-text{
    font-size: 14px;
    font-weight: 600;
}

.cart-discount-grid .cart-loyalty-active{
    display: grid;
    grid-template-columns: 100px 1fr 1.2fr;
    grid-template-rows: auto auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}
.cart-discount-grid .cart-loyalty-active .lottie-player{
    width: 100px;
    height: 100px;
    grid-column: 1/2;
    grid-row: 1/3;
}
.cart-discount-grid .cart-loyalty-active .content{
    grid-column: 2/4;
    grid-row: 1/2;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 600;
    color: #fff;
    margin-top: 0;
}
.cart-discount-grid .cart-loyalty-active .content .small-text{
    font-size: 14px;
    font-weight: 600;
}
.cart-discount-grid .cart-loyalty-active .form{
    grid-column: 2/4;
    grid-row: 2/3;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    margin-top: 0;
}
.cart-discount-grid .cart-loyalty-active .form .input-field{
    border-radius: 4px !important;
}
.cart-discount-grid .cart-loyalty-active .form .input-field::placeholder{
    color: #fff;
}
.cart-discount-grid .cart-loyalty-active .form .btn{
    height: 44px;
    padding: 0 15px;
    line-height: 40px;
    display: block;
}

/* Cart Notices */
.cart-gift{
    background: #000000;
    background: -moz-linear-gradient(top,  #000000 0%, #565656 100%);
    background: -webkit-linear-gradient(top,  #000000 0%,#565656 100%);
    background: linear-gradient(to bottom,  #000000 0%,#565656 100%);
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}
.cart-gift .lottie-player{
    width: 60px;
    height: 60px;
}
.cart-gift .content{
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    color: #fab021;
    margin-left: 10px;
}

.cart-gift-open{
    background: #000000;
    background: -moz-linear-gradient(top,  #000000 0%, #565656 100%);
    background: -webkit-linear-gradient(top,  #000000 0%,#565656 100%);
    background: linear-gradient(to bottom,  #000000 0%,#565656 100%);
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    position: relative;
    overflow: hidden;
}
.cart-gift-open .lottie-player{
    width: 60px;
    height: 60px;
}
.cart-gift-open .lottie-player-bg{
    position: absolute;
    width: 320px;
    height: 320px;
    top: 0;
    left: 0;
}
.cart-gift-open .content{
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    color: #fab021;
    margin-left: 10px;
}

.cart-free-coupon{
    background: rgba(255, 188, 0, 1);
    background: linear-gradient(180deg, rgba(103, 32, 4, 1) 0%, rgba(121, 58, 9, 1) 35%, rgba(255, 188, 0, 1) 100%);
    padding: 10px;
    border-radius: 8px;
    display: grid;
    grid-template-columns: 60px 1fr;
    align-items: center;
    margin-bottom: 15px;
}
.cart-free-coupon .lottie-player{
    width: 60px;
    height: 60px;
}
.cart-free-coupon .content{
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    color: #fff;
    margin-left: 10px;
}

.cart-free-shipping{
    background: rgb(0,36,84);
    background: -moz-linear-gradient(top,  rgba(0,36,84,1) 0%, rgba(0,153,255,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(0,36,84,1) 0%,rgba(0,153,255,1) 100%);
    background: linear-gradient(to bottom,  rgba(0,36,84,1) 0%,rgba(0,153,255,1) 100%);
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}
.cart-free-shipping .lottie-player{
    width: 68px;
    height: 60px;
}
.cart-free-shipping .content{
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    color: #fff;
    margin-left: 10px;
}

.cart-top-products{
    background: #6d1c1c;
    background: -moz-linear-gradient(top,  #6d1c1c 0%, #f72727 100%);
    background: -webkit-linear-gradient(top,  #6d1c1c 0%,#f72727 100%);
    background: linear-gradient(to bottom,  #6d1c1c 0%,#f72727 100%);
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    position: relative;
    overflow: hidden;
}
.cart-top-products .lottie-player{
    width: 60px;
    height: 60px;
}
.cart-top-products .lottie-player-bg{
    width: 200px;
    height: 200px;
    position: absolute;
    top: -60px;
    left: -60px
}
.cart-top-products .content{
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    color: #fff;
    margin-left: 10px;
}

/* Cart Buttons*/
.cart-buttons{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 15px;
}

@media (max-width: 1200px) {
    .cart-discount-grid{
        display: grid;
        grid-template-columns: 1fr;
        gap: 0px;
    }
}

@media (max-width: 768px) {
    .cart-products .cart-item{
        grid-template-columns: 50px 1fr;
    }
    .cart-products .cart-item .info .title{
        font-size: 12px;
    }

    .cart-discount-grid{
        display: grid;
        grid-template-columns: 1fr;
        gap: 0px;
    }

    .cart-loyalty-active{
        grid-template-columns: 55px 1fr 1fr;
    }
    .cart-loyalty-active .lottie-player{
        width: 60px;
        height: 60px;
        grid-column: 1/2;
        grid-row: 1/2;
    }
    .cart-loyalty-active .content{
        grid-column: 2/4;
        grid-row: 1/2;
        font-size: 18px;
        line-height: 1.3;
        margin-top: 10px;
    }
    .cart-loyalty-active .content .small-text{
        font-size: 14px;
        font-weight: 600;
    }
    .cart-loyalty-active .form{
        grid-column: 1/4;
        grid-row: 2/3;
        display: grid;
        grid-template-columns: 1.5fr 1fr;
        margin-top: 0px;
    }
    .cart-loyalty-active .form .input-field{
        border-radius: 4px !important;
        color: #350750;
    }
    .cart-loyalty-active .form .input-field::placeholder{
        color: #fff;
        font-size: 13px;
    }
    .cart-loyalty-active .form .btn{
        height: 44px;
        padding: 0 5px;
        line-height: 42px;
        display: block;
    }

    .cart-discount-grid .cart-loyalty-active{
        grid-template-columns: 55px 1fr 1fr;
    }
    .cart-discount-grid .cart-loyalty-active .lottie-player{
        width: 60px;
        height: 60px;
        grid-column: 1/2;
        grid-row: 1/2;
    }
    .cart-discount-grid .cart-loyalty-active .content{
        grid-column: 2/4;
        grid-row: 1/2;
        font-size: 18px;
        line-height: 1.3;
        margin-top: 10px;
    }
    .cart-discount-grid .cart-loyalty-active .content .small-text{
        font-size: 14px;
        font-weight: 600;
    }
    .cart-discount-grid .cart-loyalty-active .form{
        grid-column: 1/4;
        grid-row: 2/3;
        display: grid;
        grid-template-columns: 1.5fr 1fr;
        margin-top: 0px;
    }
    .cart-discount-grid .cart-loyalty-active .form .input-field{
        border-radius: 4px !important;
        color: #350750;
    }
    .cart-discount-grid .cart-loyalty-active .form .input-field::placeholder{
        color: #fff;
        font-size: 13px;
    }
    .cart-discount-grid .cart-loyalty-active .form .btn{
        height: 44px;
        padding: 0 5px;
        line-height: 42px;
        display: block;
    }

    .cart-coupon-active{
        grid-template-columns: 55px 1fr 1fr;
    }
    .cart-coupon-active .lottie-player{
        width: 60px;
        height: 60px;
        grid-column: 1/2;
        grid-row: 1/2;
    }
    .cart-coupon-active .content{
        grid-column: 2/4;
        grid-row: 1/2;
        font-size: 18px;
        line-height: 1.3;
        margin-top: 10px;
    }
    .cart-coupon-active .content .small-text{
        font-size: 14px;
        font-weight: 600;
    }
    .cart-coupon-active .form{
        grid-column: 1/4;
        grid-row: 2/3;
        display: grid;
        grid-template-columns: 1.5fr 1fr;
        margin-top: 0px;
    }
    .cart-coupon-active .form .input-field{
        border-radius: 4px !important;
        color: #350750;
    }
    .cart-coupon-active .form .input-field::placeholder{
        color: #fff;
    }
    .cart-coupon-active .form .btn{
        height: 44px;
        padding: 0 5px;
        line-height: 42px;
        display: block;
    }

    .cart-discount-grid .cart-coupon-active{
        grid-template-columns: 55px 1fr 1fr;
    }
    .cart-discount-grid .cart-coupon-active .lottie-player{
        width: 60px;
        height: 60px;
        grid-column: 1/2;
        grid-row: 1/2;
    }
    .cart-discount-grid .cart-coupon-active .content{
        grid-column: 2/4;
        grid-row: 1/2;
        font-size: 18px;
        line-height: 1.3;
        margin-top: 10px;
    }
    .cart-discount-grid .cart-coupon-active .content .small-text{
        font-size: 14px;
        font-weight: 600;
    }
    .cart-discount-grid .cart-coupon-active .form{
        grid-column: 1/4;
        grid-row: 2/3;
        display: grid;
        grid-template-columns: 1.5fr 1fr;
        margin-top: 0px;
    }
    .cart-discount-grid .cart-coupon-active .form .input-field{
        border-radius: 4px !important;
        color: #350750;
    }
    .cart-discount-grid .cart-coupon-active .form .input-field::placeholder{
        color: #fff;
        font-size: 13px;
    }
    .cart-discount-grid .cart-coupon-active .form .btn{
        height: 44px;
        padding: 0 5px;
        line-height: 42px;
        display: block;
    }
}

@media (max-width: 576px) {
    .cart-buttons{
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-column-gap: 15px;
        grid-row-gap: 15px;
    }
}

/* Checkout Form */
.checkout-company-data{
    display: none;
}

/* Thanks page */
.thanks{
    background: #fff;
    overflow: hidden;
    border-radius: 8px;
    padding: 15px;
    position: relative;
    margin-bottom: 15px;
}
.thanks:first-child{
    margin-top: 15px;
}
.thanks .lottie-player{
    width: 100px;
    height: 100px;
    margin: 0 auto;
}
.thanks .lottie-player-bg{
    width: 860px;
    height: 860px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    opacity: 0.7;
}
.thanks *:not(.lottie-player-bg) {
    z-index: 1;
}
.thanks p{
    font-size: 16px;
}

.thanks ul li{
    font-size: 16px;
}
@media (max-width: 576px) {
    .thanks .lottie-player-bg{
        width: 576px;
        height: 576px;
    }
}

/* Profile page */
.profile-loyalty{
    text-align: right;
}
.profile-loyalty .inner{
    display: inline-block;
    padding: 15px;
    border-radius: 8px;
}
.profile-loyalty .inner .lottie-player{
    width: 60px;
    height: 60px;
    margin: 0 auto;
}
.profile-loyalty .inner .text{
    color: #fff;
    text-align: center;
}
.profile-loyalty .inner .percent{
    color: #fff;
    text-align: center;
    font-size: 28px;
    line-height: 1;
    font-weight: 600;
}
@media (max-width: 768px) {
    .profile-loyalty{
        text-align: center;
        margin-top: 15px;
    }
    .profile-loyalty .inner{
        display: flex;
        align-items: center;
    }
    .profile-loyalty .inner .lottie-player{
        width: 80px;
        height: 80px;
        margin: 0 20px 0 0;
    }
    .profile-loyalty .inner .text{
        color: #fff;
        text-align: left;
    }
    .profile-loyalty .inner .text .percent{
        text-align: left;
        font-size: 34px;
        font-weight: 700;
    }
}

.orders .collapse-item:last-child{
    margin-bottom: 30px;
}
.orders .list-group-item.order-item ul{
    margin:  10px 0 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 10px;
    grid-row-gap: 1px;
}
.orders .list-group-item.order-item ul li{
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
}
.order-item .customer-order-item{
    display: grid;
    grid-template-columns: 50% 1fr 1fr 1fr 1fr;
    gap: 10px;
    grid-template-rows: auto;
}

.orders .list-group-item.total-item{
    display: grid;
    grid-template-columns: 3fr 1fr;
}
.orders .list-group-item.total-item span{
    text-align: right;
    font-size: 16px;
    font-weight: 600;
}

@media (max-width: 768px) {
    .orders .list-group-item.order-item ul{
        grid-template-columns: 1fr 1fr;
    }
    .orders .list-group-item.total-item{
        grid-template-columns: 1fr 1fr;
    }
    .order-item .customer-order-item{
        display: grid;
        grid-template-columns: 40% 1fr 1fr 1fr 1fr;
        gap: 10px;
        grid-template-rows: auto;
    }
}
/* Info page */
.info{
    background: #fff;
    padding: 15px;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    margin-bottom: 30px;
}
.info img{
    width: auto;
    height: auto;
}

/* Footer */
footer{
    position: relative;
    padding: 50px 0 0 0;
    box-shadow: 0 0 5px 0 var(--shadow);
    background-color: #0a1821;
    background: -moz-linear-gradient(top,  rgba(10,24,33,1) 0%, rgba(10,24,33,1) 50%, rgba(0,17,28,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(10,24,33,1) 0%,rgba(10,24,33,1) 50%,rgba(0,17,28,1) 100%);
    background: linear-gradient(to bottom,  rgba(10,24,33,1) 0%,rgba(10,24,33,1) 50%,rgba(0,17,28,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a1821', endColorstr='#00111c',GradientType=0 );
}
footer .footer-menu{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 30px;
    grid-row-gap: 20px;
}
footer .footer-menu .menu-1{
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}
footer .footer-menu .menu-2{
    grid-column: 2 / 3;
    grid-row: 1 / 2;
}
footer .footer-menu .additional-menu{
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    margin-left: 80px;
}
footer .footer-menu .additional-menu .footer-btn{
    position: relative;
    display: block;
    margin: 15px 0;
    padding: 5px 10px 5px 45px;
    font-size: 18px;
    color: var(--white);
    cursor: pointer;
}
footer .footer-menu .additional-menu .footer-btn:after{
    font-family: "Material Symbols Rounded";
    font-size: 26px;
    font-weight: 200;
    position: absolute;
    top: -6px;
    left: 0px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: var(--so-white);
}
footer .footer-menu .additional-menu .footer-btn:hover{
    color: var(--so-green);
}
footer .footer-menu .additional-menu .footer-btn.send-form:after{
    content: "\e158";
}
footer .footer-menu .additional-menu .footer-btn.find-store:after{
    content: "\ea12";
}
footer h3{
    font-size: 16px;
    font-weight: 500;
    color: var(--white);
    margin-bottom: 5px;
}
footer ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
footer ul li{
    display: inline-block;
    margin-right: 20px;
    margin-bottom: 5px;
}
footer ul li a{
    color: var(--white);
}
footer ul li a:hover{
    color: var(--so-green);
}

footer .powered-by{
    padding: 20px 0 20px 0;
    text-align: center;
}
footer .powered-by img{
    width: 60px;
}
footer .powered-by div{
    margin-top: 10px;
    color: var(--white);
    font-size: 12px;
}

@media (max-width: 1199px) {
    footer .footer-menu{
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto ;
    }
    footer .footer-menu .menu-1{
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }
    footer .footer-menu .menu-2{
        grid-column: 2 / 3;
        grid-row: 1 / 2;
    }
    footer .footer-menu .additional-menu{
        grid-column: 1 / 4;
        grid-row: 2 / 3;
        margin-left: 0;
        text-align: center;
    }
    footer .footer-menu .additional-menu .footer-btn{
        position: relative;
        display: inline-block;
        margin: 15px 0;
        padding: 5px 10px 5px 45px;
        font-size: 18px;
        color: var(--white);
    }
}
@media (max-width: 768px) {
    footer .footer-menu{
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
    }
    footer .footer-menu .menu-1{
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }
    footer .footer-menu .menu-2{
        grid-column: 1 / 2;
        grid-row: 2 / 3;
    }
    footer .footer-menu .additional-menu{
        grid-column: 1 / 2;
        grid-row: 3 / 4;
    }
}

.back-to-top{
    display: block;
    position: absolute;
    top: -30px;
    left: calc(50% - 30px);
    width: 60px;
    height: 60px;
    -webkit-box-shadow: 0 0 0 5px #f1f1f1;
    box-shadow: 0 0 0 5px #f1f1f1;
    background-color: #ffffff;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.4s;
}
.back-to-top:hover{
    background-color: var(--so-green);
}
.back-to-top:after{
    content: "\e5ce";
    display: block;
    font-family: "Material Symbols Rounded";
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 38px;
    font-weight: 400;
    color: var(--so-green);
}
.back-to-top:hover:after{
    color: var(--white);
}

/* Cookies */
.cookie-notice{
    z-index: 99;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px;
    transition: all 1s;
    display: flex;
    justify-content: center;
}

.cookie-notice .cn-inner{
    position: relative;
    display: grid;
    grid-template-columns: 1fr 60px;
    grid-template-rows: auto;
    grid-column-gap: 14px;
    grid-row-gap: 10px;
    background-color: var(--white);
    -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.2);
    box-shadow: 0 0 20px 0 rgba(0,0,0,.2);
    border-radius: 8px;
    padding: 15px;
    width: 700px;
}
.cookie-notice .cn-inner .cn-text{
    font-size: 12px;
}
@media (max-width: 768px) {
    .cookie-notice{
        z-index: 99;
        position: relative;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 0px;
        transition: all 1s;
        display: flex;
        justify-content: center;
    }

    .cookie-notice .cn-inner{
        position: relative;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-column-gap: 14px;
        grid-row-gap: 10px;
        background-color: var(--white);
        -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.0);
        box-shadow: 0 0 20px 0 rgba(0,0,0,.0);
        border-radius: 0px;
        padding: 15px;
        width: 100%;
    }
}

/* Employment */
.employment-notice{
    z-index: 99;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px;
    transition: all 1s;
    display: flex;
    justify-content: center;
}

.employment-notice .en-inner{
    position: relative;
    display: grid;
    grid-template-columns: 1fr 167px;
    grid-template-rows: auto;
    grid-column-gap: 14px;
    grid-row-gap: 10px;
    background-color: #fff;
    -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.2);
    box-shadow: 0 0 20px 0 rgba(0,0,0,.2);
    border-radius: 8px;
    padding: 15px;
    padding-left: 90px;
    width: 400px;
}
.employment-notice .en-inner .en-anim{
    width: 100px;
    height: 130px;
    overflow: hidden;
    position: absolute;
    bottom: -0px;
    left: -3px;
}
.employment-notice .en-inner .en-anim .lottie-player{
    width: 200px;
    height: 200px;
    position: absolute;
    bottom: -38px;
    left: -65px;
}
.employment-notice .en-inner .en-text{
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
}
@media (max-width: 768px) {
    .employment-notice .en-inner{
        grid-template-columns: 1fr
    }
}


.offcanvas-bottom {
    right: 0;
    left: 0;
    height: auto;
    max-height: 100%;
    border-top: none;
    transform: translateY(100%);
    -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    background: #fff;
}
.offcanvas-bottom .offcanvas-body{
    padding: 30px;
}
.offcanvas .offcanvas-header.offcanvas-header-border{
    border-bottom: 1px solid #eee;
}
.offcanvas.height-50{
    max-height: 54%;
}

.offcanvas .product-item{
    -webkit-box-shadow: 0 0 0 1px #eee;
    box-shadow: 0 0 0 1px #eee;
}


/* Mobile detect */
.device-detect{
    display: grid;
    grid-template-columns: 40px 1fr;
    grid-column-gap: 15px;
}
.device-detect .dd-image{
    font-size: 30px;
}
.device-detect .dd-content .dd-text{
    font-size: 16px;
}
.device-detect .dd-content .dd-text .dd-name{
    font-weight: 700;
}
.device-detect .dd-content .dd-buttons{
    display: grid;
    grid-template-columns: 1fr 60px;
    grid-column-gap: 15px;
    margin-top: 10px;
}
.device-detect .dd-content .dd-buttons a{
    background-color: #0a1821;
    border: 1px solid #0a1821;
    color: #fff;
    display: block;
    padding: 10px;
    text-align: center;
    font-size: 16px;
    font-weight: 200;
    border-radius: 4px;
    cursor: pointer;
}
.device-detect .dd-content .dd-buttons a.outline{
    background-color: transparent;
    border: 1px solid #0a1821;
    color: #0a1821;
}

.field{
    margin-bottom: 15px;
    color: var(--dark-gray);
    position: relative;
}
.field.transparent{
    color: var(--white);
}
.field:last-child{
    margin-bottom: 0px;
}
.field .field-label{
    color: inherit;
}
.field.transparent .field-label{
    color: inherit;
}

.suggesstion-city, .suggesstion-zipcode{
    display: none;
    position: absolute;
    top: 45px;
    left: 0;
    background: #fff;
    border-radius: 8px;
    -webkit-box-shadow: 0 0 5px 0 var(--shadow);
    box-shadow: 0 0 5px 0 var(--shadow);
    overflow: hidden;
    width: calc(100% - 20px);
    margin: 0 10px;
    z-index: 5;
    padding: 0;
}
.suggesstion-city.open, .suggesstion-zipcode.open{
    display: block;
}
.suggesstion-city .suggesstion-title, .suggesstion-zipcode .suggesstion-title{
    padding: 5px 15px;
    font-size: 13px;
    font-weight: 500;
    color: #787878;
    border-bottom: 1px solid #f1f1f1;
}
.suggesstion-city .suggesstion-inner, .suggesstion-zipcode .suggesstion-inner{
    overflow-y: auto;
    min-height: 0;
    max-height: 215px;
}
.suggesstion-city .suggesstion-item, .suggesstion-zipcode .suggesstion-item{
    display: block;
    padding: 5px 15px;
    color: #0b0b0b;
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
    border-bottom: 1px solid #f1f1f1;
}
.suggesstion-city .suggesstion-item:hover, .suggesstion-zipcode .suggesstion-item:hover{
    color: var(--so-green);
    background-color: #f5f5f5;
}
.suggesstion-city .suggesstion-item:last-child, .suggesstion-zipcode .suggesstion-item:last-child{
    border-bottom: none;
}

@media (max-width: 768px) {
    .suggesstion-city{
        left: -3px;
        width: calc(200% - 15px);
    }
    .suggesstion-zipcode{
        left: unset;
        right: -3px;
        width: calc(200% - 15px);
    }
}

input.input-field{
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    width: 100%;
    border: 1px solid #ddd;
    padding: 7px 10px;
    border-radius: 6px;
    outline-color: var(--so-green);
}
textarea.input-field{
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    max-height: 500px;
    border: 1px solid #ddd;
    padding: 10px;
    border-radius: 6px;
    outline-color: var(--so-green);
}
.field.transparent input.input-field{
    font-size: 18px;
    font-weight: 700;
    border: 1px solid rgba(255,255,255, 0);
    border-radius: 6px;
    outline-color: var(--so-green);
    background-color: rgba(255,255,255, 0.6);
}
.field.transparent input.input-field:-webkit-autofill,
.field.transparent input.input-field:-webkit-autofill:hover,
.field.transparent input.input-field:-webkit-autofill:focus,
.field.transparent input.input-field:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px rgba(255,255,255, 0.5) inset !important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type=number] {
    -moz-appearance: textfield;
}

.checkbox-field input{
    display: none;
}
.checkbox-field label{
    background: #fff;
    padding: 10px 10px 10px 50px;
    border-radius: 6px;
    margin-bottom: 10px;
    display: block;
    transition: all 0.4s;
    cursor: pointer;
    position: relative;
    -webkit-box-shadow:inset 0 0 0 1px #ddd;
    box-shadow:inset 0 0 0 1px #ddd;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.checkbox-field label.shadow1{
    -webkit-box-shadow:inset 0 0 0 1px #ddd;
    box-shadow:inset 0 0 0 1px #ddd;
}
.checkbox-field label:after{
    content: '\e835';
    font-family: "Material Symbols Rounded";
    position: absolute;
    width: 28px;
    height: 28px;
    line-height: 28px;
    font-size: 28px;
    font-weight: 200;
    text-align: center;
    color: #ddd;
    top: calc(50% - 14px);
    left: 10px;
}
.checkbox-field label .label-inner{
    display: flex;
    align-items: center;
}

.checkbox-field label .label-inner .info{
    flex-shrink: 1;
    justify-content: center;
}
.checkbox-field label .name, .checkbox-field label .price{
    transition: 0.4s;
    font-weight: 400;
    font-size: 15px;
}
.checkbox-field label .price{
    font-size: 15px;
}

.checkbox-field input:checked + label .name, .checkbox-field input:checked + label .price{
    color: var(--so-green);
    font-weight: 600;
}
.checkbox-field input:checked + label:after{
    content: '\e834';
    font-family: "Material Symbols Rounded";
    color: var(--so-green);
}
/*---Radio---*/
.radio-field input{
    display: none;
}
.radio-field label{
    background: #fff;
    padding: 0;
    border-radius: 6px;
    margin-bottom: 10px;
    display: block;
    transition: all 0.4s;
    cursor: pointer;
    -webkit-box-shadow:inset 0 0 0 1px #ddd;
    box-shadow:inset 0 0 0 1px #ddd;
    overflow: hidden;
}
.radio-field label.disabled{
    background: #ddd;
}
.radio-field label .field-info{
    padding: 10px 10px 10px 50px;
    position: relative;
}
.radio-field label .field-info.has-icon{
    padding: 10px 10px 10px 50px;
    position: relative;
    display: grid;
    grid-template-columns: 1fr 50px;
    grid-column-gap: 10px;
    align-items: center;
}
.radio-field label .has-icon .payment-logo img{
    width: 50px;
}
.radio-field label .field-info:after{
    content: '\e836';
    font-family: "Material Symbols Rounded";
    position: absolute;
    width: 28px;
    height: 28px;
    line-height: 28px;
    font-size: 28px;
    font-weight: 200;
    text-align: center;
    color: #ddd;
    top: calc(50% - 14px);
    left: 10px;
}
.radio-field label .name, .radio-field label .price{
    transition: 0.4s;
    font-weight: 600;
    font-size: 15px;
}
.radio-field label .price{
    font-size: 15px;
    font-weight: 700;
}
.radio-field input:checked + label .field-info{
    border-bottom: 1px dashed var(--so-green-dark);
}
.radio-field input:checked + label{
    -webkit-box-shadow:inset 0 0 0 1px #eaffea;
    box-shadow:inset 0 0 0 2px var(--so-green-dark);
    background-color: #eaffea;
}
.radio-field input:checked + label .name{
    color: #26602b;
    font-weight: 600;
}
.radio-field input:checked + label .price{
    color: #26602b;
    font-weight: 700;
}
.radio-field input:checked + label .field-info:after{
    content: '\e86c';
    font-family: "Material Symbols Rounded";
    color: var(--so-green-dark);
}
.radio-field input:checked + label .description{
    color: #26602b;
}
.radio-field label .description{
    padding: 15px;
    display: none;
    transition: all 0.3s;
}
.radio-field label .description p:last-child{
    margin-bottom: 0;
}
.radio-field input:checked + label .description{
    display: block;
}
.radio-field label .payments-grid{
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 50px 50px 50px 50px 50px 50px 50px;
    gap: 10px;
}
.product-payments .payments-grid img{
    cursor: pointer;
}
@media (max-width: 420px) {
    .radio-field label .payments-grid{
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
        grid-template-rows: auto;
        gap: 4px;
    }
}
/*---*/
.dropdown-radio input{
    display: none;
}
.dropdown-radio label{
    background: #fff;
    padding: 5px 10px 5px 35px;
    display: block;
    transition: all 0.4s;
    cursor: pointer;
    position: relative;
    font-weight: 600;
    font-size: 13px;
}
.dropdown-radio label:after{
    content: '\e836';
    font-family: "Material Symbols Rounded";
    position: absolute;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 20px;
    font-weight: 200;
    text-align: center;
    color: #ddd;
    top: calc(50% - 11px);
    left: 10px;
}
.dropdown-radio input:checked + label{
    color: var(--so-green);
}
.dropdown-radio input:checked + label:after{
    content: '\e86c';
    font-family: "Material Symbols Rounded";
    color: var(--so-green);
}
.field-error{
    color: var(--so-red) !important;
    border: 1px solid var(--so-red) !important;
    outline-color: var(--so-red) !important;
}
#message{
    display: none;
}

.btn {
    background-color: #0a1821;
    border: 1px solid #0a1821;
    color: #fff;
    display: inline-block;
    padding: 10px 15px;
    text-align: center;
    font-size: 16px;
    font-weight: 200;
    border-radius: 4px;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: all 0.4s;
}

@media (prefers-reduced-motion: reduce) {
    .btn {
        transition: none
    }
}
.btn:hover {
    background-color: var(--so-green);
    border: 1px solid var(--so-green);
    color: var(--white);
}
.btn.disabled, .btn:disabled {
    pointer-events: none;
    opacity: .65
}
.quick-add.disabled{
    pointer-events: none;
    opacity: .65
}
.btn-so-green{
    background-color: var(--so-green);
    border: 1px solid var(--so-green);
    color: var(--white);
}
.btn-so-green:hover{
    background-color: var(--so-green-dark);
    border: 1px solid var(--so-green-dark);
    color: var(--white);
}
.btn-black-transparent{
    background-color: rgba(0,0,0,0.3);
    border: 1px solid rgba(0,0,0,0);
    color: var(--white);
}
.btn-black-transparent:hover{
    background-color: rgba(0,0,0,0.5);
    border: 1px solid rgba(0,0,0,0);
    color: var(--white);
}
.btn-light{
    background-color: #eee;
    border: 1px solid #eee;
    color: var(--gray);
}
.btn-light:hover{
    background-color: var(--so-green);
    border: 1px solid var(--so-green);
    color: var(--white);
}
.btn-outline {
    background-color: transparent;
    border: 1px solid #0a1821;
    color: #0a1821;
}
.btn-outline:hover {
    background-color: transparent;
    border: 1px solid var(--so-green);
    color: var(--so-green);
}
.btn-block{
    display: block;
}
button.btn-block{
    width: 100%;
}
.btn-sm{
    padding: 7px 12px;
    font-size: 14px;
}
.btn-lg{
    padding: 15px 20px;
    font-size: 20px;
    font-weight: 600;
}
.btn:focus{
    outline: 0;
}
.btn.btn-dropdown{
    background-color: #fff;
    border: 1px solid #fff;
    color: var(--dark-gray);
    display: inline-block;
    padding: 5px 10px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    border-radius: 4px;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: all 0.4s;
    margin-right: 15px;
}
.custom-dropdown-menu{
    border: none;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 5px 0 var(--shadow);
    box-shadow: 0 0 5px 0 var(--shadow);
}
.consent-float-button{
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 20px;
    text-align: center;
    color: #555;
    border-radius: 50%;
    background-color: #fff;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    transition: all .3s;
    cursor: pointer;
}
.consent-float-button:hover{
    color: #fff;
    background-color: var(--so-green);
}
.consentModalLogo{
    height: 40px;
}
.consent-text{
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #dee2e6;
}
.consent-granted{
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #dee2e6;
}
.consent-cb{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 15px;
    grid-template-rows: auto;
    grid-row-gap: 10px;
}
.consent-cb .form-switch label{
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
}
.consent-modal-footer{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-column-gap: 15px;
    grid-row-gap: 5px;
}
@media (max-width: 768px) {
    .consent-modal-footer{
        grid-template-columns: 1fr;
    }
    .consent-cb{
        grid-template-columns: 1fr;
    }
}

/* Collapses */
.collapse-item {
    border: 1px solid var(--white);
    border-radius: 8px;
    overflow: hidden;
    background-color: var(--white);
    margin-bottom: 15px;
}
.collapse-item:last-child{
    margin-bottom: 0;
}
.collapse-item .title{
    display: block;
    position: relative;
    padding: 15px 50px 15px 15px;
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-gray);
    transition: all 0.4s;
}
.collapse-item .title:after{
    content: "\e145";
    font-family: "Material Symbols Rounded";
    font-size: 24px;
    position: absolute;
    top: calc(50% - 15px);
    right: 10px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    transition: all 0.2s;
}
.collapse-item .title.open:after{
    transform: rotate(135deg);
}
.collapse-item .title.open{
    color: var(--so-green);
}
.collapse-item .content{
    padding: 15px 15px 15px 15px;
    border-top: 1px solid #eee;
}

.loader{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 999999;
}

.spinner {
    z-index: 999999999;
    position: absolute;
    top: calc(50% - 28px);
    left: calc(50% - 28px);
    width: 56px;
    height: 56px;
    display: none;
}
.spinner::before,
.spinner::after {
    content: '';
    width: 100%;
    height: 100%;
    animation: spinner-rfi6tk 1s infinite linear;
    box-sizing: border-box;
    border: 11.2px solid rgba(71,75,255,0.1);
    border-radius: 50%;
    position: absolute;
}
.spinner::before {
    animation-direction: reverse;
    border-right-color: #3fb149;
    right: calc(50% - 5.6px);
}
.spinner::after {
    border-left-color: #3fb149;
    left: calc(50% - 5.6px);
}
@keyframes spinner-rfi6tk {
    0% {
        transform: rotate(0deg);
    }

    50%, 100% {
        transform: rotate(360deg);
    }
}

/* Globals */
.or-divider{
    position: relative;
    width: 100%;
    height: 1px;
    background-color: #ddd;
    margin: 35px 0;
}
.or-divider:after{
    content: "ILI";
    font-weight: 700;
    position: absolute;
    top: -20px;
    left: calc(50% - 20.5px);
    width: 41px;
    height: 41px;
    line-height: 41px;
    text-align: center;
    color: var(--gray);
    background-color: var(--white);
    border-radius: 50%;
    border: 1px solid #ddd;
}
hr{ width: 100%; height: 1px; background-color: #f1f1f1; margin: 15px 0; border: none}
.border-bottom{border-bottom: 1px solid #ddd !important;}
.color-so-green{ color: var(--so-green) !important;}
.color-so-green-dark{ color: var(--so-green-dark) !important;}
.color-dark-gray{ color: var(--dark-gray) !important;}
.color-white{color: var(--white) !important;}
.color-blue{ color: #0a53be !important;}
.color-red{ color: var(--so-red) !important;}
.color-hover-so-green:hover{ color: var(--dark-gray) !important;}
.color-hover-so-green-dark:hover{ color: var(--so-green-dark) !important;}
.color-hover-dark-gray:hover{ color: var(--dark-gray) !important;}
.float-right{float: right;}
.float-left{float: left;}
.text-center{ text-align: center}
.text-right{ text-align: right}
.text-left{ text-align: left}
.text-justify{ text-align: justify}
iframe{ border-radius: 8px;}
.bg-light-gray{ background-color: #f1f1f1; }
.bg-white{ background-color: #ffffff; }
.bg-comments{ background-color: #fffcec; }
.bg-gradient-darkgreen-lightgreen{
    background: rgb(26,81,31);
    background: -moz-linear-gradient(top,  rgba(26,81,31,1) 0%, rgba(72,211,84,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(26,81,31,1) 0%,rgba(72,211,84,1) 100%);
    background: linear-gradient(to bottom,  rgba(26,81,31,1) 0%,rgba(72,211,84,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a511f', endColorstr='#48d354',GradientType=0 );
}
.bg-gradient-darkpurple-lightpurple {
    background: rgb(53, 7, 80);
    background: -moz-linear-gradient(top, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    background: linear-gradient(to bottom, rgba(53, 7, 80, 1) 0%, rgba(140, 17, 214, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#350750', endColorstr='#8c11d6', GradientType=0);
}

.fw200{ font-weight: 200 !important;}
.fw300{ font-weight: 300 !important;}
.fw400{ font-weight: 400 !important;}
.fw500{ font-weight: 600 !important;}
.fw600{ font-weight: 600 !important;}
.fw700{ font-weight: 700 !important;}
.fs10{ font-size: 10px !important;}
.fs11{ font-size: 11px !important;}
.fs12{ font-size: 12px !important;}
.fs13{ font-size: 13px !important;}
.fs14{ font-size: 14px !important;}
.fs15{ font-size: 15px !important;}
.fs16{ font-size: 16px !important;}
.fs17{ font-size: 17px !important;}
.fs18{ font-size: 18px !important;}
.fs19{ font-size: 19px !important;}
.fs20{ font-size: 20px !important;}
.fs21{ font-size: 21px !important;}
.fs22{ font-size: 22px !important;}
.fs23{ font-size: 23px !important;}
.fs24{ font-size: 24px !important;}
.fs25{ font-size: 25px !important;}
.fs26{ font-size: 26px !important;}
.fs27{ font-size: 27px !important;}
.fs28{ font-size: 28px !important;}
.fs29{ font-size: 29px !important;}
.fs30{ font-size: 30px !important;}
.fs40{ font-size: 40px !important;}
.fs50{ font-size: 50px !important;}
.fs60{ font-size: 60px !important;}
.pn {padding: 0 !important;}
.p1 {padding: 1px !important;}
.p2 {padding: 2px !important;}
.p3 {padding: 3px !important;}
.p4 {padding: 4px !important;}
.p5 {padding: 5px !important;}
.p6 {padding: 6px !important;}
.p7 {padding: 7px !important;}
.p8 {padding: 8px !important;}
.p10 {padding: 10px !important;}
.p12 {padding: 12px !important;}
.p15 {padding: 15px !important;}
.p20 {padding: 20px !important;}
.p25 {padding: 25px !important;}
.p30 {padding: 30px !important;}
.p35 {padding: 35px !important;}
.p40 {padding: 40px !important;}
.p50 {padding: 50px !important;}
.ptn {padding-top: 0 !important;}
.pt5 {padding-top: 5px !important;}
.pt7 {padding-top: 7px !important;}
.pt10 {padding-top: 10px !important;}
.pt15 {padding-top: 15px !important;}
.pt20 {padding-top: 20px !important;}
.pt25 {padding-top: 25px !important;}
.pt30 {padding-top: 30px !important;}
.pt35 {padding-top: 35px !important;}
.pt40 {padding-top: 40px !important;}
.pt50 {padding-top: 50px !important;}
.prn {padding-right: 0 !important;}
.pr5 {padding-right: 5px !important;}
.pr10 {padding-right: 10px !important;}
.pr15 {padding-right: 15px !important;}
.pr20 {padding-right: 20px !important;}
.pr25 {padding-right: 25px !important;}
.pr30 {padding-right: 30px !important;}
.pr35 {padding-right: 35px !important;}
.pr40 {padding-right: 40px !important;}
.pr50 {padding-right: 50px !important;}
.pbn {padding-bottom: 0 !important;}
.pb5 {padding-bottom: 5px !important;}
.pb7 {padding-bottom: 7px !important;}
.pb10 {padding-bottom: 10px !important;}
.pb15 {padding-bottom: 15px !important;}
.pb20 {padding-bottom: 20px !important;}
.pb25 {padding-bottom: 25px !important;}
.pb30 {padding-bottom: 30px !important;}
.pb35 {padding-bottom: 35px !important;}
.pb40 {padding-bottom: 40px !important;}
.pb50 {padding-bottom: 50px !important;}
.pb60 {padding-bottom: 60px !important;}
.pb70 {padding-bottom: 70px !important;}
.pb80 {padding-bottom: 80px !important;}
.pb90 {padding-bottom: 90px !important;}
.pb100 {padding-bottom: 100px !important;}
.pln {padding-left: 0 !important;}
.pl5 {padding-left: 5px !important;}
.pl10 {padding-left: 10px !important;}
.pl15 {padding-left: 15px !important;}
.pl20 {padding-left: 20px !important;}
.pl25 {padding-left: 25px !important;}
.pl30 {padding-left: 30px !important;}
.pl35 {padding-left: 35px !important;}
.pl40 {padding-left: 40px !important;}
.pl50 {padding-left: 50px !important;}
.mn { margin: 0 !important; }
.mbn { margin-bottom: 0 !important; }
.mb5 {margin-bottom: 5px !important;}
.mb7 {margin-bottom: 7px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb25 {margin-bottom: 25px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb35 {margin-bottom: 35px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px !important;}
.mb60 {margin-bottom: 60px !important;}
.mb70 {margin-bottom: 70px !important;}
.mb80 {margin-bottom: 80px !important;}
.mb90 {margin-bottom: 90px !important;}
.mb100 {margin-bottom: 100px !important;}
.mtn { margin-top: 0 !important; }
.mt5 {margin-top: 5px !important;}
.mt7 {margin-top: 7px !important;}
.mt10 {margin-top: 10px !important;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt25 {margin-top: 25px !important;}
.mt30 {margin-top: 30px !important;}
.mt35 {margin-top: 35px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}
.mt60 {margin-top: 60px !important;}
.mt70 {margin-top: 70px !important;}
.mt80 {margin-top: 80px !important;}
.mt90 {margin-top: 90px !important;}
.mt100 {margin-top: 100px !important;}
@media (max-width: 992px) {
    .mobile-hide{display: none !important;}
}
.eur{
    font-size: 12px;
}

.patr{
    position: absolute;
    top: 15px;
    right: 15px;
}
.btn-bg{
    color: #ffc800;
    z-index: 999999;
}
#newStoreModal{
    z-index: 9999999;
}
#newStoreModal .modal-content{
    background-color: transparent;
}
.ns-banner{
    position: relative;
    width: 100%;
    background-color: transparent;


}
.ns-banner-bg{
    border-radius: 50%;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../images/banner-bg.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 600px 600px;
    animation: bgRotation 20s linear infinite;
    z-index: 1;
}
.ns-img{
    position: relative;
    z-index: 33;
}

@keyframes bgRotation {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(359deg);
    }
}

.poor-products .price-input{
    width: 70px;
    display: inline-block;
    padding: 5px;
    font-size: 16px;
    font-weight: 600;
    outline: none !important;
    border-radius: 4px;
    border: transparent;
    -webkit-box-shadow: 0 0 5px 0 var(--shadow);
    box-shadow: 0 0 5px 0 var(--shadow);
}
.poor-products .price-input.changed{
    /*border: 1px solid red;*/
    background-color: red;
    color: #fff;
}
.poor-products .price-input.changed:focus{
    outline: none !important;
    /*border: 1px solid red;*/
    background-color: red;
    color: #fff;
}
.poor-products .poor-save{
    display: inline-block;
    cursor: pointer;
    padding: 7px 10px;
    background-color: #3fb149;
    color: #fff;
    border-radius: 4px;
    font-weight: 600;
}
.poor-products .poor-save:hover{
    background-color: #2b7a31;
}
.poor-products .poor-skip{
    display: inline-block;
    cursor: pointer;
    padding: 7px 10px;
    background-color: #1d9bf0;
    color: #fff;
    border-radius: 4px;
    font-weight: 600;
}
.poor-products .poor-skip:hover{
    background-color: #17679b;
}
.poor-products .poor-image{
    border-radius: 6px;
}
.poor-products .poor-stock{
    cursor: pointer;
}
.btn-green-gradient{
    background-size: 400% 400%;
    animation: animbtn 8s infinite ease-in-out;
    background-image: linear-gradient(
            45deg,
            hsl(125deg 46% 55%) 0%,
            hsl(125deg 41% 41%) 50%,
            hsl(125deg 48% 28%) 100%
    );
    border-color: transparent;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
@keyframes animbtn {
    0% { background-position: 0 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}
.packaging-products .print{
    display: inline-block;
    cursor: pointer;
    padding: 7px 10px;
    background-color: #3fb149;
    color: #fff;
    border-radius: 4px;
    font-weight: 600;
}
.packaging-products ol{
    margin:0;
    padding: 0 0 0 13px;
}
.packaging-products ol{
    margin:0;
    padding: 0 0 0 13px;
}
.packaging-products td hr{
    width: 100%;
    display: block;
    height: 1px;
    background-color: #acb0b4;
    margin: 5px 0;
}
.packaging-products td hr:last-child{
    display: none;
}
.packaging-products .for-print{
    display: none;
}

.packaging-orders-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.packaging-orders-title{
    display: flex;
    align-items: center;
}
.packaging-orders-title h3{
    margin: 0;
}
.packaging-orders-title img{
    width: 50px;
    margin-left: 10px;
    cursor: pointer;
}

@media (max-width: 768px) {
    .packaging-orders-header{
        display: flex;
        flex-direction: column;
        justify-content: unset;
        align-items: unset;
    }
    .packaging-orders-header .action-buttons{
        margin-top: 10px;
    }
}
.map-pop-image{
    width: 300px;
    margin-bottom: 5px;
}
.map-pop-image img{
    width: 100%;
    border-radius: 8px;
}
.map-pop-title{
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
}
.map-pop-address{
    font-family: 'Titillium Web', sans-serif;
    font-size: 13px;
    font-weight: 600;
}
.map-pop-btn{
    margin-top: 10px;
}
.map-pop-btn .paketomatBtn{
    display: block;
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    background-color: #061ab1;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}
.map-pop-btn .paketomatBtn:hover{
    display: block;
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    background-color: #3148e7;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}

.map-pop-btn .paketomatBoxNowBtn{
    display: block;
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    background-color: #35d32f;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}
.map-pop-btn .paketomatBoxNowBtn:hover{
    display: block;
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    background-color: #29a224;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}

.map-pop-btn .paketomatOverseasBtn{
    display: block;
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    background-color: #ee7f01;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}
.map-pop-btn .paketomatOverseasBtn:hover{
    display: block;
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    background-color: #a85900;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}

/*.map-pop-btn .paketomatBtn{
    display: block;
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    background-color: #2ea08c;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    text-align: center;
}
.selectPaketomatBtn{
    background-color: #FFD700;
    color: #1e4922;
    padding: 15px;
    display: block;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    border-radius: 8px;
}
.selectPaketomatBtn:hover{
    background-color: #ffe270;
    color: #1e4922;
}*/

.selectPaketomatBtn{
    background-color: #061ab1;
    color: #fff;
    padding: 15px;
    display: block;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    border-radius: 8px;
}
.selectPaketomatBtn:hover{
    background-color: #3148e7;
    color: #fff;
}

.selectPaketomatBtn.paketomatSelected{
    background-color: #fff7cc;
    color:#000;
    padding: 15px;
    display: block;
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    border-radius: 8px;
    border: 2px dashed #999;
}
.selectPaketomatBtn.paketomatSelected:hover{
    background-color: #ffeb8f;
    color:#000;
}

.selectPaketomatBtn.paketomatSelected .title-lable{
    font-size: 13px;
    font-weight: 500;
}
.selectPaketomatBtn.paketomatSelected .title{
    font-size: 16px;
    font-weight: 600;
}
.selectPaketomatBtn.paketomatSelected .address{
    font-size: 14px;
    font-weight: 500;
}
/*********************************/
.selectBoxNowPaketomatBtn{
    background-color: #35d32f;
    color: #fff;
    padding: 15px;
    display: block;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    border-radius: 8px;
}
.selectBoxNowPaketomatBtn:hover{
    background-color: #2cb426;
    color: #fff;
}

.selectBoxNowPaketomatBtn.paketomatSelected{
    background-color: #fff7cc;
    color:#000;
    padding: 15px;
    display: block;
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    border-radius: 8px;
    border: 2px dashed #999;
}
.selectBoxNowPaketomatBtn.paketomatSelected:hover{
    background-color: #ffeb8f;
    color:#000;
}

.selectBoxNowPaketomatBtn.paketomatSelected .title-lable{
    font-size: 13px;
    font-weight: 500;
}
.selectBoxNowPaketomatBtn.paketomatSelected .title{
    font-size: 16px;
    font-weight: 600;
}
.selectBoxNowPaketomatBtn.paketomatSelected .address{
    font-size: 14px;
    font-weight: 500;
}
/*********************************/
.selectOverseasPaketomatBtn{
    background-color: #ee7f01;
    color: #fff;
    padding: 15px;
    display: block;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    border-radius: 8px;
}
.selectOverseasPaketomatBtn:hover{
    background-color: #a85900;
    color: #fff;
}

.selectOverseasPaketomatBtn.paketomatSelected{
    background-color: #fff7cc;
    color:#000;
    padding: 15px;
    display: block;
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    border-radius: 8px;
    border: 2px dashed #999;
}
.selectOverseasPaketomatBtn.paketomatSelected:hover{
    background-color: #ffeb8f;
    color:#000;
}

.selectOverseasPaketomatBtn.paketomatSelected .title-lable{
    font-size: 13px;
    font-weight: 500;
}
.selectOverseasPaketomatBtn.paketomatSelected .title{
    font-size: 16px;
    font-weight: 600;
}
.selectOverseasPaketomatBtn.paketomatSelected .address{
    font-size: 14px;
    font-weight: 500;
}
/********************************/
.topProductsBody{
    background-color: #f5f5f5;
}
.post {
    background: #fff;
    padding: 25px;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    margin-bottom: 30px;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.post-date {
    font-size: 12px;
    font-weight: 600;
}
.post-title {
    font-size: 2.5em;
    font-weight: 200;
    margin: 5px 0 15px;
}
.post-intro{
    font-size: 18px;
    font-weight: 600;
    margin: 5px 0 15px;
}
.post-image{
    width: 100%;
    margin-bottom: 15px;
}
.post-image img{
    width: 100%;
    border-radius: 8px;
}
.post-gallery{
    overflow: hidden;
    padding: 3px;
    border-radius: 8px;
    margin-bottom: 15px !important;
    box-shadow: inset 0px 0px 0px 3px rgba(0,0,0,0.05);
}
.post-gallery .slick-list{
    overflow: hidden;
    border-radius: 8px;
}
.post-gallery .post-gallery-item img{
    z-index: 1;
    transition: all .3s;
    opacity: 0.95;
    filter: grayscale(15%);
}
.post-gallery .post-gallery-item img:hover{
    transform: scale(1.1);
    filter: grayscale(0%);
    opacity: 1;
    z-index: 2;
}
.post-body{
    font-size: 16px;
}

@media (max-width: 768px) {
    .post {
        padding: 15px;
    }
    .post-title {
        font-size: 22px;
        font-weight: 600;
        margin: 15px 0;
    }
}
@media (max-width: 575px) {
    .mobile-pn{
        padding: 0;
    }
    .post {
        padding: 15px;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}
.blog-slider .slick-list .slick-track{
    padding-bottom: 10px;
}
.blog-item{
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background-color: var(--white);
    transition: all 0.4s;
    -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.2);
}
.blog-item .info{
    margin-bottom: 0;
    border-radius: 0;
}
.blog-item .info .title{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 5px;
    color: var(--dark-gray);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.blog-item .info .intro{
    font-size: 15px;
    font-weight: 500;
    color: var(--dark-gray);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.blog-item .image img{
    z-index: 1;
    transition: all .3s;
    opacity: 0.95;
    filter: grayscale(15%);
}
.blog-item:hover{
    -webkit-box-shadow: none;
    box-shadow: none;
}
.blog-item:hover .image img{
    transform: scale(1.05);
    opacity: 1;
}
.blog-item:hover .info .title{
    color: var(--so-green);
}
::-webkit-scrollbar {
    width: 7px;
}
::-webkit-scrollbar-track {
    background: #fff;
}
::-webkit-scrollbar-thumb {
    background: #3fb149;
    border-radius: 4px;
}
.badEmail{
    border-color: #e02d2d !important;
}
.error-email-block{
    color: #e02d2d !important;
    font-size: 11px;
    font-weight: 700;
}


.clockdiv{
    position: absolute;
    top: calc(50% - 40px);
    color: #fff;
    font-weight: 700;
    text-align: center;
    font-size: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    background: rgba(255, 0, 0, 0.78);
}

.clockdiv > div{
    border-radius: 6px;
    color: #fff;
    margin: 0 10px;
}

.clockdiv div > span{
    padding: 0px;
    font-size: 30px;
    border-radius: 3px;
    display: block;
    align-items: center;
    justify-content: center;
    width: 40px;
    line-height: 1.2;
}

.smalltext {
    margin-top: 10px;
    font-size: 13px;
    font-weight: 400;
}

.module-time-discount{
    position: relative;
    background-color: rgba(151, 7, 7, 0.9);
    margin-top: 20px;
    background: linear-gradient(315deg, rgba(31,133,18,1) 0%, rgba(0,212,255,1) 38%, rgb(5, 111, 186) 73%, rgba(31,133,18,1) 100%);
    animation: gradient 60s ease infinite;
    background-size: 300% 300%;
    background-attachment: fixed;
    box-shadow: inset 0px 0px 20px 0px rgba(0, 0, 0, 0.8);
    overflow: hidden;
}
.module-time-discount .container{
    position: relative;
    z-index: 10 !important;
}
.module-time-discount canvas{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
}

.module-time-discount.black-friday{
    position: relative;
    background-color: rgba(151, 7, 7, 0.9);
    margin-top: 20px;
    background: linear-gradient(315deg, rgb(0, 0, 0) 0%, rgb(9, 71, 3) 50%, rgb(0, 0, 0) 100%);
    animation: gradient 60s ease infinite;
    background-size: 300% 300%;
    background-attachment: fixed;
    box-shadow: inset 0px 0px 20px 0px rgba(0, 0, 0, 0.8);
    overflow: hidden;
}
.black-friday-btn{
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    color: #a900ff;
    background-color: #000;
    padding: 10px 20px;
    border-radius: 8px;
    border: 1px dashed #555;
}
.black-friday-btn:hover{
    color:#000;
    background-color: #a900ff;
}
.black-friday-font{
    color: #00c526 !important;
    text-shadow: 0 0 15px #a900ff !important;
    font-family: "Lexend", sans-serif !important;
    font-weight: 800 !important;
}

.module-time-discount.bozic-mjesec{
    position: relative;
    background-color: rgba(151, 7, 7, 0.9);
    margin-top: 20px;
    background: linear-gradient(315deg, rgb(151, 7, 7) 0%, rgb(124, 6, 6) 50%, rgb(151, 7, 7) 100%);
    animation: gradient 60s ease infinite;
    background-size: 300% 300%;
    background-attachment: fixed;
    box-shadow: inset 0px 0px 20px 0px rgba(0, 0, 0, 0.8);
    overflow: hidden;
}
.bozic-mjesec-btn{
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    background-color: #199e00;
    padding: 10px 20px;
    border-radius: 8px;
    border: 1px dashed #ffffff;
}
.bozic-mjesec-btn:hover{
    color:#fff;
    background-color: #0f6500;
}
.bozic-mjesec-font{
    color: #ffffff !important;
    text-shadow: 0 0 15px #fd0000 !important;
    font-family: "Corinthia", sans-serif !important;
    font-size: 100px !important;
    font-weight: 400 !important;
    text-transform: unset;
}

@media (max-width: 769px) {
    .bozic-mjesec-font{
        font-size: 60px !important;
    }
}
@media (max-width: 540px) {
    .bozic-mjesec-font{
        font-size: 50px !important;
    }
}

@keyframes gradient {
    0% {
        background-position: 0% 0%;
    }
    50% {
        background-position: 100% 100%;
    }
    100% {
        background-position: 0% 0%;
    }
}

.module-time-discount .module-title{
    color: #f3f3f3;
    font-weight: 600;
    text-shadow: 1px 1px 5px #191919;
}
.countdown-label{
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #f3f3f3;
    text-shadow: 1px 1px 5px #191919;
}
.product-time-discount{
    padding-top: 15px;
    margin-top: 15px;
    border-top: 1px solid #f5f5f5;
}
.product-countdown-title{
    font-size: 16px;
    font-weight: 700;
    color: #f03545;
}
.modal-content.delivery-notice-modal{
    border: 2px solid #555;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
}
.modal-content.delivery-notice-modal.blue{
    border: 2px solid #2291ec;
}
.modal-content.delivery-notice-modal.red{
    border: 2px solid #f03545;
}
.modal-content.delivery-notice-modal.green{
    border: 2px solid #3fb149;
}
.header-notice{
    background-color: #3fb149;
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 16px;
}
.header-notice2{
    background-color: #061ab1;
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 16px;
}
.new-products-list{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    gap: 15px;
}
.new-products-list .new-product-item{
    display: grid;
    grid-template-columns: 100px 1fr 139px;
    grid-template-rows: auto;
    gap: 20px;
    padding: 10px;
    background-color: #fff;
    border-radius: 8px;
}
.new-products-list .new-product-item .title{
    font-size: 16px;
    font-weight: 600;
}
.new-products-list .new-product-item .price-link .price{
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
}
@media (max-width: 991px) {
    .new-products-list{
        grid-template-columns: 1fr;
    }
}
@media (max-width: 769px) {
    .new-products-list .new-product-item{
        grid-template-columns: 1fr;
    }
    .new-products-list .new-product-item .price-link .price{
        font-size: 28px;
        font-weight: 700;
    }
}
.hide-checkout-buttons{
    display: none;
}
