html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    scroll-behavior: smooth;
    font-size: 16px;
}

*,
*:before,
*:after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

body {
    font-family: "Lato";
    font-size: 0.9rem;
    line-height: 1;
}

nav * {
    outline: none;
}

a,
a:hover {
    color: inherit;
}

a:not([href]):hover {
    cursor: pointer;
    text-decoration: underline;
}

.pointer:hover {
    cursor:pointer;
}

.custom-control-label {
    cursor: pointer;
}

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important;
}

img {
    -ms-interpolation-mode: bicubic;
    image-rendering: auto;
    image-rendering: optimizeQuality;
}


/* Autofill tweak */

input,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
::placeholder,
textarea,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active,
select,
option,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
select:-webkit-autofill:active,
:-webkit-autofill,
:-moz-autofill,
:-moz-autofill-preview {
    -webkit-filter: none;
    filter: none;
    background: white;
    background-clip: content-box;
    border-image: none;
    box-shadow: 0 0 0 30px white inset;
    -webkit-transition: color 9999s ease-out, background-color 9999s ease-out;
    -moz-transition: color 9999s ease-out, background-color 9999s ease-out;
    transition: color 9999s ease-out, background-color 9999s ease-out;
    -webkit-transition-delay: 9999s;
    transition-delay: 9999s;
    -webkit-text-fill-color: #2a2a2a;
    color: #2a2a2a;
}

.text-redshop4u {
    color: #C81C5E!important;
}

.text-grey {
    color: #8E8E8E;
}

.line-height-1c1 {
    line-height: 1.1;
}

.line-height-1c2 {
    line-height: 1.2;
}

.line-height-1c4 {
    line-height: 1.4;
}

.text-redshop4u path {
    fill: #C81C5E;
}

.svg-redshop4u {
    -webkit-filter: invert(15%) sepia(97%) saturate(4364%) hue-rotate(329deg) brightness(84%) contrast(85%);
    filter: invert(15%) sepia(97%) saturate(4364%) hue-rotate(329deg) brightness(84%) contrast(85%);
}

.text-redshop4u-hover:hover {
    color: #C81C5E!important;
}

.text-redshop4u-white-hover {
    color: white!important;
}

.text-redshop4u-white-hover:hover {
    color: #C81C5E!important;
}

.text-redshop4u {
    color: #C81C5E;
}

.text-redshop4u-errormsg {
    color: #ff2378;
}

.svg-redshop4u-white-hover {
    fill: #fff;
}

.nav-item:hover .svg-redshop4u-white-hover,
.svg-redshop4u-white-hover:hover {
    fill: #C81C5E;
}

.nav-item:hover .svg-redshop4u-white-hover,
.svg-redshop4u-white-hover:hover {
    fill: #C81C5E;
}

.bg-redshop4u {
    background-color: #C81C5E;
}

.btn-redshop4u {
    color: white!important;
    background-color: #C81C5E!important;
}

.nav-item:hover .btn-redshop4u {
    color: white !important;
}

.btn-black{
    background-color: black !important;
    color: white !important;
}

.text-transform-none {
    text-transform: none !important;
}

.ohnohoney{
    display: none !important;
}

.marquee {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    width: 100%;
    margin: 0 auto;
    min-width: 100vw;
    background-color: red;
    color: white;
    white-space: nowrap;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.marquee span,
.marquee div {
    display: inline-block;
    min-width: 100vw;
    line-height: 1.1;
    text-align: right;
    -moz-transition-animation: marquee linear infinite;
    -webkit-transition-animation: marquee linear infinite;
    -o-transition-animation: marquee linear infinite;
    -ms-transition-animation: marquee linear infinite;
    -webkit-animation: marquee linear infinite;
    animation: marquee linear infinite;
}

.marquee:hover span,
.marquee:hover div {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}

@keyframes marquee {
    0% {
        /* Firefox bug fix */
        -webkit-transform: translate(0, 0);
        /* Firefox bug fix */
        transform: translate(0, 0);
    }
    100% {
        /* Firefox bug fix */
        -webkit-transform: translate(-100%, 0);
        /* Firefox bug fix */
        transform: translate(-100%, 0);
    }
}

@-webkit-keyframes marquee {
    0% {
        -webkit-transform: translate(0, 0);
    }
    100% {
        -webkit-transform: translate(-100%, 0);
    }
}

header {
    height: 45px;
    background: black;
    border-bottom: 1px solid white;
}


/* Remove default arrows on input type="number" */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.raleway {
    font-family: "Raleway", "Helvetica", "Arial", sans-serif;
}

.btn:focus,
.btn:active {
    outline: none !important;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}

.logo {
    float: left;
    height: 45%;
    width: 16%;
    max-width: 200px;
    margin-left: 10px;
    margin-top: 0px;
    padding: 20px 10px;
}

.fa-user-circle,
.fa-heart,
.fa-shopping-cart {
    color: #fff;
    font-size: 1.7rem;
    cursor: pointer;
}

#mainCarousel .carousel-section {
    height: 80vh;
}

@media screen and (max-width: 992px) and (min-width: 576px) {
    .proshop-title-carrousel {
        font-size: 2.5rem !important;
    }
    .title-carrousel {
        font-size: 1.7rem !important;
    }
    .subtitle-carrousel {
        font-size: 1rem !important;
    }
    .description-carrousel {
        font-size: 0.9rem !important;
    }
}

h1 {
    /* color: #e01b37; */
    color: #C81C5E;
    font-size: 2.5rem;
    font-weight: 800 !important;
    font-family: "Montserrat";
    letter-spacing: -2px;
    line-height: 0.9 !important;
}

h1 span {
    font-size: 1.5rem;
}

h2 {
    font-size: 1.5rem;
    font-family: "Lato";
    line-height: 1.2 !important;
}

h3 {
    font-weight: 800 !important;
    font-family: "Montserrat";
    line-height: 1;
}

.multi-device h3 {
    font-size: 2.5rem;
}

.loyalty .h5,
.multi-device .h5 {
    font-weight: 900;
    font-size: 1.5rem;
}

.h3 {
    font-size: 1.5rem;
}

dt {
    font-weight: 900;
}

.number {
    font-weight: 900;
    padding-right: 0;
}

#mainCarousel .carousel img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 100vh;
    width: 100%;
    /*  -webkit-filter: grayscale(100%);
    filter: grayscale(100%); */
}

#mainCarousel .carousel-section::after {
    display: block;
    position: relative;
    /* background-image: linear-gradient(to bottom,
        rgba(224, 27, 55, 0.45) 0,
        rgba(224, 27, 55, 0.575) 100%); */
    margin-top: -80vh;
    height: 100%;
    width: 100%;
    content: "";
}

#mainCarousel .carousel-section div {
    top: 0;
}

#mainCarousel .carousel-caption {
    left: 5%;
    right: 5%;
}

#mainCarousel .carousel-indicators li {
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 50%;
    display: none;
    background-color: #fff;
    opacity: 1;
}

#mainCarousel .carousel-control-next {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    width: 0;
    opacity: 0.7;
}

#mainCarousel .carousel-control-prev {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 0;
    opacity: 0.7;
}

#loginBtn:hover path
{
    fill: #C81C5E;
}

#loginPointer,
#registerPointer,
#langPointer {
    display: block;
    position: absolute;
    border: solid 10px transparent;
    border-bottom-color: #000;
    pointer-events: none;
}

.register-explication{
    margin-bottom: 0.6rem;
}

.border-lighter{
    border-top: 1px solid rgb(255 255 255 / 30%);
}

.fa-angle-left,
.fa-angle-right {
    /* color: #e01b37; */
    color: #C81C5E;
    font-size: 2rem;
}

.bg-dark,
.btn-dark,
.active {
    background-color: #000 !important;
}

.how-it-works dt,
.advantages h3,
.myclub h3,
.strong-title {
    /*  color: #e01b37; */
    color: #C81C5E;
    font-weight: 900;
}

.advantages {
    background-image: url("../img/newLogin/advantages-bg-bw.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.myclub{
    /* background-image: url("../img/newLogin/resetPasswordBackgroundProbeauty.jpg"); */
    background-repeat: no-repeat;
    background-size: cover;
}

.myclub-logo{
    height: 60px;
    padding-bottom: 0.5rem;
}

.myclub>div{
    padding-top: 3rem;
    padding-bottom: 2rem;
}

.our-brands-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: auto;
    grid-template-columns: auto;
    -ms-grid-rows: ;
    grid-template-rows: repeat(n, 340px);
    grid-gap: 10px;
}

.our-brands-grid img,
.our-promotions-grid img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.our-brands>div,
.our-promotions>div {
    width: 100%;
}

.best-seller,
.loyalty {
    background-color: #f4f4f4;
}

.how-it-works>div,
.our-brands>div,
.best-seller>div,
.media-section>div,
.loyalty>article:first-child,
.event>div,
.our-promotions>div {
    padding: 2rem 15px !important;
}

.products {
    width: 100%;
}

.products .card {
    width: 48%;
    margin: 1%;
    -webkit-box-shadow: 0 0 10px #ccc;
    box-shadow: 0 0 10px #ccc;
}

.products .card,
.products .card-img-top {
    border-radius: 10px !important;
}

.products .card-text {
    width: 100%;
    font-size: 0.8rem;
}

.products .card-text span {
    font-size: 0.6rem;
}

.media-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: auto;
    grid-template-columns: auto;
    -ms-grid-rows: 340px 10px 340px;
    grid-template-rows: repeat(2, 340px);
    grid-gap: 10px;
}

.media-grid>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

.media-grid>*:nth-child(2) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}

.media-grid div:nth-child(3) {
    display: none;
}

.media-grid div:nth-child(4) {
    display: none;
}

.media-grid div:nth-child(1) {
    background-image: url("../img/login/technique.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.media-grid div:nth-child(2) {
    background-image: url("../img/login/american-crew-video.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.loyalty>div {
    background-image: url("../img/newLogin/loyalty.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 320px;
    margin-top: -150px;
}

.event {
    background-image: -o-linear-gradient( top, rgba(1, 10, 20, 0.753), rgba(1, 10, 20, 0.753)), url("../img/newLogin/event-bg.jpg");
    background-image: -webkit-gradient( linear, left top, left bottom, from(rgba(1, 10, 20, 0.753)), to(rgba(1, 10, 20, 0.753))), url("../img/newLogin/event-bg.jpg");
    background-image: linear-gradient( to bottom, rgba(1, 10, 20, 0.753), rgba(1, 10, 20, 0.753)), url("../img/newLogin/event-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.event button,
footer button,
.signin-button,
.signup-button,
.promotions button,
.popup-bg button {
    /*  background-color: #e01b37 !important; */
    background-color: #C81C5E !important;
}

.event article h1,
.event article h2,
.event article h3,
.event article h4,
.event article h5,
.event article h6 {
    line-height: 1.2;
}

.event article p {
    font-size: 1.25rem!important;
    line-height: 1;
    font-weight: 300;
}

.multi-device>div {
    background-image: url("../img/newLogin/multi-device.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: 100%;
    display: none;
}

.multi-device article {
    padding-top: 1rem;
}

.social div {
    background-color: #000;
    width: 45px;
    height: 45px;
    font-size: 1.9rem;
}

.size-icon-socialmedia {
    width: 33%;
}

.social>a:hover div {
    color: rgb(200, 28, 94) !important;
}

.brands-social-logo {
    max-width: 220px;
}

.brands-logo-height {
    height: 110px;
}

.size-social-icons {
    font-size: 200%;
}

.login-popup {
    text-transform: none;
}

.login-popup input,
.reset-password-popup input {
    width: 100%;
    border-radius: 5px;
    border: none;
    padding: 1rem;
    margin: 0.5rem 0;
    font-size: 13px;
}

.reset-password-popup input {
    border: 1px solid #000;
}

.more-info-popup-textarea {
    min-height: 150px;
    resize: none;
    border-radius: 5px;
    border: 1px solid #000;
}

.more-info-popup-input {
    border-radius: 5px;
    border: 1px solid #000;
    color: black;
}

.more-info-popup-input.ng-invalid.ng-touched,
form.showInvalidFields .more-info-popup-input.ng-invalid
{
    border-color: red;
    box-shadow: 0 0 0 .3rem rgba(255,0,0,.25);
}

.more-info-popup-input-left {
    border-radius: 5px 0 0 5px;
    border-right: none;
}

select.more-info-popup-input {
    padding-left: .375rem;
}

.more-info-popup-input:focus {
    color: black;
}

.more-info-popup-input:invalid {
    color: #6c757d;
}

select.more-info-popup-input:invalid {
    color: #6c757d;
}

#checkboxMoreInfo {
    height: 40px;
    width: 30px;
    float: left;
    margin-right: 10px;
}

input[type="checkbox"] {
    width: auto;
}

.register-popup,
.register-popup a,
.signup-button {
    color: #fff;
}

.register-popup a {
    /* color: #e01b37; */
    color: #C81C5E;
    cursor: pointer;
}

.arrow-carousel-div {
    width: 50px;
    height: 50px;
    background: rgba(0, 0, 0, 0.7);
    top: calc(50% - 25px);
    cursor: pointer;
}

.arrow-carousel-div-left {
    left: -25px;
}

.arrow-carousel-div-right {
    right: -25px;
}

.img-arrow-carousel-events {
    width: 15px;
    padding-top: 12px;
}


/*button {*/


/*  width: 100%;*/


/*}*/

.font-weight-bold {
    font-weight: 900 !important;
}

footer h3 {
    font-size: 2rem !important;
    line-height: 1.4 !important;
}

.h2,
.h3,
h5 {
    line-height: 1;
}

header a.strong-title,
nav a.strong-title {
    /* color: #e01b37; */
    color: #C81C5E;
    cursor: pointer;
}

header a.strong-title:hover,
nav a.strong-title:hover {
    color: #fff;
}

#loginForm button {
    width: 100%;
}


/************ OUR PROMOTIONS  ************/


/*! There are styles in the previous css code and in Media Queries as well */

.our-promotions-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: ;
    grid-template-rows: repeat(n, 340px);
    grid-gap: 15px;
}

.promotions {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 80% auto;
    grid-template-columns: 80% auto;
    -ms-grid-rows: 340px;
    grid-template-rows: 340px;
}

.promotions>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

.promotions>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

.promotions>div {
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    grid-column: 1 / 2;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1 / 2;
    background-color: rgba(0, 0, 0, 0.733);
}

.promotions>img {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1 / 3;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1 / 2;
}

.promotions p {
    padding: 2rem;
    line-height: 1.3;
}

.home footer>div {
    width: 100%;
    padding: 0 15px;
}

.home footer>div>div:nth-child(2) {
    padding: 1rem 0;
}

.home footer input {
    width: 100%;
}


/********************************************/


/************ PRODUCTS  ************/


/*! There are styles in the previous css code and in Media Queries as well */

.products-page header {
    height: 100px;
}

.products-page .container {
    height: 100px;
    /* line-height: 100px; */
}

.breadcrumb-item+.breadcrumb-item::before {
    content: "<";
}

.products-list>div:first-child {
    padding: 12rem 0 0 0 !important;
}

.products-list {
    padding: 0 15px 4rem 15px;
}

#navbarSupportedContent .active {
    background-color: rgba(204, 204, 204, 0.295) !important;
}

#eventCarousel .active {
    background: none !important;
}

.breadcrumb {
    margin-top: 0;
    margin-bottom: 0;
}

#quantity {
    width: 40%;
    border-radius: 5px;
    outline: none;
    /* border: 1px solid #dee2e6; */
    border: none;
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    -webkit-box-shadow: 0 0 3px #ccc;
    box-shadow: 0 0 3px #ccc;
    border-radius: 8px;
}

.increment>span:nth-of-type(1),
.increment>span:nth-of-type(2) {
    width: 20%;
    -webkit-box-shadow: 0 0 3px #ccc;
    box-shadow: 0 0 3px #ccc;
    border-radius: 8px;
}

.quantity-right-plus,
.quantity-left-minus {
    font-size: 1.5rem;
}

.home-products .card-body {
    line-height: 0.8;
}

.home-products .card-price {
    font-size: 1.5rem;
}

.home-products .card {
    -webkit-box-shadow: 0 0 3px #ccc;
    box-shadow: 0 0 3px #ccc;
    border: none;
}

.home-products .card-text {
    font-size: 1.2rem !important;
}

.home-products .card-text+p,
.home-products .card-units {
    font-size: 0.8rem;
}

.full-heart {
    color: #ccc;
    position: absolute;
    top: 3%;
    right: 10%;
}

.full-heart-active {
    color: #e41e6a;
}

.cart-badge {
    position: absolute;
    top: 30%;
    left: 20%;
    z-index: 100;
}


/********************************************/


/************ PRODUCT DETAIL & CART POPUP ************/

.product-detail {
    padding: 20rem 15px 4rem 15px;
}

.product-detail>div {
    width: 100%;
}

.product-detail div:first-child img {
    width: 60%;
}

.small-logo {
    width: 180px;
}

.product-img {
    border-radius: 10px;
    -webkit-box-shadow: 0 0 10px rgba(204, 204, 204, 0.5);
    box-shadow: 0 0 10px rgba(204, 204, 204, 0.5);
}

.cart-product img {
    height: 100px;
}

.cart-product button {
    width: 25px;
    height: 30px;
    border: none;
    -webkit-box-shadow: 0 0 10px rgba(204, 204, 204, 0.5);
    box-shadow: 0 0 10px rgba(204, 204, 204, 0.5);
    border-radius: 5px;
}

.events-constainer::-webkit-scrollbar {
    display: none;
}

.events-constainer {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.popup-fix-centered {
    position: fixed;
    top: 15%;
}


/********************************************/


/************ CONFIRMATION POPUP ************/

.confirmation-popup {
    width: 600px;
}

.popup,
.reset-password-popup {
    background-color: #fff;
    max-width: 550px;
}

.popup img {
    width: 80px;
    border-radius: 50%;
}

.email-expired-popup,
.email-validated-popup,
.password-reset-ok-popup,
.register-ok-popup,
.reset-password-popup {
    position: fixed;
    background: white;
}

.email-expired-popup img {
    border: 4px solid #f27474;
}

.email-validated-popup img,
.password-reset-ok-popup img,
.register-ok-popup img {
    border: 4px solid #a6d386;
}

.close-absolute {
    position: absolute;
    top: 0;
    right: 5%;
    font-size: 1.7rem;
    cursor: pointer;
}

.popup-bg {
    background-image: url("../img/imgWelcome.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    width: 100vw;
    height: 100vh;
}

.reset-password-popup img {
    width: 100%;
    background-color: #000;
    padding: 20px 40px;
}

.cancel-button {
    background-color: #707881 !important;
}


/********************************************/

.navigation-container {
    width: 80%;
    padding-right: 20%;
    /*padding-top: 11px;*/
    display: none;
}

.navigation-text {
    color: white;
    font-size: 16px;
    text-transform: uppercase;
}

.nav-link,
.nav-item a {
    color: #fff !important;
    fill: #fff !important;
    font-size: 0.8rem;
}

.navigation-text,
.nav-item,
.nav-link {
    color: white!important;
    text-decoration: none;
}

.navigation-text:hover,
.nav-item:hover,
.nav-link:hover,
.nav-item:hover a,
.nav-link:hover a {
    color: #C81C5E!important;
    text-decoration: none;
}

.nav-item:hover object,
.nav-link:hover object {
    -webkit-filter: invert(15%) sepia(97%) saturate(4364%) hue-rotate(329deg) brightness(84%) contrast(85%);
    filter: invert(15%) sepia(97%) saturate(4364%) hue-rotate(329deg) brightness(84%) contrast(85%);
}

.nav-link {
    font-weight: 600 !important;
    font-size: 0.9rem;
}

.navigation-item {
    padding: 0 1%;
    text-transform: uppercase;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
    -webkit-flex-basis: auto;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
    text-align: center;
}

@media (max-width: 720px) {
    #navbarSupportedContent {
        -webkit-box-shadow: 0.25px 0.25px 0.375px 0.375px rgba(255, 255, 255, 1);
        box-shadow: 0.25px 0.25px 0.375px 0.375px rgba(255, 255, 255, 1);
    }
}

.logo-container {
    width: 70%;
    padding-left: 15%;
    margin-top: 14px;
}


/*.register-icon {*/


/*position: absolute;*/


/*right: 10%;*/


/*top: calc(50% - 16px);*/


/*padding-right: 11.5rem;*/


/*}*/

.login-popup {
    width: 90%;
    padding: 1.5rem 1.1rem;
    /*TODO Provisional workaround to fix the register popup width  */
    position: absolute;
    right: 5%;
    top: 90px;
}

.menu-container {
    position: absolute;
    left: 20%;
    color: white;
}

.menu-item {
    float: left;
    padding: 11px 40px;
    font-weight: 400;
    font-size: 0.9rem;
    ;
}

.menu-item-link {
    color: white;
}

.menu-item-link:hover {
    color: #C81C5E;
    text-decoration: none;
}

.navbar-brand {
    line-height: 0;
}

.arrow-up-menu {
    display: block;
    border-bottom: 20px solid #000;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    position: absolute;
    right: 75px;
    top: -17px;
    width: 1px;
    height: 1px;
}

.arrow-up-login {
    display: block;
    border-bottom: 20px solid #000;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    position: absolute;
    right: 42px;
    top: -17px;
    width: 1px;
    height: 1px;
}

h1 {
    font-size: 2rem;
}

.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: #57626d !important;
    border-color: rgba(226, 226, 226, 0.1) !important;
}

.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #C81C5E !important;
    background-color: #C81C5E !important;
}

.custom-control-input:not(:disabled):active~.custom-control-label::before {
    color: #fff;
    background-color: #C81C5E;
    border-color: #C81C5E;
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: rgba(226, 226, 226, 0.1);
}

.custom-control-input:focus~.custom-control-label::before {
    -webkit-box-shadow: 0 0 0 1px rgb(182, 182, 182);
    box-shadow: 0 0 0 1px rgb(182, 182, 182);
}


/* .event>div {
    padding-left: 42px !important;
} */

.max-vh-100 {
    max-height: 100vh!important;
}

.max-vh-95 {
    max-height: 95vh!important;
}

.max-vh-90 {
    max-height: 90vh!important;
}

.max-vh-85 {
    max-height: 85vh!important;
}

.max-vh-80 {
    max-height: 80vh!important;
}

.max-vh-75 {
    max-height: 75vh!important;
}

.max-vh-50 {
    max-height: 50vh!important;
}

.max-vh-45 {
    max-height: 45vh!important;
}

.max-vh-40 {
    max-height: 40vh!important;
}

.max-vh-35 {
    max-height: 35vh!important;
}

.max-vh-30 {
    max-height: 30vh!important;
}

.max-vh-25 {
    max-height: 25vh!important;
}

@media (min-width: 540px) {
    .max-vh-sm-100 {
        max-height: 100vh!important;
    }
    .max-vh-sm-75 {
        max-height: 75vh!important;
    }
    .max-vh-sm-50 {
        max-height: 50vh!important;
    }
    .max-vh-sm-25 {
        max-height: 25vh!important;
    }
    .text-sm-uppercase {
        text-transform: uppercase;
    }
}

@media (min-width: 720px) {
    .max-vh-md-100 {
        max-height: 100vh!important;
    }
    .max-vh-md-75 {
        max-height: 75vh!important;
    }
    .max-vh-md-50 {
        max-height: 50vh!important;
    }
    .max-vh-md-25 {
        max-height: 25vh!important;
    }
    .text-md-uppercase {
        text-transform: uppercase;
    }
}

@media (min-width: 960px) {
    .max-vh-lg-100 {
        max-height: 100vh!important;
    }
    .max-vh-lg-75 {
        max-height: 75vh!important;
    }
    .max-vh-lg-50 {
        max-height: 50vh!important;
    }
    .max-vh-lg-25 {
        max-height: 25vh!important;
    }
    .text-lg-uppercase {
        text-transform: uppercase;
    }
}

@media (min-width: 1140px) {
    .max-vh-xl-100 {
        max-height: 100vh!important;
    }
    .max-vh-xl-75 {
        max-height: 75vh!important;
    }
    .max-vh-xl-50 {
        max-height: 50vh!important;
    }
    .max-vh-xl-25 {
        max-height: 25vh!important;
    }
    .text-xl-uppercase {
        text-transform: uppercase;
    }
}

.vh-75 {
    height: 75vh!important;
}

@media (min-width: 400px) {}

@media (min-width: 540px) {
    .logo {
        float: left;
        height: 45%;
        width: 1000%;
        max-width: 200px;
        margin-left: 10px;
        margin-top: 0px;
        /*padding: 20px 10px;*/
    }
    .login-popup {
        width: 400px;
        padding: 1.5rem 1.1rem;
        /*TODO Provisional workaround to fix the register popup width  */
        position: absolute;
        right: 6%;
        top: 60px;
    }
    h1 {
        font-size: 2.5rem;
    }
    .fa-user-circle,
    .fa-heart,
    .fa-shopping-cart {
        font-size: 2rem;
        vertical-align: -10px;
    }
    .products-page .register-icon>span {
        line-height: 32px;
    }
    #mainCarousel .carousel-caption {
        left: 8%;
        padding: 3% 0;
        width: 60%;
    }
    #mainCarousel .carousel-indicators li {
        display: list-item;
    }
    .products-page header {
        position: fixed !important;
    }
    #mainCarousel .carousel-section,
    #mainCarousel .carousel img {
        height: 100vh;
    }
    #mainCarousel .carousel-section::after {
        margin-top: -100vh;
    }
    #mainCarousel .carousel-transparency {
        height: 100%;
        width: 100%;
        top: 0;
        background: #99858D;
        position: absolute;
        opacity: 0.4;
    }
    .how-it-works dl div>span {
        line-height: 6.3rem;
        /* color: #e01b37; */
        color: #C81C5E;
    }
    .how-it-works dt span {
        display: none;
    }
    .how-it-works-text {
        font-size: 1rem;
    }
    h1 {
        font-size: 3.2rem !important;
    }
    .our-brands-grid {
        -ms-grid-columns: auto 10px auto;
        grid-template-columns: repeat(2, auto);
        -ms-grid-rows: 300px 10px 300px 10px 300px 10px 300px;
        grid-template-rows: repeat(4, 300px);
    }
    .our-brands-grid>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }
    .our-brands-grid>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid>*:nth-child(4) {
        -ms-grid-row: 1;
        -ms-grid-column: 4;
    }
    .our-brands-grid>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 1;
    }
    .our-brands-grid>*:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }
    .our-brands-grid>*:nth-child(7) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
    .our-brands-grid>*:nth-child(8) {
        -ms-grid-row: 2;
        -ms-grid-column: 4;
    }
    .our-brands-grid>*:nth-child(9) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .our-brands-grid>*:nth-child(10) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }
    .our-brands-grid>*:nth-child(11) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
    .our-brands-grid>*:nth-child(12) {
        -ms-grid-row: 3;
        -ms-grid-column: 4;
    }
    .best-seller button {
        width: 50%;
    }
    h3+p,
    .our-brands h3,
    .our-promotions h3 {
        padding-bottom: 2rem;
    }
    .event h3+p {
        padding-bottom: 0;
    }
    footer p {
        font-size: 1.6rem !important;
    }
    .home footer p {
        font-size: 1rem !important;
    }
    .promotions {
        -ms-grid-columns: 50% auto;
        grid-template-columns: 50% auto;
    }
}

@media (min-width: 720px) {
    .popup-fix-centered {
        position: fixed;
        left: 12%;
    }
    .popup-fix-centered-legal {
        position: fixed;
        left: 20%;
    }
    h1 {
        font-size: 4rem !important;
        line-height: 3.5rem;
    }
    h1 span {
        font-size: 3rem;
    }
    h2 {
        font-size: 1.5rem !important;
    }
    h3+p {
        font-size: 1rem;
        font-weight: 300;
    }
    .event h3+p {
        font-size: 1rem;
    }
    .our-brands-grid {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[3];
        grid-template-rows: repeat(3, 1fr);
    }
    .our-brands-grid-1 {
        -ms-grid-columns: (1fr)[1];
        grid-template-columns: repeat(1, 1fr);
        -ms-grid-rows: (1fr)[1];
        grid-template-rows: repeat(1, 1fr);
    }
    .our-brands-grid-1>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-2 {
        -ms-grid-columns: (1fr)[2];
        grid-template-columns: repeat(2, 1fr);
        -ms-grid-rows: (1fr)[1];
        grid-template-rows: repeat(1, 1fr);
    }
    .our-brands-grid-2>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-2>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }
    .our-brands-grid-3 {
        -ms-grid-columns: (1fr)[3];
        grid-template-columns: repeat(3, 1fr);
        -ms-grid-rows: (1fr)[2];
        grid-template-rows: repeat(2, 1fr);
    }
    .our-brands-grid-3>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-3>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-3>*:nth-child(3) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
    .our-brands-grid-3>*:nth-child(4) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .our-brands-grid-3>*:nth-child(5) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }
    .our-brands-grid-3>*:nth-child(6) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
    .our-brands-grid-3 div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-4 {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[1];
        grid-template-rows: repeat(1, 1fr);
    }
    .our-brands-grid-4>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-4>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }
    .our-brands-grid-4>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-4>*:nth-child(4) {
        -ms-grid-row: 1;
        -ms-grid-column: 4;
    }
    .our-brands-grid-5 {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[2];
        grid-template-rows: repeat(2, 1fr);
    }
    .our-brands-grid-5>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-5>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-5>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 4;
    }
    .our-brands-grid-5>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
    .our-brands-grid-5>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 4;
    }
    .our-brands-grid-5 div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-6 {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[3];
        grid-template-rows: repeat(3, 1fr);
    }
    .our-brands-grid-6>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-6>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-6>*:nth-child(3) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .our-brands-grid-6>*:nth-child(4) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }
    .our-brands-grid-6>*:nth-child(5) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
    .our-brands-grid-6>*:nth-child(6) {
        -ms-grid-row: 3;
        -ms-grid-column: 4;
    }
    .our-brands-grid-6 div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-6 div:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 3;
        -ms-grid-column-span: 2;
        grid-column: 3 / 5;
    }
    .our-brands-grid-7 {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[4];
        grid-template-rows: repeat(4, 1fr);
    }
    .our-brands-grid-7>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-7>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-7>*:nth-child(3) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .our-brands-grid-7>*:nth-child(4) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
    .our-brands-grid-7>*:nth-child(5) {
        -ms-grid-row: 3;
        -ms-grid-column: 4;
    }
    .our-brands-grid-7>*:nth-child(6) {
        -ms-grid-row: 4;
        -ms-grid-column: 3;
    }
    .our-brands-grid-7>*:nth-child(7) {
        -ms-grid-row: 4;
        -ms-grid-column: 4;
    }
    .our-brands-grid-7 div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-7 div:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 3;
        -ms-grid-column-span: 2;
        grid-column: 3 / 5;
    }
    .our-brands-grid-7 div:nth-child(3) {
        -ms-grid-row: 3;
        -ms-grid-row-span: 2;
        grid-row: 3 / 5;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-8 {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[5];
        grid-template-rows: repeat(5, 1fr);
    }
    .our-brands-grid-8>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-8>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-8>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 4;
    }
    .our-brands-grid-8>*:nth-child(4) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .our-brands-grid-8>*:nth-child(5) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }
    .our-brands-grid-8>*:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
    .our-brands-grid-8>*:nth-child(7) {
        -ms-grid-row: 4;
        -ms-grid-column: 1;
    }
    .our-brands-grid-8>*:nth-child(8) {
        -ms-grid-row: 4;
        -ms-grid-column: 3;
    }
    .our-brands-grid-8 div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-8 div:nth-child(6) {
        -ms-grid-row: 2;
        -ms-grid-row-span: 2;
        grid-row: 2 / 4;
        -ms-grid-column: 3;
        -ms-grid-column-span: 2;
        grid-column: 3 / 5;
    }
    .our-brands-grid-8 div:nth-child(7) {
        -ms-grid-row: 4;
        -ms-grid-row-span: 2;
        grid-row: 4 / 6;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-8 div:nth-child(8) {
        -ms-grid-row: 4;
        -ms-grid-row-span: 2;
        grid-row: 4 / 6;
        -ms-grid-column: 3;
        -ms-grid-column-span: 2;
        grid-column: 3 / 5;
    }
    .our-brands-grid-9 {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[3];
        grid-template-rows: repeat(3, 1fr);
    }
    .our-brands-grid-9>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-9>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-9>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 4;
    }
    .our-brands-grid-9>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
    .our-brands-grid-9>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 4;
    }
    .our-brands-grid-9>*:nth-child(6) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .our-brands-grid-9>*:nth-child(7) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }
    .our-brands-grid-9>*:nth-child(8) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
    .our-brands-grid-9>*:nth-child(9) {
        -ms-grid-row: 3;
        -ms-grid-column: 4;
    }
    .our-brands-grid-9 div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-10 {
        -ms-grid-columns: (1fr)[4];
        grid-template-columns: repeat(4, 1fr);
        -ms-grid-rows: (1fr)[4];
        grid-template-rows: repeat(4, 1fr);
    }
    .our-brands-grid-10>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .our-brands-grid-10>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .our-brands-grid-10>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 4;
    }
    .our-brands-grid-10>*:nth-child(4) {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
    .our-brands-grid-10>*:nth-child(5) {
        -ms-grid-row: 2;
        -ms-grid-column: 4;
    }
    .our-brands-grid-10>*:nth-child(6) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .our-brands-grid-10>*:nth-child(7) {
        -ms-grid-row: 3;
        -ms-grid-column: 2;
    }
    .our-brands-grid-10>*:nth-child(8) {
        -ms-grid-row: 4;
        -ms-grid-column: 1;
    }
    .our-brands-grid-10>*:nth-child(9) {
        -ms-grid-row: 4;
        -ms-grid-column: 2;
    }
    .our-brands-grid-10>*:nth-child(10) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
    .our-brands-grid-10 div:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
    }
    .our-brands-grid-10 div:nth-child(10) {
        -ms-grid-row: 3;
        -ms-grid-row-span: 2;
        grid-row: 3 / 5;
        -ms-grid-column: 3;
        -ms-grid-column-span: 2;
        grid-column: 3 / 5;
    }
    .products .card {
        width: 23%;
        margin: 1%;
        padding: 15px;
    }
    .home-products .card {
        width: 31%;
        margin: 1%;
    }
    .search-filter {
        width: 20%;
    }
    .home-products {
        width: 80%;
    }
    .media-grid {
        -ms-grid-columns: auto 10px auto 10px auto;
        grid-template-columns: repeat(3, auto);
        -ms-grid-rows: 340px 10px 340px;
        grid-template-rows: repeat(2, 340px);
    }
    .media-grid>*:nth-child(1) {
        -ms-grid-row: 1;
        -ms-grid-column: 1;
    }
    .media-grid>*:nth-child(2) {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }
    .media-grid>*:nth-child(3) {
        -ms-grid-row: 1;
        -ms-grid-column: 5;
    }
    .media-grid>*:nth-child(4) {
        -ms-grid-row: 3;
        -ms-grid-column: 1;
    }
    .media-grid>*:nth-child(5) {
        -ms-grid-row: 3;
        -ms-grid-column: 3;
    }
    .media-grid>*:nth-child(6) {
        -ms-grid-row: 3;
        -ms-grid-column: 5;
    }
    .media-grid div:nth-child(3) {
        display: block;
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1 / 3;
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3 / 4;
        background-image: url("../img/login/cuts.jpg");
        background-repeat: no-repeat;
        background-size: cover;
    }
    .media-grid div:nth-child(4) {
        display: block;
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1 / 3;
        background-image: url("../img/login/new-product.jpg");
        background-repeat: no-repeat;
        background-size: cover;
    }
    .loyalty>div {
        margin-top: 0;
    }
    .event button {
        margin: 0 !important;
    }
    .event article div {
        background-color: #000;
        height: 100%;
        padding: 3rem 2rem 3rem 2rem;
    }
    .multi-device,
    .multi-device-div-min-size {
        min-height: 600px;
    }
    .multi-device article {
        padding: 2rem 0rem 2rem 2rem;
    }
    .multi-device h3 {
        font-size: 3rem;
    }
    .multi-device>div {
        display: block;
    }
    .best-seller button {
        width: auto;
        padding: 1rem 5rem !important;
    }
    .best-seller h5,
    .media-section h5 {
        width: 60%;
        line-height: 1.3;
        font-size: 1.5rem;
    }
    .our-promotions h5 {
        line-height: 1.3;
        font-size: 1.5rem;
    }
    .loyalty h5 {
        line-height: 1.3;
        font-size: 1.4rem;
    }
    .loyalty dt {
        font-size: 2rem;
    }
    .multi-device button,
    .multi-device a {
        width: 80% !important;
    }
    footer button {
        width: 60%;
    }
    .our-promotions-grid {
        -ms-grid-columns: 1fr 15px 1fr;
        grid-template-columns: 1fr 1fr;
    }
    .promotions {
        -ms-grid-columns: 85% auto;
        grid-template-columns: 85% auto;
    }
    .home footer input,
    .home footer button {
        width: 70%;
    }
    .accordion button {
        padding: 0 !important;
    }
    .accordion .card {
        border: none;
    }
    .accordion .card-header {
        cursor: pointer;
    }
    .accordion .card-body {
        line-height: 1.1;
    }
    .product-detail>div {
        width: 50%;
    }
    .logo-container {
        width: 45%;
        padding-left: 10%;
        margin-top: 17px;
    }
}


/* Bootstrap md */

@media (min-width: 768px) {
    .popup-fix-centered {
        position: fixed;
        left: 18%;
        top: 10%;
    }

    .myclub>div {
        margin-top: 2rem !important;
        padding-top: 0;
        padding-bottom: 0;
    }
}

@media (min-width: 960px) {
    .advantages>div {
        position: relative;
        left: 15%;
        width: 80%;
        padding: 2rem 3rem !important;
        margin-top: 5rem !important;
    }

    .myclub>div {
        position: relative;
        left: 15%;
        width: 80%;
        margin-top: 4rem !important;
    }

    .myclub-logo{
        height: 86px;
    }

    #mainCarousel .carousel-caption {
        width: 60%;
    }
    .how-it-works>div,
    .our-brands>div,
    .best-seller>div,
    .media-section>div,
    .loyalty>article:first-child,
    .event>div,
    .next-events,
    .our-promotions>div,
    .products-list>div {
        padding: 4rem 3rem !important;
    }
    .products-list>div:first-child {
        padding: 14rem 3rem 0 3rem !important;
    }
    .products-list>div:last-child {
        padding: 4rem 3rem !important;
    }
    .product-detail {
        padding: 20rem 3rem 4rem 3rem !important;
    }
    h1 {
        font-size: 4.3rem !important;
        letter-spacing: -2px;
        word-spacing: 0.25rem;
    }
    h1 span {
        font-size: 2.5rem;
    }
    h3 {
        font-size: 3rem;
    }
    h3 span {
        font-weight: 900 !important;
        font-size: 2rem;
    }
    .title-first-word{
        font-weight: 900 !important;
        font-size: 2rem !important;
    }
    .next-events .card-body {
        padding: 0 0 0.5rem 0;
    }
    .how-it-works h3 {
        font-size: 2.2rem !important;
    }
    .next-events h3 {
        font-size: 2.3rem !important;
    }
    .multi-device h3 {
        font-size: 3.5rem;
    }
    footer>div {
        width: 70%;
    }
    .home footer>div {
        width: 100%;
        padding: 2rem 3rem 0 3rem !important;
    }
    .home footer>div>div {
        width: 25%;
    }
    .home footer>div>div:nth-child(2) {
        width: 50%;
        padding: 0 6rem 0 2rem;
    }
    footer h3 {
        font-size: 2.3rem !important;
    }
    .promotions {
        -ms-grid-columns: 70% auto;
        grid-template-columns: 70% auto;
    }
    .nav-link {
        color: #fff !important;
        font-size: 0.8rem;
    }
    .search-bar {
        /* background-image: url("../img/login/lupa.svg"); */
        background-repeat: no-repeat;
        background-size: 20px;
        background-position: 90%;
        border: none;
        border-bottom: 2px solid #000;
        padding-left: 0;
        background-color: transparent;
        width: 400px !important;
    }
    .search-bar:focus {
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    .nav-item {
        /* line-height: 80px; */
        /* padding: 1.6rem 1rem; */
        cursor: pointer;
    }
    .breadcrumb-nav {
        height: 40px;
        width: 100vw;
    }
    .order-filter {
        position: absolute;
        right: 3rem;
        top: 190px;
    }
    .order-filter select {
        height: 48px;
        border-radius: 0;
        border-top: none;
        border-bottom: none;
    }
    .breadcrumb {
        padding: 0 3rem;
        height: 48px;
        line-height: 48px;
    }
    .navigation-container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }
    .logo-container {
        width: 16%;
        padding-left: 2%;
        margin-top: 8px;
    }
}

@media (min-width: 1140px) {
    h3 {
        font-size: 3.5rem;
    }
    .advantages>div {
        width: 65%;
    }
    .advantages h3 {
        font-size: 2.2rem !important;
    }
    .myclub>div {
        width: 65%;
        margin-top: 1rem !important;
        margin-bottom: 1rem !important;
    }
    .myclub-logo{
        height: 94px;
    }
    .how-it-works h3+p {
        font-size: 1.2rem;
    }
    #mainCarousel .carousel-caption {
        width: 50%;
    }
    .how-it-works>div,
    .our-brands>div,
    .best-seller>div,
    .media-section>div,
    .loyalty>article:first-child,
    .event>div,
    .next-events,
    .our-promotions>div,
    .products-list>div {
        padding: 1rem 8rem !important;
    }
    .products-list>div:first-child {
        padding: 14rem 8rem 0 8rem !important;
    }
    .products-list>div:last-child {
        padding: 2rem 8rem !important;
    }
    .product-detail {
        padding: 20rem 8rem 4rem 8rem !important;
    }
    .how-it-works>div {
        width: 100%;
        padding: 4rem 2rem 4rem 8rem !important;
    }
    .products .card-text {
        font-size: 0.85rem;
    }
    .products .card-text span {
        font-size: 0.8rem;
    }
    .event article div {
        line-height: 1.2rem;
        width: 80%;
    }
    /* .event>div {
        padding: 2rem 2rem 2rem 8rem !important;
    } */
    .event h3 {
        font-size: 2.9rem !important;
    }
    .multi-device article {
        padding: 2rem 12rem 2rem 2rem;
    }
    footer>div {
        width: 55%;
    }
    .promotions {
        -ms-grid-columns: 50% auto;
        grid-template-columns: 50% auto;
    }
    .home footer>div {
        padding: 2rem 8rem 0 8rem !important;
    }
    .products-page .register-icon {
        border-right: 1px solid #dee2e6;
        border-left: 1px solid #dee2e6;
    }
    .register-icon>div:nth-child(3) {
        border-right: 1px solid #dee2e6;
        border-left: 1px solid #dee2e6;
    }
    .breadcrumb {
        padding: 0 8rem;
    }
    .order-filter {
        right: 8rem;
    }
}


/* Bootstrap xl */

@media (min-width: 1200px) {
    .popup-fix-centered-legal {
        position: fixed;
        left: 25%;
        top: 10%;
    }
}

@media (min-width: 1500px) {
    .how-it-works>div {
        width: 100%;
    }
    #mainCarousel .carousel-caption {
        width: 35%;
    }
    .our-brands>div,
    .our-promotions>div {
        left: 20%;
    }
    .how-it-works>div,
    .our-brands>div,
    .best-seller>div,
    .media-section>div,
    .loyalty>article:first-child,
    .event>div,
    .next-events,
    .our-promotions>div,
    .products-list>div {
        padding: 4rem 16rem !important;
    }
    .products-list>div:first-child {
        padding: 14rem 16rem 0 16rem !important;
    }
    .products-list>div:last-child {
        padding: 4rem 16rem !important;
    }
    .product-detail {
        padding: 20rem 16rem 4rem 16rem !important;
    }
    .how-it-works>div {
        padding: 4rem 2rem 8rem 16rem !important;
    }
    .how-it-works h3 {
        font-size: 2.2rem !important;
    }
    .loyalty>article:first-child {
        padding: 4rem 8rem 4rem 16rem !important;
    }
    .myclub>div {
        position: relative;
        left: 15%;
        width: 65%;
        margin-top: 4rem !important;
        margin-left: 0 !important;
    }
    /* .event>div {
        padding: 2rem 4rem 2rem 18rem !important;
    } */
    /* .event article div {
        padding: 5rem 8rem 5rem 2rem;
    } */
    .event button {
        width: 80%;
        margin-top: 4rem !important;
    }
    footer>div {
        width: 45%;
    }
    .home footer>div {
        padding: 2rem 16rem 0 16rem !important;
    }
    .breadcrumb {
        padding: 0 16rem;
    }
    .order-filter {
        right: 16rem;
    }
}

@media (min-width: 1700px) {
    .promotions {
        -ms-grid-columns: 40% auto;
        grid-template-columns: 40% auto;
    }
}

.navigation-item {
    padding: 11px;
}

.cursor-pointer,
.cursor-pointer * {
    cursor: pointer!important;
}


/** Fix Bootstrap d-flex */


/* .d-flex {
    display: -webkit-box!important;
    display: -ms-flexbox!important;
    display: -webkit-flex!important;
    display: flex!important;
} */


/** Register -> Code -> (?) button */

.infoInvoice {
    width: 21px;
    cursor: pointer;
    right: 30px;
    bottom: 20px;
    margin-left: 5px;
}

.showPasswdForm {
    right: 30px;
    bottom: 25px;
}

.showPasswdForm {
    color: rgb(211, 211, 211) !important;
}

.bringToFront {
    z-index: 16777267!important;
}

.bringToFrontPlus {
    z-index: 16777268!important;
}

.bringToFrontForLoader {
    z-index: 16777269!important;
}

.bringToFrontForLoaderBalls {
    z-index: 16777270!important;
}

.back2top {
    position: fixed;
    right: 10px;
    bottom: 10px;
    width: 50px;
    height: 40px;
    background-color: #C81C5E;
    cursor: pointer;
    color: white;
    text-align: center;
    opacity: 0.5;
    font-size: 18px;
    padding: 8px 8px 8px;
    -webkit-box-shadow: 1px 4px 12px 2px rgba(50, 0, 0, 0.75);
    box-shadow: 1px 4px 12px 2px rgba(50, 0, 0, 0.75);
    z-index: 1;
}

.back2top:hover {
    opacity: 1;
    -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
}

.cookies-float-button {
    position: fixed;
    left: 10px;
    bottom: 10px;
    width: 50px;
    height: 50px;
    background-color: #C81C5E;
    cursor: pointer;
    color: white;
    text-align: center;
    opacity: 0.5;
    font-size: 18px;
    padding: 8px 8px 8px;
    -webkit-box-shadow: 1px 4px 12px 2px rgba(50, 0, 0, 0.75);
    box-shadow: 1px 4px 12px 2px rgba(50, 0, 0, 0.75);
    z-index: 1;
}

.cookies-float-button:hover {
    opacity: 1;
    -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
}

.centered {
    position: fixed;
    top: 50%;
    left: 50%;
    /* bring your own prefixes */
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.popupInvoice * {
    font-family: "Raleway", "Helvetica", "Arial", sans-serif;
    font-weight: 600;
}

.closeInvoice {
    right: 0;
    top: 1px;
}

.closeInvoice {
    cursor: pointer;
    position: absolute;
    right: 5px;
    top: 5px;
    font-size: 55px;
    font-weight: 100;
    color: dimgray;
}

.invoice {
    padding-top: 23px;
    border: 1px solid black;
    background: white;
    -webkit-box-shadow: 0 9px 15px 0 rgba(0, 0, 0, 0.75);
    box-shadow: 0 9px 15px 0 rgba(0, 0, 0, 0.75);
    color: black;
}

.popupInvoice p {
    text-align: center;
    font-size: 22px;
}

.headerLeftInvoice img {
    width: 150px;
}

.headerLeftInvoice div {
    font-size: 9px;
    line-height: 1.6;
    margin-top: 11px;
    padding: 0;
}

.headerRightInvoice {
    padding: 0 50px;
    padding-right: 2%;
}

.boxDataInvoice {
    padding: 10px 0;
    text-align: left;
    height: 120px;
    float: right;
    background: lightgray;
    font-size: 9px;
    line-height: 1.6;
}

.headerRightInvoice p {
    font-size: 22px;
    margin: 0;
}

.boxDataInvoice div.columnRight {
    line-height: 1.4;
    font-size: 10px;
    font-family: 'Raleway';
}

.boxDataInvoice div.withBorderRed {
    border: 3px solid #e01b37;
    padding: 0;
}

.boxDataInvoice.withBorderRed.columnRight {
    font-family: 'Raleway';
    font-size: 10px;
    line-height: 1.4;
}

.boxLinesInvoice {
    padding: 4%;
}

.lineInvoice {
    background: lightgray;
    font-size: 10px;
    line-height: 1.7;
    margin-top: 10%;
}

p {
    color: #131313;
}

 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #131313;
}

 ::-moz-placeholder {
    /* Firefox 19+ */
    color: #131313;
}

 :-ms-input-placeholder {
    /* IE 10+ */
    color: #131313;
}

 :-moz-placeholder {
    /* Firefox 18- */
    color: #131313;
}


/* Custom Scrollbar using CSS */

.custom-scrollbar-css {
    /* overflow-y: scroll; */
    overflow-y: auto;
    scrollbar-color: black white;
    /* thumb and track color */
    scrollbar-width: thin;
}

.custom-scrollbar-css-white {
    scrollbar-color: white black!important;
    /* thumb and track color */
}


/* scrollbar width */

.custom-scrollbar-css::-webkit-scrollbar {
    width: 5px;
    margin-right: 5px;
}


/* scrollbar track */

.custom-scrollbar-css::-webkit-scrollbar-track {
    background: #fff;
}

.custom-scrollbar-css-white::-webkit-scrollbar-track {
    background: #000!important;
}

.custom-scrollbar-css::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #000;
}

.custom-scrollbar-css-white::-webkit-scrollbar-thumb {
    background-color: #fff!important;
}

.custom-scrollbar-x-css {
    overflow-y: scroll;
}


/* scrollbar width */

.custom-scrollbar-x-css::-webkit-scrollbar {
    height: 2px;
    margin-top: 10px;
}


/* scrollbar track */

.custom-scrollbar-x-css::-webkit-scrollbar-track {
    background: #fff;
}

.custom-scrollbar-x-css::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #000;
}

.transparency {
    position: absolute!important;
    width: 100%;
    height: 100%!important;
    opacity: 0.6!important;
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 9%, rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.72) 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), color-stop(9%, rgba(0, 0, 0, 0)), color-stop(40%, rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.72)));
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 9%, rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.72) 100%);
}

.transparency {
    width: 100%;
    height: 100%;
    position: fixed!important;
    top: 0!important;
    left: 0!important;
    background: black!important;
    opacity: 0.7!important;
}

.three-balls,
.ball {
    opacity: 1!important;
}


/*LEGAL*/

#popupConditions {
    width: 800px;
    background: white;
    border-radius: 5px;
    position: fixed;
    height: auto;
    padding: 17px;
    border: 1px solid #bbbbbb;
    z-index: 99;
    left: 50%;
    top: 50%;
    margin-left: -400px;
    margin-top: -200px;
    max-height: 80%;
}

.logoLegal {
    width: 220px;
    margin-bottom: 15px;
    padding-top: 5px;
}

.conditionsButton {
    margin: 0 40%;
    margin-bottom: 0;
    width: 20%;
    text-align: center;
    border-radius: 5px;
    padding: 7px 22px;
    font-size: 16px;
    background: #e01b37;
    color: white;
    border: none;
    font-weight: 400;
    cursor: pointer;
}

@media (max-width: 540px) {
    .w-sm-75 {
        width: 75%!important;
    }
}

@media (max-width: 540px) {
    .w-md-75 {
        width: 75%!important;
    }
}

@media (max-width: 960px) {
    .w-lg-50 {
        width: 50%!important;
    }
}

.btn-primary {
    color: #fff;
    background-color: #C81C5E !important;
    border-color: #C81C5E !important;
}

.btn-primary:hover {
    color: #fff;
    background-color: #C81C5E !important;
    border-color: #C81C5E !important;
}

.button-popup-ok {
    background-color: #C81C5E !important;
    color: #fff!important;
    padding: 0.4rem 4rem;
    border-radius: 0;
}

.loginError {
    text-align: center;
    -webkit-transition: height 0.5s ease, background 0.01s ease, border 0.01s ease;
    -o-transition: height 0.5s ease, background 0.01s ease, border 0.01s ease;
    transition: height 0.5s ease, background 0.01s ease, border 0.01s ease;
    color: white;
    border-radius: 6px;
    padding: 2px;
    margin: 8px 8px 0 8px;
}

.loginErrorOpen {
    border: 2px solid #e01b37;
    background: #e01b37;
}


/** Loading screen **/

#page-loading {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 999;
    background-color: #F5F5F5;
}

.three-balls {
    margin: 0 auto;
    width: 70px;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 45%;
}

.three-balls .ball {
    position: relative;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    display: inline-block;
    -webkit-animation: bouncedelay 2.0s infinite cubic-bezier(.62, .28, .23, .99) both;
    animation: bouncedelay 2.0s infinite cubic-bezier(.62, .28, .23, .99) both;
}

.three-balls .ball1 {
    -webkit-animation-delay: -.16s;
    animation-delay: -.16s;
}

.three-balls .ball2 {
    -webkit-animation-delay: -.08s;
    animation-delay: -.08s;
}

@keyframes bouncedelay {
    0% {
        bottom: 0;
        background-color: #C81C5E;
    }
    16.66% {
        bottom: 40px;
        background-color: #C81C5E;
    }
    33.33% {
        bottom: 0px;
        background-color: #C81C5E;
    }
    50% {
        bottom: 40px;
        background-color: #C81C5E;
    }
    66.66% {
        bottom: 0px;
        background-color: #C81C5E;
    }
    83.33% {
        bottom: 40px;
        background-color: #C81C5E;
    }
    100% {
        bottom: 0;
        background-color: #C81C5E;
    }
}

@-webkit-keyframes bouncedelay {
    0% {
        bottom: 0;
        background-color: #C81C5E;
    }
    16.66% {
        bottom: 40px;
        background-color: #C81C5E;
    }
    33.33% {
        bottom: 0px;
        background-color: #C81C5E;
    }
    50% {
        bottom: 40px;
        background-color: #C81C5E;
    }
    66.66% {
        bottom: 0px;
        background-color: #C81C5E;
    }
    83.33% {
        bottom: 40px;
        background-color: #C81C5E;
    }
    100% {
        bottom: 0;
        background-color: #C81C5E;
    }
}


/* END of Loading screen */

.marquee {
    overflow: hidden;
}

.w-90 {
    width: 90%;
}

.max-vh-100 {
    max-height: 100vh!important;
}

.max-vh-82 {
    max-height: 82vh!important;
}

.max-vh-75 {
    max-height: 75vh!important;
}

.max-vh-50 {
    max-height: 50vh!important;
}

.max-vh-25 {
    max-height: 25vh!important;
}

.max-vw-100 {
    max-width: 100vw!important;
}

.max-vw-75 {
    max-width: 75vw!important;
}

.max-vw-50 {
    max-width: 50vw!important;
}

.max-vw-25 {
    max-width: 25vw!important;
}

.min-vh-100 {
    min-height: 100vh!important;
}

.min-vh-75 {
    min-height: 75vh!important;
}

.min-vh-50 {
    min-height: 50vh!important;
}

.min-vh-25 {
    min-height: 25vh!important;
}

.min-vw-100 {
    min-width: 100vw!important;
}

.min-vw-75 {
    min-width: 75vw!important;
}

.min-vw-50 {
    min-width: 50vw!important;
}

.min-vw-25 {
    min-width: 25vw!important;
}

@media (min-width: 576px) {
    .max-vh-sm-100 {
        max-height: 100vh!important;
    }
    .max-vh-sm-75 {
        max-height: 75vh!important;
    }
    .max-vh-sm-50 {
        max-height: 50vh!important;
    }
    .max-vh-sm-25 {
        max-height: 25vh!important;
    }
    .max-vw-sm-100 {
        max-width: 100vw!important;
    }
    .max-vw-sm-75 {
        max-width: 75vw!important;
    }
    .max-vw-sm-50 {
        max-width: 50vw!important;
    }
    .max-vw-sm-25 {
        max-width: 25vw!important;
    }
    .min-vh-sm-100 {
        min-height: 100vh!important;
    }
    .min-vh-sm-75 {
        min-height: 75vh!important;
    }
    .min-vh-sm-50 {
        min-height: 50vh!important;
    }
    .min-vh-sm-25 {
        min-height: 25vh!important;
    }
    .min-vw-sm-100 {
        min-width: 100vw!important;
    }
    .min-vw-sm-75 {
        min-width: 75vw!important;
    }
    .min-vw-sm-50 {
        min-width: 50vw!important;
    }
    .min-vw-sm-25 {
        min-width: 25vw!important;
    }
    .text-sm-uppercase {
        text-transform: uppercase;
    }
}

@media (min-width: 768px) {
    .max-vh-md-100 {
        max-height: 100vh!important;
    }
    .max-vh-md-75 {
        max-height: 75vh!important;
    }
    .max-vh-md-50 {
        max-height: 50vh!important;
    }
    .max-vh-md-25 {
        max-height: 25vh!important;
    }
    .max-vw-md-100 {
        max-width: 100vw!important;
    }
    .max-vw-md-95 {
        max-width: 75vw!important;
    }
    .max-vw-md-90 {
        max-width: 75vw!important;
    }
    .max-vw-md-85 {
        max-width: 75vw!important;
    }
    .max-vw-md-80 {
        max-width: 75vw!important;
    }
    .max-vw-md-75 {
        max-width: 75vw!important;
    }
    .max-vw-md-70 {
        max-width: 75vw!important;
    }
    .max-vw-md-65 {
        max-width: 75vw!important;
    }
    .max-vw-md-60 {
        max-width: 75vw!important;
    }
    .max-vw-md-55 {
        max-width: 75vw!important;
    }
    .max-vw-md-50 {
        max-width: 50vw!important;
    }
    .max-vw-md-25 {
        max-width: 25vw!important;
    }
    .min-vh-md-100 {
        min-height: 100vh!important;
    }
    .min-vh-md-75 {
        min-height: 75vh!important;
    }
    .min-vh-md-50 {
        min-height: 50vh!important;
    }
    .min-vh-md-25 {
        min-height: 25vh!important;
    }
    .min-vw-md-100 {
        min-width: 100vw!important;
    }
    .min-vw-md-75 {
        min-width: 75vw!important;
    }
    .min-vw-md-50 {
        min-width: 50vw!important;
    }
    .min-vw-md-25 {
        min-width: 25vw!important;
    }
    .text-md-uppercase {
        text-transform: uppercase;
    }
    .max-vw-md-90 {
        max-width: 90vw!important;
    }
}

@media (min-width: 992px) {
    .max-vh-lg-100 {
        max-height: 100vh!important;
    }
    .max-vh-lg-75 {
        max-height: 75vh!important;
    }
    .max-vh-lg-50 {
        max-height: 50vh!important;
    }
    .max-vh-lg-25 {
        max-height: 25vh!important;
    }
    .max-vw-lg-100 {
        max-width: 100vw!important;
    }
    .max-vw-lg-75 {
        max-width: 75vw!important;
    }
    .max-vw-lg-50 {
        max-width: 50vw!important;
    }
    .max-vw-lg-25 {
        max-width: 25vw!important;
    }
    .min-vh-lg-100 {
        min-height: 100vh!important;
    }
    .min-vh-lg-75 {
        min-height: 75vh!important;
    }
    .min-vh-lg-50 {
        min-height: 50vh!important;
    }
    .min-vh-lg-25 {
        min-height: 25vh!important;
    }
    .min-vw-lg-100 {
        min-width: 100vw!important;
    }
    .min-vw-lg-75 {
        min-width: 75vw!important;
    }
    .min-vw-lg-50 {
        min-width: 50vw!important;
    }
    .min-vw-lg-25 {
        min-width: 25vw!important;
    }
    .text-lg-uppercase {
        text-transform: uppercase;
    }
    .max-vh-lg-90 {
        max-height: 90vh!important;
    }
}

@media (min-width: 1200px) {
    .max-vh-xl-100 {
        max-height: 100vh!important;
    }
    .max-vh-xl-75 {
        max-height: 75vh!important;
    }
    .max-vh-xl-50 {
        max-height: 50vh!important;
    }
    .max-vh-xl-25 {
        max-height: 25vh!important;
    }
    .max-vw-xl-100 {
        max-width: 100vw!important;
    }
    .max-vw-xl-75 {
        max-width: 75vw!important;
    }
    .max-vw-xl-50 {
        max-width: 50vw!important;
    }
    .max-vw-xl-25 {
        max-width: 25vw!important;
    }
    .min-vh-xl-100 {
        min-height: 100vh!important;
    }
    .min-vh-xl-75 {
        min-height: 75vh!important;
    }
    .min-vh-xl-50 {
        min-height: 50vh!important;
    }
    .min-vh-xl-25 {
        min-height: 25vh!important;
    }
    .min-vw-xl-100 {
        min-width: 100vw!important;
    }
    .min-vw-xl-75 {
        min-width: 75vw!important;
    }
    .min-vw-xl-50 {
        min-width: 50vw!important;
    }
    .min-vw-xl-25 {
        min-width: 25vw!important;
    }
    .text-xl-uppercase {
        text-transform: uppercase;
    }
}

@media (min-width: 2300px) {
    .min-vw-xxl-0 {
        min-width: 0!important;
    }
    .min-vh-xxl-0 {
        min-height: 0!important;
    }
    .min-vw-xxl-25 {
        min-width: 25vw!important;
    }
    .min-vh-xxl-25 {
        min-height: 25vh!important;
    }
    .min-vw-xxl-50 {
        min-width: 50vw!important;
    }
    .min-vh-xxl-50 {
        min-height: 50vh!important;
    }
    .min-vw-xxl-75 {
        min-width: 75vw!important;
    }
    .min-vh-xxl-75 {
        min-height: 75vh!important;
    }
    .min-vw-xxl-100 {
        min-width: 100vw!important;
    }
    .min-vh-xxl-100 {
        min-height: 100vh!important;
    }
}

@media (min-width: 3500px) {
    .min-vw-1x-0 {
        min-width: 0!important;
    }
    .min-vh-1x-0 {
        min-height: 0!important;
    }
    .min-vw-1x-25 {
        min-width: 25vw!important;
    }
    .min-vh-1x-25 {
        min-height: 25vh!important;
    }
    .min-vw-1x-37-5 {
        min-width: 37.5vw!important;
    }
    .min-vh-1x-37-5 {
        min-height: 37.5vh!important;
    }
    .min-vw-1x-50 {
        min-width: 50vw!important;
    }
    .min-vh-1x-50 {
        min-height: 50vh!important;
    }
    .min-vw-1x-75 {
        min-width: 75vw!important;
    }
    .min-vh-1x-75 {
        min-height: 75vh!important;
    }
    .min-vw-1x-100 {
        min-width: 100vw!important;
    }
    .min-vh-1x-100 {
        min-height: 100vh!important;
    }
}

@media (min-width: 4750px) {
    .min-vw-2x-0 {
        min-width: 0!important;
    }
    .min-vh-2x-0 {
        min-height: 0!important;
    }
    .min-vw-2x-25 {
        min-width: 25vw!important;
    }
    .min-vh-2x-25 {
        min-height: 25vh!important;
    }
    .min-vw-2x-37-5 {
        min-width: 37.5vw!important;
    }
    .min-vh-2x-37-5 {
        min-height: 37.5vh!important;
    }
    .min-vw-2x-50 {
        min-width: 50vw!important;
    }
    .min-vh-2x-50 {
        min-height: 50vh!important;
    }
    .min-vw-2x-75 {
        min-width: 75vw!important;
    }
    .min-vh-2x-75 {
        min-height: 75vh!important;
    }
    .min-vw-2x-100 {
        min-width: 100vw!important;
    }
    .min-vh-2x-100 {
        min-height: 100vh!important;
    }
}

@media (min-width: 7600px) {
    .min-vw-3x-0 {
        min-width: 0!important;
    }
    .min-vh-3x-0 {
        min-height: 0!important;
    }
    .min-vw-3x-12-5 {
        min-width: 12.5vw!important;
    }
    .min-vh-3x-12-5 {
        min-height: 12.5vh!important;
    }
    .min-vw-3x-18-75 {
        min-width: 18.75vw!important;
    }
    .min-vh-3x-18-75 {
        min-height: 18.75vh!important;
    }
    .min-vw-3x-25 {
        min-width: 25vw!important;
    }
    .min-vh-3x-25 {
        min-height: 25vh!important;
    }
    .min-vw-3x-37-5 {
        min-width: 37.5vw!important;
    }
    .min-vh-3x-37-5 {
        min-height: 37.5vh!important;
    }
    .min-vw-3x-50 {
        min-width: 50vw!important;
    }
    .min-vh-3x-50 {
        min-height: 50vh!important;
    }
    .min-vw-3x-75 {
        min-width: 75vw!important;
    }
    .min-vh-3x-75 {
        min-height: 75vh!important;
    }
    .min-vw-3x-100 {
        min-width: 100vw!important;
    }
    .min-vh-3x-100 {
        min-height: 100vh!important;
    }
}

@media (min-width: 9500px) {
    .min-vw-4x-0 {
        min-width: 0!important;
    }
    .min-vh-4x-0 {
        min-height: 0!important;
    }
    .min-vw-4x-12-5 {
        min-width: 12.5vw!important;
    }
    .min-vh-4x-12-5 {
        min-height: 12.5vh!important;
    }
    .min-vw-4x-18-75 {
        min-width: 18.75vw!important;
    }
    .min-vh-4x-18-75 {
        min-height: 18.75vh!important;
    }
    .min-vw-4x-25 {
        min-width: 25vw!important;
    }
    .min-vh-4x-25 {
        min-height: 25vh!important;
    }
    .min-vw-4x-37-5 {
        min-width: 37.5vw!important;
    }
    .min-vh-4x-37-5 {
        min-height: 37.5vh!important;
    }
    .min-vw-4x-50 {
        min-width: 50vw!important;
    }
    .min-vh-4x-50 {
        min-height: 50vh!important;
    }
    .min-vw-4x-75 {
        min-width: 75vw!important;
    }
    .min-vh-4x-75 {
        min-height: 75vh!important;
    }
    .min-vw-4x-100 {
        min-width: 100vw!important;
    }
    .min-vh-4x-100 {
        min-height: 100vh!important;
    }
}

@media (min-width: 12675px) {
    .min-vw-5x-0 {
        min-width: 0!important;
    }
    .min-vh-5x-0 {
        min-height: 0!important;
    }
    .min-vw-5x-12-5 {
        min-width: 12.5vw!important;
    }
    .min-vh-5x-12-5 {
        min-height: 12.5vh!important;
    }
    .min-vw-5x-18-75 {
        min-width: 18.75vw!important;
    }
    .min-vh-5x-18-75 {
        min-height: 18.75vh!important;
    }
    .min-vw-5x-25 {
        min-width: 25vw!important;
    }
    .min-vh-5x-25 {
        min-height: 25vh!important;
    }
    .min-vw-5x-37-5 {
        min-width: 37.5vw!important;
    }
    .min-vh-5x-37-5 {
        min-height: 37.5vh!important;
    }
    .min-vw-5x-50 {
        min-width: 50vw!important;
    }
    .min-vh-5x-50 {
        min-height: 50vh!important;
    }
    .min-vw-5x-75 {
        min-width: 75vw!important;
    }
    .min-vh-5x-75 {
        min-height: 75vh!important;
    }
    .min-vw-5x-100 {
        min-width: 100vw!important;
    }
    .min-vh-5x-100 {
        min-height: 100vh!important;
    }
}

.cookie-banner {
    padding: 12px 12px 0 12px;
    position: fixed;
    bottom: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.875);
    color: white;
    z-index: 4;
    font-size: 0.9rem;
    text-align: center;
    font-weight: 501;
}

.cookie-banner-button {
    display: inline;
    background-color: #C81C5E;
    border-radius: 4px;
    padding: 5px 10px;
    margin: 0 3px;
    cursor: pointer;
}

.navbar-brand {
    font-size: 0;
}

.vertical-text {
    width: 1px;
    word-wrap: break-word;
    white-space: pre-wrap;
}

.customPopupDiv {
    background-color: #ffffff;
}

.customPopupTitleColors,
.customPopupTitleColors * {
    color: #000000!important;
}

.customPopupContentColors,
.customPopupContentColors * {
    color: #000000!important;
}


/* Popup Welcome */

.popupWelcome {
    z-index: 100;
}

.popup-fix-centered {
    position: fixed;
    top: 15%;
}

.transparency {
    top: 0!important;
    left: 0!important;
    background-color: #000!important;
    opacity: 0.7!important;
    z-index: 99!important;
}

.border-checkbox {
    width: 20px;
    height: 20px;
    border: 1px solid black;
    border-radius: 4px;
    padding: 0 !important;
    cursor: pointer;
}

.button-popup-welcome {
    background-color: #C81C5E !important;
    color: #fff!important;
    padding: 0.4rem 4rem;
    border-radius: 0;
}

.beckbox-active {
    background: #C81C5E;
}


/*
.popupConditionsContent p,popupConditionsContent ul{color:dimgray;}
.popupConditionsContent p strong{color:black;}
ol li{
list-style-type: none;
color:dimgray;
text-decoration: underline;
}
*/

#messageMarquee {
    overflow: hidden;
    white-space: nowrap;
}

#messageMarqueeSpan {
    line-height: 1.1;
}

#desktop-language-menu {
    left: -55px!important;
}

.activeLang {
    background-color: rgba(204, 204, 204, 0.295) !important;
}

.height-auto{
    height: auto !important;
}

.no-margin-top{
    margin-top: 0px !important;
}

/** Huge screens */

@media (min-width:3500px) {
    body,
    body *,
    * {
        font-size: 105%;
    }
    #mainMenu {
        margin-top: 0!important;
        height: 3vh!important;
    }
    #marqueeDiv {
        display: none!important;
    }
    .nav-item,
    .nav-link,
    .btn,
    figure p,
    .card p,
    .search-filter div,
    p,
    u,
    label,
    .cart-currency,
    .page-link,
    span,
    select,
    option,
    input,
    svg,
    path {
        font-size: 0.99rem!important;
    }
}

.how-it-works h3,
.advantages h3 {
    font-size: 1.5rem !important;
}

@media (min-width: 1500px) {
    .how-it-works h3,
    .advantages h3 {
        font-size: 2rem !important;
    }
}


.moment-picker td.selected {
    background-color: lightgray !important;
    background-image: none !important;
    color: #404040 !important;
}