.header {
    grid-area: header;
}

.video {
    grid-area: video;
}

.macaw {
    grid-area: macaw;
}

.bob {
    grid-area: bob;
}

.movies {
    grid-area: movies;
}

.location {
    grid-area: location;
}

.logo {
    grid-area: logo;
}

.poem {
    grid-area: poem;
}

.grid-container {
    display: grid;
    grid-template-areas:
        'header header header'
        'video macaw bob'
        'movies location location'
        'movies poem poem'
        'logo poem poem';
    gap: 1px;
    /* background-color: #2196F3; */
    background-color: black;
    padding: 1px;
    grid-template-columns: 33% 34% 33%;
    grid-template-rows: auto 20% 30% 5% 20%;
}

.grid-container div {
    background-color: white;
    text-align: center;
    padding: 20px 0px;
    font-size: 30px;

}