body {
    grid-template-areas:
        "nav nav nav"
        "main main main"
        "footer footer footer";
}

main {
    display: grid;
    grid-template-rows: auto;
    grid-template-areas:
    "ardent"
    "efron"
    "website"
    ;
}

.project {
    background-color: rgba(0, 0, 0, 80%);
    color: #e5e5e5;
}
.right {
    margin-top: 2em;
    margin-left: 20em;
    border-top-left-radius: 10em;
    border-bottom-left-radius: 10em;
    padding-left: 5em;
    padding-bottom: 1em;
}

.left {
    margin-top: 2em;
    margin-right: 22em;
    border-top-right-radius: 10em;
    border-bottom-right-radius: 10em;
    padding-left: 0.5em;
    padding-bottom: 1em;
}

.project > img {
    border-radius: 1em;
    max-width: 50em;
    float: left;
    margin-right: 1em;
}

.project > video {
    max-width: 50em;
    float: left;
    border-radius: 1em;
    margin-right: 1em;
}

#ardent {
    grid-area: ardent;
}

#efron {
    grid-area: efron;
}

#website {
    grid-area: website;
}