* {
    font-family: "Red Hat Display", sans-serif;
    font-size: 20px;
}

.gallery {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: rgba(66, 66, 66, 0.9);
}

.gallery img {
    position: fixed;
}

.middle-text {
    bottom: 15vh;
    width: 100vw;
    height: 5vh;
    position: fixed;
}

.middle-text p{
    text-align: center;
    color: white;
    position: fixed;
    width: 100vw;
    margin-block-start: 0;
    margin-block-end: 0;
}

.bottom-text {
    height: 15vh;
    width: 100vw;
    display: flex;
    position: fixed;
    bottom: 0;
}

.bottom-text img{
    height: 13vh;

}

#exit {
    right: 1vw;
    top: 1vw;
    width: 3vw;
}

#img_main {
    max-width: 100vw;
}

#arrow_left {
    left: 7vw;
    width: 4vw;
}

#arrow_right {
    right: 7vw;
    width: 4vw;
}

.bottom-text img {
    position: fixed;
}

#img_2 {
    border: 0.5vh solid black;
    bottom: 1.5vh;
}

@media (max-width: 600px) {
    body {
        --screen: "medium";
    }

    .gallery img {
        max-width: 100vw;
        position: fixed;
    }

    .smol {
        display: none;
    }

    #exit {
        width: 10vw;
        right: 7vw;
    }

    #arrow_left {
        width: 20vw;
    }

    #arrow_right {
        width: 20vw;
    }
}

@media (min-width: 601px) {
    body {
        --screen: "ultra large";
    }

    .gallery img {
        max-height: 75vh;
        position: fixed;
        display: block;
    }

    .smol {
        display: block;
    }
}