.mk-our-brides-title {
    position: fixed;
    font-family: 'PFChampion-Regular', sans-serif;
    padding: 10px;
    z-index: 800;
    background: transparent;
    transform: translateX(-50%);
    left: 50%;
    width: 100%;
    display: flex;
    justify-content: center;
    color: #fcfaf7;
    mix-blend-mode: difference;
}

.archive {
    position: fixed;
    top: 15vh;
    left: 3vw;
    z-index: 1500;
}

.image-nav button{
    cursor:pointer;
    display: flex;
    justify-content: center;
    flex-direction: column;
    border: 0;
    background: transparent;
}

/* Duża wysokość żeby był scroll */
.scroll-section {
    height: calc(100vh * 31);
    position: relative;
    align-items: center;
    background-color: #abaf97;
    margin-top: 0;
}

/* Sticky kontener */
.sticky-wrapper {
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;
    width: 100%;
}

.image-layer {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
    will-change: transform;
    transition: opacity 0.2s linear;
    display: flex;
    justify-content: center;
    align-items: center;
}

.image-box {
    position: relative;
    overflow: hidden;
    display:block;
    border-radius:inherit;
    object-position:center;
}

.image-box-transparent {
    position: relative;
    overflow: hidden;
    display:block;
    border-radius:inherit;
    object-position:center;

    background-image: url("../assets/img/OurBridesImg/background-small.webp");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.image-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.image-text-container {
    position: absolute;
    width: 30%;
    top: 25%;
    right: 1%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: clamp(0.8em, 1em, 1.2em);
}

.image-text-container-mk-ob {
    top: 20%;
    left: 30%;
}

.visible {
    opacity:1;
}

.image-text {
    text-align: center;
    padding: 2px;
}

.layer-1 { z-index: 1; }
.layer-2 { z-index: 2; }
.layer-3 { z-index: 3; }
.layer-4 { z-index: 4; }
.layer-5 { z-index: 5; }
.layer-6 { z-index: 6; }
.layer-7 { z-index: 7; }
.layer-8 { z-index: 8; }
.layer-9 { z-index: 9; }
.layer-10 { z-index: 10; }
.layer-11 { z-index: 11; }
.layer-12 { z-index: 12; }
.layer-13 { z-index: 13; }
.layer-14 { z-index: 14; }
.layer-15 { z-index: 15; }
.layer-16 { z-index: 16; }
.layer-17 { z-index: 17; }
.layer-18 { z-index: 18; }
.layer-19 { z-index: 19; }
.layer-20 { z-index: 20; }
.layer-21 { z-index: 21; }
.layer-22 { z-index: 22; }
.layer-23 { z-index: 23; }
.layer-24 { z-index: 24; }
.layer-25 { z-index: 25; }
.layer-26 { z-index: 26; }
.layer-27 { z-index: 27; }
.layer-28 { z-index: 28; }
.layer-29 { z-index: 29; }
.layer-30 { z-index: 30; }
.layer-31 { z-index: 31; }

@media (max-width: 991px) {
    .mk-our-brides-title {
        position: absolute;
    }

    .image-text-container {
        width: 40%;
        font-size: clamp(0.5em, 0.7em, 0.9em);
    }
    
    .image-text-container-mk-ob {
        left: 20%;
    }
}

@media (max-width: 420px) {
    .image-text-container {
        width: 50%;
    }
}