Испытание 27/32. Вроде норм вышло.

Курсы §15. Сетки
1 
<div class="header">
  <div class="container">
    <div class="header-content">Header</div>
  </div>
</div>

<div class="menu">
  <div class="container">
    Menu
  </div>
</div>

<div class="promo-block">
  <div class="container clearfix">
    <div class="promo promo1">Promo 1</div>
    <div class="promo promo2">Promo 2</div>
  </div>
</div>

<div class="content-block">
  <div class="container clearfix">
    <div class="column left">Left</div>
    <div class="column main">Main</div>
    <div class="column right">Right</div>
  </div>
</div>

<div class="footer">
  <div class="container">
    Footer
  </div>
</div>

html,
body {
  margin: 0;
  padding: 0;
}

body {
  width: 450px;
  height: 335px;

  font-size: 10px;
  font-family: "Arial", sans-serif;
  color: white;
}

.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

.container {
  width: 350px;
  margin: 0 auto;
  padding: 10px 0;
}

.header { background-color: #34495e; }

.header-content {
  background-color: #c0392b; 
  padding: 5px;
  min-height: 25px;
}

.menu {
  min-height: 35px;
  background-color: #3498db;
}

.menu .container {
  width: 340px;
  padding: 5px;
}

.promo-block { background-color: #34495e; }

.promo {
  float:left;
  width: 160px;
  padding: 5px;
  min-height: 50px;
  background-color: #c0392b;
}

.promo2 { float: right; }

.content-block {background-color: #fff;}

.column {
  float: left;
  width: 60px;
  margin-right: 10px;
  padding: 5px;
  min-height: 100px;
  background-color: #3498db;
}

.main {
  width: 180px;  
}

.right { margin-right: 0;}

.footer {
  min-height: 35px;
  background-color: #34495e;
}

.footer .container {
  width: 340px;
  padding: 5px;
}

Не стал заморачиваться с объединением селекторов с похожими свойствами через запятую.
Поначалу хотел задать темно-синий background-color на body, так бы меньше вложенности было и проверку тоже проходит, но сделал как на макете.