SOURCE

  <div class="d1 flex-container">
    <div class="flex-item">1</div>
    <div class="flex-item">2</div>
    <div class="flex-item">3</div>
  </div>
  <div class="d2 flex-container">
    <div class="flex-item">4</div>
    <div class="flex-item">5</div>
    <div class="flex-item">6</div>
  </div>

.d1.flex-container{
  width: 100%;
  display: flex;
  flex-direction: row;
  text-align: center;
}
.d1 .flex-item{
  flex: 1;
}
.d2.flex-container{
  margin-top: 20px;
  height: 60px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.d2 .flex-item {
  width: 20%;
  color: #fff;
  text-align: center;
}
.d2 .flex-item:nth-child(1){
  background-color: red;
}
.d2 .flex-item:nth-child(2){
  background-color: green;
}
.d2 .flex-item:nth-child(3){
  background-color: blue;
}