.chandelier > div:first-child {
    position: relative;
    z-index: -2;

    img {
        position: absolute;
        top: 0;
        opacity: 0;
        transform: translateY(-200px);
    }

    img.show {
        transition: opacity 2s ease, transform 2s ease;
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile & Tablet */
@media (max-width: 799.999px) {
    .chandelier > div:first-child {
        display: none;
    }

    .chandelier > div:last-child {
        padding: 20px;
        background-color: #0001;
        text-align: center;
    }
}

/* Tablet & Desktop */
@media (min-width: 800px) and (max-width: 1799.999px) {
    .chandelier > div:first-child {
        img {
            right: 20px;
        }
    }
}

@media (min-width: 800px) and (max-width: 1219.999px) {
    .chandelier > div:last-child {
        padding: 40px 340px 40px 40px;
    }
}

@media (min-width: 1220px) {
    .chandelier > div:last-child {
        margin: 0 auto;
        max-width: 680px;
        text-align: center;
        padding: 40px;
    }
}

@media (min-width: 1800px) {
    .chandelier > div:first-child {
        img {
            right: 10%;
        }
    }
}

.lamp {
    max-width: 400px;
    margin: 0 auto;
    padding: 30px;
}


/* Mobile & Tablet */
@media (max-width: 979.999px) {
    .block1 > div:last-child {
        text-align: center;
    }
}
/* Desktop */
@media (min-width: 980px) {
    .block1 {
        display: flex;
        align-items: start; 
        gap: 80px;

        > div:first-child {
            flex: 2;
        }

        > div:last-child {
            padding-top: 40px;
            flex: 1;
            position: sticky; 
            top: 20px;
        }
    }
}

img.chashi {
    max-width: 400px;
}
/* Mobile & Tablet */
@media (max-width: 979.999px) {
    .block2 > div:first-child {
        text-align: center;
    }
}
/* Desktop */
@media (min-width: 980px) {
    .block2 {
        display: flex;
        align-items: start; 
        gap: 80px;

        > div:first-child {
            padding-top: 40px;
            flex: 1;
            position: sticky; 
            top: 20px;
        }

        > div:last-child {
            flex: 1;
        }
    }
}
    
.parallax {
    /* The image used */
    background-image: url("../img/parallax.png");

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.parallax .space {
    padding: 150px 0;
}

.parallax .content {
    margin: 0 auto;
    max-width: 600px;
    text-align: center;
    background-color: #FFFC;
    padding: 30px 20px 40px 20px;
    border-radius: 10px;
}

/* INFO: iOS Safari/Chrome: fixed attachment scales incorrectly */
@supports (-webkit-touch-callout: none) {
    .parallax {
        background-attachment: scroll;
        background-size: cover;
        background-position: center center;
    }
}
