/* Mini-grid */

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

.grid > .col {
  display: block;
  float:left;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.grid.grid-2 > .col {
  width: 50%;
}

.grid.grid-3 > .col {
  width: 33.333%;
}

.grid.grid-3 > .col.x2 {
  width: 66.666%;
}

.grid.grid-4 > .col {
  width: 25%;
}

.grid.grid-4 > .col.x2 {
  width: 50%;
}

.grid.grid-4 > .col.x3 {
  width: 75%;
}

.grid.grid-5 > .col {
  width: 20%;
}

.grid.grid-5 > .col.x2 {
  width: 40%;
}

.grid.grid-5 > .col.x3 {
  width: 60%;
}

.grid.grid-5 > .col.x4 {
  width: 80%;
}

.grid.grid-2 > .col:nth-child(2n+2),
.grid.grid-3 > .col:nth-child(3n+3),
.grid.grid-4 > .col:nth-child(4n+4),
.grid.grid-5 > .col:nth-child(5n+5) {
  clear: right;
}

.grid.grid-2 > .col:nth-child(2n+3),
.grid.grid-3 > .col:nth-child(3n+4),
.grid.grid-4 > .col:nth-child(4n+5),
.grid.grid-5 > .col:nth-child(5n+6) {
  clear: left;
}