.grid-container {
    display: grid;
    grid-template-columns: auto auto auto auto auto auto;
    width: 800px;
    margin:auto;
    background-color: black;
    padding: 2px;
    grid-gap: 2px;

}

.item1 {
    grid-area: 1 / 1 / span 1 / span 6;
    background-color: gray;
    text-align: center;
    color: white;
}

.item2 {
    grid-area: 2 / 1 / span 1 / span 6;
    background-color: darkgray;
}

.item3 {
    grid-area: 3 / 1 / span 1 / span 2;
    background-color: lightgray;
}

.item4 {
    grid-area: 3 / 3 / span 1 / span 2;
    background-color: lightgray;
}

.item5 {
    grid-area: 3 / 5 / span 1 / span 2;
    background-color: lightgray;
}

.item6 {
    grid-area: 4 / 1 / span 1 / span 6;
    background-color: darkgray;
}

.item7 {
    grid-area: 5 / 1 / span 1 / span 3;
    background-color: lightgray;
}

.item8 {
    grid-area: 5 / 4 / span 1 / span 3;
    background-color: lightgray;
}

.item9 {
    grid-area: 6 / 1 / span 1 / span 6;
    background-color: gray;
    text-align: center;
    height: 50px;
    padding-top: 15px;
}

.bigtext {
    font-size: 40px;
}

img {
    width: 100px;
}