#container{
    display: grid;
    grid-template-areas: 
        "heading heading heading"
        "list video video"
        "list coords meme"
        "poem poem flag"
        "poem poem bobross";
    grid-auto-rows: 160px;
    grid-template-columns: 33% 33% 33%;
    gap: 8px;
}

.heading{
    display: flex;
    grid-area: heading;
    justify-content: center;
    align-items: center;
    background-color: lightpink;
}

.list{
    display: flex;
    grid-area: list;
    align-items: center;
    justify-content: center;
    background-color: lightblue;
}

.video{
    display: flex;
    grid-area: video;
    background-color: lightgrey;
    justify-content: center;
}



.coords{
    display: flex;
    grid-area: coords;
    background-color: lavender;
}


.meme{
    display: flex;
    grid-area:meme;
    background-color: lightgoldenrodyellow;
}


.poem{
    display: flex;
    grid-area: poem;
    justify-content: center;
    align-items: center;
    background-color: goldenrod;
    font-size: larger;
}

.flag{
    display: flex;
    grid-area: flag;
    justify-content: center;
    background-color: lightgreen;
    margin: 0;
}

.bobross{
    display: flex;
    grid-area: bobross;
    background-color: lightcoral;
    justify-content: center;

}

figure{
    display: flex;
    margin: 0px;   
    justify-content: space-evenly;
    align-items: center;
}

figure img{
    height: 90%;
}