.grid-container {
    display: grid;
    grid-template-areas:
        "header header header"
        "youtube youtube map"
        "poem poem person"
        "poem poem movies"
        "flag meme movies";
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(5, 1fr);
}

div {
    border:1px solid black;
    text-align: center;
}
.item1 { 
    grid-area: header; 
    grid-column: 1 / span 3;
    grid-row: 1 / span 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: lightblue; 
}
.item2 { 
    grid-area: youtube; 
    grid-column: 1 / span 2;
    grid-row: 2 / span 1;
    background-color: lightgreen; 
}
.item3 { 
    grid-area: map; 
    grid-column: 3 / span 1;
    grid-row: 2 / span 1;
    background-color: lightcoral; 
}
.item4 { 
    grid-area: poem; 
    grid-column: 1 / span 2;
    grid-row: 3 / span 2;
    background-color: lightgoldenrodyellow; 
}
.item5 { 
    grid-area: person; 
    grid-column: 3 / span 1;
    grid-row: 3 / span 1;
    background-color: lightpink; 
}
.item6 { 
    grid-area: movies; 
    grid-column: 3 / span 1;
    grid-row: 4 / span 2;
    background-color: lightgray; 
}
.item7 { 
    grid-area: flag; 
    grid-column: 1 / span 1;
    grid-row: 5 / span 1;
    background-color: lightseagreen; 
}
.item8 { 
    grid-area: meme; 
    grid-column: 2 / span 1;
    grid-row: 5 / span 1;
    background-color: lightsteelblue; 
}
li {
    padding: 10px;
}
p {
    white-space: 10px;
}