.container {
  display: grid;
  width: 160px;
  height: 160px;
  grid-template-columns: repeat(8, 20px);
  grid-template-rows: repeat(8, 20px);
  grid-template-areas: 
    '. bod1 bod2 . . bod3 bod4 .'
    'bod5 . . bod6 bod7 . . bod8'
    'bod9 . . . . . . bod10'
    '. bod11 . . . . bod12 .'
    '. . bod13 . . bod14 . .'
    '. . . bod15 bod16 . . .';
}

.container > div {
  background-color: #f00;
}
.container > div:nth-child(1) {
  grid-area: bod1;
}
.container > div:nth-child(2) {
  grid-area: bod2;
}
.container > div:nth-child(3) {
  grid-area: bod3;
}
.container > div:nth-child(4) {
  grid-area: bod4;
}
.container > div:nth-child(5) {
  grid-area: bod5;
}
.container > div:nth-child(6) {
  grid-area: bod6;
}
.container > div:nth-child(7) {
  grid-area: bod7;
}
.container > div:nth-child(8) {
  grid-area: bod8;
}
.container > div:nth-child(9) {
  grid-area: bod9;
}
.container > div:nth-child(10) {
  grid-area: bod10;
}
.container > div:nth-child(11) {
  grid-area: bod11;
}
.container > div:nth-child(12) {
  grid-area: bod12;
}
.container > div:nth-child(13) {
  grid-area: bod13;
}
.container > div:nth-child(14) {
  grid-area: bod14;
}
.container > div:nth-child(15) {
  grid-area: bod15;
}
.container > div:nth-child(16) {
  grid-area: bod16;
}