styles.css

body, html {
    margin: 0;
    max-width: 100%;
    overflow-x: hidden;
    font-size: calc(15px + 0.390625vw);

    @media (min-width: 635px) {
        font-size: calc(30px + 0.4vw);
    }
}

@font-face {
    font-family: nokiaCellphone;
    src: url("src/nokiafc22.ttf");
}

h1, h5, h3 {
    font-family: nokiaCellphone;
    color: black;
}

h5 {
    text-shadow: none;
    font-style: italic;
}

.scrollableImage {
    width: 180%;
    padding: 0;
    overflow-y: hidden;
    height: 100vh;
    object-fit: cover;
    position: relative;
    left: 0%;
}

.fullscreenStaticImage {
    width: 250%;
    padding: 0;
    overflow-y: hidden;
    height: 100vh;
    object-fit: cover;
    position:relative;
}

.logo {
    position: absolute;
    z-index: 1;
    width: 100%;
    top: 15vh;
    text-shadow: 3px 3px white;
}

.imgButton, img {
    width: 20vw;
}


.content{
    text-shadow: 3px 3px white;
    position: absolute;
    top: 115%;
    z-index: 1;
    text-align: center;
    width: 80%;

    @media (min-width: 2000px) {
        max-width: 40%;
    }

    @media (min-width: 1500px) {
        max-width: 50%;
    }

    @media (min-width: 1000px) {
        max-width: 60%;
    }

    @media (min-width: 750px) {
        max-width: 70%;
    }

    @media (min-width: 500px) {
        max-width: 80%;
    }
}

p {
    text-shadow: none;
    font-family: nokiaCellphone;
    color: black;
    font-size: 0.5rem;

    width: 60%;

    @media (min-width: 1000px) {
        max-width: 30%;
    }

    @media (min-width: 2000px) {
        max-width: 30%;
    }

    @media (min-width: 750px) {
        max-width: 70%;
    }

    @media (min-width: 500px) {
        max-width: 80%;
    }
}