app.css

body {
    box-sizing: border-box;
    background-color: #f5d9d5;
    font-family: Nunito, sans-serif;
    overflow-x: hidden;
}

/* navbar */

#main-nav {
    font-weight: 200;
    font-size: 1.5rem;
}

#main-nav .navbar-brand {
    color: #ec3a48;
    font-size: 1.5rem;
}

#main-nav .nav-link {
    color: white;
}

#main-nav .nav-link:hover {
    color: #ec3a48;
}


/* main section */

.text-section h2 {
    color: #ec3a48;
    font-size: 2.5rem;
    font-weight: 100;
}

.text-section p {
    color: #f49cc0;
    line-height: 2;
    font-size: 1.125rem;
    font-weight: 100;
}

.content {
    margin-top: 100px;
}

#heading-group span {
    color: #ec3a48;
}

#heading-group h1 {
    text-transform: uppercase;
    font-size: 4rem;
    font-weight: 100;
    color: white;
}

#main-nav.scrolled {
    background-color: red !important;
}

@media (max-width: 1245px) {
    #heading-group h1 {
        font-size: 3rem;
    }

    h2 {
        font-size: 2rem;
    }

    #main-nav {
        background-color: #f49cc1b0;
    }
}