body {
    font-family: 'Oswald', sans-serif;
    -webkit-perspective: 2500px;
            perspective: 2500px;
}

.wrapper {
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.scene {
    position: absolute;
    left: 0;
    top: 10vh;
    width: 100vw;
    height: 20vh;
    margin: 0;
    -webkit-perspective: 2500px;
            perspective: 2500px;
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.group {
    position: absolute;
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.group > div {
    position: absolute;
}

.image_container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.image_container.hidden {
    opacity: 0;
}

.group img {
    width: 45vw;
    background-size: cover;
    background-position: center center;
    cursor: pointer;
}

.text {
    position: absolute;
    bottom: -30px;
    line-height: 1.2;
    font-size: 20px;
}

.four .text {
    bottom: -55px;
}

.left .text {
    right: 0;
    font-size: 27px;
    bottom: -42px;
}

.center .text {
    left: 0;
}

.center .six .text {
    left: 0;
    right: 0;
    text-align: right;
}

.close_button {
    display: none;
    position: absolute;
    top: 4vh;
    right: 20vw;
    font-size: 20px;
}

.clicked .close_button {
    display: block;
    cursor: pointer;
}