body {
    margin: 0px;
    padding: 0px;
    background-image: url("./resources/Nature\ Fruit\ Grass\ Blurred\ wallpaper\ \ 14.jpg");
    background-size: cover;
}

.goals {
    width: 1400px;
    display: grid;
    grid-template-columns: 1fr 3fr 1fr;
    grid-template-rows: 150px 150px 350px;
    row-gap: 10px;
    column-gap: 10px;
    margin: 50px 10px;
    font-family: 'Comfortaa', cursive;
}

.goals div {
    color: rgb(6, 39, 2);
}

.goals div:nth-of-type(1) {
    grid-row: 1;
    grid-column: 1/4;
}

.goals div:nth-of-type(2) {
    grid-row: 2;
    grid-column: 1/4;
}

.goals div:nth-of-type(1) p {
    color: rgb(38, 248, 38);
    font-size: 65px;
    text-align: center;
    font-family: 'Kaushan Script', cursive;
}

.goals div:nth-of-type(2) p {
    font-size: 45px;
    text-align: center;
}

.goals div:nth-of-type(4) p {
    font-size: 22px;
    padding: 10px;
}


/* --------- Media Queries ------------  */

@media (max-width: 768px) {
    body {
        margin: 0px;
        padding: 0px;
        background: rgb(205, 245, 197);
    }
    .goals {
        width: 1400px;
        display: grid;
        grid-template-columns: 300px;
        grid-template-rows: 100px 100px 10px 300px;
        row-gap: 5px;
        column-gap: 5px;
        margin: 30px 10px;
        font-family: 'Comfortaa', cursive;
    }
    .goals div:nth-of-type(1) {
        grid-row: 1;
        grid-column: 1;
    }
    .goals div:nth-of-type(2) {
        grid-row: 2;
        grid-column: 1;
    }
    .goals div:nth-of-type(3) {
        visibility: collapse;
    }
    .goals div:nth-of-type(1) p {
        color: rgb(38, 248, 38);
        font-size: 35px;
        text-align: center;
        font-family: 'Kaushan Script', cursive;
    }
    .goals div:nth-of-type(2) p {
        font-size: 45px;
        text-align: center;
    }
    .goals div:nth-of-type(4) p {
        font-size: 15px;
        padding: 10px;
    }
}