/* ---- grid ---- */

.grid {
  background: #FEDD00;
  max-width: 1200px;
}

/* clearfix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- grid-item ---- */

.grid-item {
  background: #FEDD00;
  border: 4px solid #FEDD00;
  box-sizing: border-box;
  float: left;
  width: 33.33%;
}
.grid-item-width2 { width: 50%; }
.grid-item--width3 { width: 520px; }
.grid-item--width4 { width: 780px; }

.grid-item--height2 { height: 200px; }
.grid-item--height3 { height: 260px; }
.grid-item--height4 { height: 360px; }