/* ==========================================================================
   =Layout
   ========================================================================== */
.grid {
  margin: 0;
}
.gu {
  display: block;
  float: left;
  width: 100%;
  padding: 0 0.875em;
}

/* fixed columns for no media query support */
.gu-2 { width: 50%; }
.gu-3 { width: 33.33333%; }
.gu-4 { width: 25%; }
.gu-5 { width: 20%; }
.gu-6 { width: 16.66666%; }

/* fixed fractions for no media query support */
.gu-1-1 { width: 100%; }
.gu-1-2 { width: 50%; }
.gu-1-3 { width: 33%; }
.gu-2-3 { width: 66%; }
.gu-1-4 { width: 25%; }
.gu-3-4 { width: 75%; }
.gu-1-5 { width: 20%; }
.gu-2-5 { width: 40%; }
.gu-3-5 { width: 60%; }
.gu-4-5 { width: 80%; }