#gridcontainer {
    display: grid;
    grid-template-columns: minmax(0, 1fr)1fr 1fr 1fr 1fr 1fr 1fr minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
    background-color: lightgray;



}

nav {
    grid-column: 2/3;
    display: flex;
    flex-direction: column;
    align-items: center;
    float: left;
    grid-row: 1/4;
    padding: 1rem;
    font-size: 2rem;
    background: linear-gradient(180deg, rgba(253, 236, 187, 1) 0%, rgba(226, 106, 76, 1) 90%, #327688 100%);
    justify-content: space-around;


}

nav a {
    font-weight: 700;
    align-items: center;
    text-align: center;
    color: #327688;
}

header {
    grid-column: 3/8;
    text-align: center;
    background: linear-gradient(360deg, rgba(105, 155, 159, 1) 0%, rgba(68, 104, 107, 1) 50%, rgba(43, 63, 65, 1) 100%);
    color: white;


}

main {
    grid-column: 3/8;
    background-color: white;
    font-weight: 1000;
}

main h1 {
    text-align: center;
}

main p {
    padding: 1rem;
}

footer {
    grid-column: 2/8;
    display: flex;
    background-color: #337688;
    align-items: center;
    justify-content: center;
    justify-content: space-around;
    padding: 1rem;
    color: white;
}

#banner {
    background-image: url(aboutbanner.webp);
    background-size: cover;
    background-position: center;
    grid-column: 3/8;
    aspect-ratio: 16/16;
}

main p {
    text-align: center;
}

* {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

@media (max-width: 960px) {
    nav {
        grid-row: 2;
        grid-column: 2/8;
        background: linear-gradient(360deg, rgba(253, 236, 187, 1) 0%, rgba(226, 106, 76, 1) 90%, #327688 100%);
    }

    nav,
    main,
    header,
    footer,
    #banner {
        grid-column: 2/8;
    }

    main {
        padding-right: 1rem;
    }
}