Edit in JSFiddle

<div class="c1"></div>
<div class="c2"></div>
<div class="c1"></div>
<div class="c1 last"></div>

<div class="c3 r2"></div>
<div class="c2 r2 last"></div>

<div class="c1"></div>
<div class="c1"></div>
<div class="c2"></div>
<div class="c1 last"></div>
body {
  width: 978px;
  margin: 0 auto;
  background: #ddd;
  height: 810px;
}
.c1, .c2, .c3, .c4, .c5 {
  height: 175px;
  float: left;
  margin: 20px 20px 0 0;
  background: #c33;
  padding: 10px;
  
  -moz-box-sizing: border-box; 
  -webkit-box-sizing: border-box; 
  box-sizing: border-box;
}
.r1, .r2, .r3, .r4, .r5 {
  width: 175px;
  float: left;
  margin: 20px 20px 0 0;
}
.last {
  margin-right: 0;
}
.c1 { width: 179px; }
.c2 { width: 378px; }
.c3 { width: 577px; }
.c4 { width: 776px; }
.c5 { width: 975px; }

.r1 { height: 182px; }
.r2 { height: 383px; }
.r3 { height: 585px; }