<div class="wrapper">
  <div class="a a1">1</div>
  <div class="a a2">2</div>
  
  <div class="a a3">3</div>
  <div class="a a4">4</div>
  <div class="a a5">5</div>
</div>

.a1 {
  background: #00ff00;
}
.a2 {
  background: #f0f0f0;
}
.a3 {
  background: #f0ff0f;
}
.a4 {
  background: #00fff0;
}
.a5 {
  background: #0ff00f;
}

.wrapper {
  text-align: center;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 100px;
  grid-gap: 20px;
}
.a1 {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 2;
}