@media screen and (max-width: 700px) {
    body {

    }

    .nav-container {
        flex-flow: column;
    }

    .nav-button {
        height: 50%;
        width: 100%;
        /*border: 1px solid red;*/
    }

    .background-image-container {
        display: flex;
        /*width: 100vw;*/
        height: 100vh;
        margin: 0;
        border-radius: 0;
        cursor: pointer;

    }



    .background-picture {
        display: flex;
        border-radius: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }



    .landscape {
        display: none;
    }

    .portrait {
        display: flex;
    }
}