html {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    background: #b2b8b6;
}

.image-container {
    height: 100vh;
    width: 100vw;
    object-fit: cover;
    z-index: 1;
}

img {
    width: 100vw;
    height: 100vh;
}

.image {
    object-fit: cover;
    z-index: 1;
}

.button-container {
    z-index: 100;
    position: absolute;
    /* border: 3px solid blue; */
    height: 5vh;
    width: 5.5vh;
    margin-top: -24vh;
    margin-left: 50.7vw;
}

@media screen and (max-width: 1000px) {
    .image-container {
        height: 100vh;
        width: 100vw;
        object-fit: cover;
    }
    
    .image {
        transform: scaleX(2.7);
    }

    .button-container {
        transform: scaleX(.7);
        margin-left: 50vw;
    }
}  

@media screen and (max-width: 414px) {
    .image {
        transform: scaleX(3.2);
    }
}