.navigation {
    /* fixed keyword is fine too */
    position: sticky;
    top: 0;
    z-index: 100;
    /* z-index works pretty much like a layer:
    the higher the z-index value, the greater
    it will allow the navigation tag to stay on top
    of other tags */
    display: none;
}

nav {
    position: sticky;
    top: 0;
    display: none;
    z-index: 100;
}

.buttongreen {
    position: relative;
    z-index: 99;
}

.parallax img {
    display: block;
    width: 100%;
    margin: auto;
    position: absolute;
    /*    height: 300px;*/
    object-fit: cover;
}

.buttongreen {
    position: relative;
    z-index: 99;
}

@media only screen and (max-width:500px) {

    .parallax-container .quotes {
        font-size: 6vw;
    }

}

@media only screen and (max-width : 500px) {
    .parallax img {
        max-height: 130%;
        /* or a little bit higher */
    }
}

@media only screen and (min-width: 600px) {
    .parallax img {
        max-height: 170%;
    }
}