/* Container */
.funky-box-container {
    position: relative;
    z-index: 0;
}

/* Body */
.funky-box-body {
    border-radius: 1.875rem 0;
}

.funkybox-row {
    z-index: 44;
}

/* Dots */
.graphic-lilla-dots {
    background-image: url("../../../img/svg/graphic-lilla.svg");
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

.graphic-green-dots {
    background-image: url("../../../img/svg/graphic-green.svg");
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

.funky-box-dots-t-r-inside,
.funky-box-dots-b-l-inside {
    position: absolute;
    z-index: 1;
    background-image: url('../../../img/svg/icon-dots.svg');
    background-repeat: no-repeat;
    background-size: 73.75rem;
    width: 10.313rem;
    height: 16.75rem;
    overflow: hidden;
}

.funky-box-dots-t-r-outside,
.funky-box-dots-b-l-outside {
    position: absolute;
    z-index: -1;
    width: 9.375rem;
    height: 9.375rem;
}

.funky-box-dots-t-r-outside {
    transform: rotate(180deg);
    top: -1.563rem;
    right: -1.563rem;
}

.funky-box-dots-b-l-outside {
    bottom: -1.563rem;
    left: -1.563rem;
}

.funky-box-dots-t-r-inside {
    background-position: 0.313rem -6.875rem;
    top: 10%;
    left: -0.438rem;
}

.funky-box-dots-b-l-inside {
    background-position: -60.688rem -12.25rem;
    right: 0;
    bottom: -2.813rem;
}

.funky-box-row-black-friday {
    display: flex;
    align-items: center;
    gap: 44px;
        text-align: center;
    @media (min-width: 767px) {
        gap: 64px;
    }
    /** There is custom snap point for some reason */
    @media (min-width: 1024px) {
        text-align: left;
    }
}

.funky-box-row-black-friday .funky-box-right {
    flex: 1 1 0;
    display: none;
    /** There is custom snap point for some reason */
    @media (min-width: 1024px) {
        display: block;
    }
}