:root {
    --color-01-hex:#253a7d;
    --color-02-hex:#a0c41a;
    --color-03-hex:#e61717;
    --color-04-hex:#e6f5c8;
    --color-05-hex:#ffe6a5;
    --color-01-rgb:37 58 125;
    --color-02-rgb:160 196 26;
    --color-03-rgb:230 23 23;
    --color-04-rgb:230 245 200;
    --color-05-rgb:255 230 165;

    --color-error-hex:#f00;

    --color-error-rgb:255 0 0;
}

* {
    box-sizing: border-box;
    outline:none;
    font-family:Roboto, sans-serif
}


body {margin:0; padding:0; background-color:#dcdcdc; font-family:Roboto, sans-serif}
body.scroll-locked {overflow:hidden}

button {border: none;}

img {border:0 none}
p, ul, li {margin:0; padding:0}
h1, h2, h3 {margin:0; padding:0; font-weight:normal; font-family:Roboto, sans-serif}
strong, b {font-family:Roboto, sans-serif; font-weight:700}

.preloader-circle {border-radius:100%; animation:preloader-circle-rotate 0.5s infinite linear}
@keyframes preloader-circle-rotate {
    0% {transform:rotate(0deg)}
    100% {transform:rotate(360deg)}
}


.hover-default:hover {filter:brightness(0.95); transition:filter 100ms ease}
.hover-button-gray:hover {filter:brightness(1.25)}

.swiper-container {position:relative; overflow:hidden; list-style:none}

.swiper-button-prev.swiper-button-disabled {opacity:.12 !important; pointer-events:initial !important}
.swiper-button-next.swiper-button-disabled {opacity:.12 !important; pointer-events:initial !important}
.swiper-button-lock {display:flex !important}

.swiper-button-prev.default {left:0; z-index:1; width:40px; height:40px; background-color:#000; color:#fff; outline:none; border-radius:100%}
.swiper-button-prev.default::after {font-size:18px; font-weight:700}
.swiper-button-next.default {right:0; z-index:1; width:40px; height:40px; background-color:#000; color:#fff; outline:none; border-radius:100%}
.swiper-button-next.default::after {font-size:18px; font-weight:700}

.swiper-button-prev.rectangle {top:calc(50% - 30px); left:0; z-index:1; width:30px; height:60px; margin:0; background-color:#000; color:#fff; outline:none}
.swiper-button-prev.rectangle::after {font-size:16px; font-weight:700}
.swiper-button-next.rectangle {top:calc(50% - 30px); right:0; z-index:1; width:30px; height:60px; margin:0; background-color:#000; color:#fff; outline:none}
.swiper-button-next.rectangle::after {font-size:16px; font-weight:700}

.swiper-lazy-preloader.default {border:4px solid var(--color-01-hex); border-top-color:transparent; border-right-color:transparent; animation:swiper-preloader-spin 0.5s infinite linear}


.clear {clear:both}

.tooltip {font-size:12px; box-shadow:0 0 3px rgba(0,0,0,0.1); padding:12px 20px; background:var(--color-05-hex); border-radius:0; border:1px rgba(0 0 0 / 5%) solid !important; opacity:1}



a.side-banner {position:absolute; background-repeat:no-repeat; display:block}
a.side-banner.left {margin-left:-30px}
a.side-banner.right {margin-right:-30px}

.message-box {font-size:16px; font-family:Roboto, sans-serif; font-weight:700; line-height:28px}
.message-box .messageStackError {background-color:var(--color-error-hex); color:#fff}
.message-box tr.messageBox td {padding:5px 50px}
.message-box tr.messageBox:first-child td {padding:30px 50px 5px 50px}
.message-box tr.messageBox:last-child td {padding:5px 50px 30px 50px}
.message-box tr.messageBox:only-child td {padding:30px 50px}
.message-box .messageStackWarning {padding:40px 50px; background-color:#fffbf0; color:#000}
.message-box .messageStackSuccess {padding:40px 50px; background-color:#19bb43; color:#fff}
.message-box-contact-form {margin:-40px -160px 40px -160px}





.content {position:relative}
.center {position:relative; max-width:1600px; margin:0 auto; background-color:#f6f6f6}
.content-white {background-color:#fff}
.center-content {max-width:1280px; margin:0 auto}
.bottom-line {border-bottom:1px #eee solid}
.content-white-break-20 {background-color:#fff; height:20px}

.text-content {padding:50px 0; font-size:15px}
.text-content h1 {font-size:30px; font-family:Roboto, sans-serif; font-weight:700; padding-bottom:30px}
.text-content h2 {font-size:24px; padding:30px 0 15px 0}
.text-content h3 {font-size:18px; padding:15px 0}
.text-content .wide-image {margin-bottom:25px; max-width:100%}
.text-content p {margin-bottom:25px}
.text-content a {color:var(--color-01-hex)}
.text-content a:hover {text-decoration:none}
.text-content ul {margin:10px 10px 30px 10px}
.text-content li {margin-left:20px}
.text-content img.max {max-width:100%}

.text-content table {border:1px #e9e9e9 solid}
.text-content table tr {}
.text-content table td {border:1px #e9e9e9 solid; padding:10px}
.text-content table p {margin:0; padding:0}

.info-page {}
.info-page li {line-height:1.6}
.info-page p {line-height:1.5}

.article-bottom {display:flex; flex-wrap:wrap; padding:30px 0 0 0}
.article-bottom .left {flex:1 0 auto; padding:40px 50px 0 0}
.article-bottom .left a {color:var(--color-01-hex)}
.article-bottom .left span {display:inline-block; vertical-align:middle; margin-right:10px; width:0; height:0; border-right: 4px solid var(--color-01-hex); border-bottom:4px solid transparent; border-top:4px solid transparent}
.article-bottom .right {padding:40px 0 0 0}

.button-more {border:2px #e2e2e2 solid; color:var(--color-01-hex); font-size:17px; font-family:Roboto, sans-serif; font-weight:700; padding:19px 38px}
.button-more:hover {background-color:#f9f9f9}

.marketing-content-top {background-color:#f6f6f6; border-bottom:1px #ccc dotted}
.marketing-content-top .actions {display:flex; justify-content:space-between; align-items:center; max-width:1600px; margin:0 auto}
.marketing-content-top .actions a {text-decoration:none}








.path.swiper-container {height:62px; padding:0 50px}
.path.swiper-container .swiper-wrapper {}
.path.swiper-container .swiper-wrapper .swiper-slide {display:flex; align-items:center; width:auto}
.path.swiper-container .swiper-wrapper .swiper-slide a {color:var(--color-01-hex); font-size:14px; white-space:nowrap}
.path.swiper-container .swiper-wrapper .swiper-slide a:hover {text-decoration:none}
.path.swiper-container .swiper-wrapper .swiper-slide .arrow {width:0; height:0; margin:0 20px; border-left:4px solid #474747; border-bottom:4px solid transparent; border-top:4px solid transparent}
.path.swiper-container .swiper-wrapper .swiper-slide.home a.icon {text-decoration:none}
.path.swiper-container .swiper-wrapper .swiper-slide.home a.icon img {display:block}
.path.swiper-container .swiper-wrapper .swiper-slide.home a.tc {text-decoration:none}
.path.swiper-container .swiper-wrapper .swiper-slide.last {padding-right:20px}
.path.swiper-container .swiper-wrapper .swiper-slide.last a {color:var(--color-02-hex); text-decoration:none}
.path.swiper-container .swiper-wrapper .swiper-slide.last a:hover {text-decoration:underline}
.path.swiper-container.fixed {position:fixed; top:0; right:0; left:0; z-index:9998; max-width:1500px; margin:0 auto; background-color:#f6f6f6; box-shadow:0 1px 4px #dcdcdc}

.path-scroll-substitute {height:0}
.path-scroll-substitute.visible {height:62px}




.banners-category {}
.banners-category.nested {}
.banners-category a.banners {display:block; background-color:#fff; padding:15px 0 0 0}
.banners-category.nested a.banners:last-child {padding:15px 0 20px 0}
.banners-category a.banners img {margin:0 auto}
.banners-category a.banners img.desktop {display:block; max-width:1280px}
.banners-category a.banners img.mobile {display:none; max-width:calc(100% - 40px)}




.socials {display:flex}
.socials .fb {width:28px; height:28px; margin:0 15px 0 0; background-image:url(/templates/b2c/images/social-fb.png)}
.socials .fb-messenger {width:28px; height:28px; margin:0 15px 0 0; background-image:url(/templates/b2c/images/social-messenger.png)}
.socials .whatsapp {width:28px; height:28px; background-image:url(/templates/b2c/images/social-whatsapp.png)}



#top-compare-cart {
    position:fixed; right:0; bottom:0; left:0; background-color:#666; text-align:center; box-shadow:0 -1px 5px rgba(0,0,0,0.2); z-index:3;
    justify-content:center;display: flex;gap: 40px;
    align-items: center;
}
#top-compare-cart a.compare-products,
#top-compare-cart a.wishlist
{display:inline-block; text-decoration:none; color:#fff; margin:14px 0; padding:0 0 0 40px}

#top-compare-cart a.compare-products:hover,
#top-compare-cart a.wishlist:hover
{text-decoration:underline}

#top-compare-cart a.wishlist
{background:url(/templates/b2c/images/product-favorites.png) 0 center no-repeat;}


#top-compare-cart a.compare-products
{background:url(/templates/b2c/images/compare-icon-white.png) 0 center no-repeat;}


#top-compare-cart .count {display:inline-block; color:var(--color-01-hex); font-family:Roboto, sans-serif; font-weight:700; background-color:#fff; margin-left:10px; width:26px; height:26px; line-height:28px; font-size:15px; text-align:center; border-radius:50%}

@media only screen and (max-width:600px) {
    #top-compare-cart a.compare-products,
    #top-compare-cart a.wishlist
    {margin-left:20px}
}


.center-dark {background-color:#d0d0d0; padding-top:35px}




.telephone-box {position:relative}
.telephone-box input[name=telephone] {padding:10px 18px 10px 40px !important}




.text-simple {padding:80px 0; border-top:1px #f6f6f6 solid; text-align:center; line-height:28px; font-size:15px}
.text-simple a {color:var(--color-01-hex)}


.form-content {padding:40px 0 0 0; border:0 none}

.seo-texts {color:#333; font-size:14px; padding:40px 0;padding-left: 40px;padding-right: 40px; border-bottom:1px #ccc dotted; text-align:justify}
.seo-texts h2 {padding:0 0 10px 0; color:#333; font-family:Roboto, sans-serif}
.seo-texts p {padding:6px 0 0 0; line-height:1.5}
.seo-texts a {color:var(--color-01-hex)}
.seo-texts a:hover {text-decoration:none}

.missing-content {padding:0 0 80px 0}
.missing-content h1 {padding:40px 0}
.missing-content .mark {float:left; width:150px; text-align:right; margin:40px 80px 0 0; font-size:130px; color:#ccc; font-family:Roboto, sans-serif; font-weight:700}
.missing-content .text {float:left}

.black-friday-content {}
.black-friday-content a {text-decoration:none}
.black-friday-content img {max-width:100%}
.black-friday-content .full {display:block}



.gray-line {height:1px; background-color:#f6f6f6}




table.article {width:100%; border-collapse:collapse; text-align:center}
table.article tr:first-child {background-color:#fafafa; color:#424242; font-weight:bold}
table.article tr td:first-child {text-align:left; width:25%}
table.article td {border:1px #e9e9e9 solid; padding:20px; font-size:11px}



.spinner {
    margin: 100px auto 0;
    width: 70px;
    text-align: center;
}

.spinner > div {
    width: 18px;
    height: 18px;
    background-color: #333;

    border-radius: 100%;
    display: inline-block;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
    animation-delay: -0.32s;
}

.spinner .bounce2 {
    animation-delay: -0.16s;
}


@keyframes sk-bouncedelay {
    0%, 80%, 100% {
        transform: scale(0);
    } 40% {
          transform: scale(1.0);
      }
}

#password_entered {}
#password_entered a {color:#999}


.shoproku-icon {position:fixed; top:380px; left:0; z-index:1}

.customer-sso-buttons {display:flex; flex-wrap:wrap}
.customer-sso-buttons a.button {display:flex; align-items:center; margin:8px 8px 0 0; padding:10px 17px; background-color:#fff; border:1px #d6d6d6 solid; border-radius:3px; color:#000; text-decoration:none}
.customer-sso-buttons a.button img {width:32px; height:32px}
.customer-sso-buttons a.button .label {padding:0 0 0 10px; font-size:14px; line-height:1.2}
.customer-sso-buttons a.button:hover {text-decoration:underline}

.layout-bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999990;
}

.layout-top {
    z-index: 999999;
}

