.grid-container {
    display: grid;
    grid-template-columns: auto auto auto auto auto auto;
    text-align: left;
   border: black 2px solid;
    place-self: center;
    grid-template-areas: 
    "header header header header header header"
    "två två två två två två"
    "left left main main right right"
    "middle middle middle middle middle middle"
    "lef lef lef rig rig rig"
    "floor floor floor floor floor floor"

    ;
    width: 800px;
    

    

} 
body {
    text-align: center;
}

.item1 {grid-area: header;
    background-color: rgb(119, 118, 118);
    text-align: center;
    color: white;
}

.item2 {grid-area: två;
    background-color: rgb(175, 175, 175);
}

.item3 {grid-area: left;
    background-color: lightgray;
}

.item4 {grid-area: main;
    background-color: lightgray;
}

.item5 {grid-area: right;
    background-color: lightgray;
}

.item6 {grid-area:middle ;
    background-color: rgb(173, 173, 173);
}


.item7 {grid-area: lef ;
    background-color: lightgray;
}


.item8 {grid-area: rig;
    background-color: lightgray;
}

.item9 {grid-area: floor;
    text-align: center;
    background-color: gray;

}

.span {
    font-size: 48px ;
}







h4, h5, h2, h3 {
    margin: 0px;
    padding: 0px;
}

.grid-container > div {
border: black 2px solid;


}