gistfile1.scss

$sz: 12;
$box-margin: 1/80 * 100%;
$number-boxes: 12;
$base-box-width: 7 / 120 * 100%;

.row {
  &:before,
  &:after {
    content: " ";
    display: table;
  }
  &:after {
    clear: both;
  }
}

.box {
    display: inline-block;
    background-color: $color-light-grey;
    text-align: center;
    float: left;

    margin-left: $box-margin;
    margin-right: $box-margin;
}

@media (max-width: 600px) {
    .box {
        margin-bottom: 5px;
        display: block;
        float: none;
    }
}

@for $i from 1 through $sz {
  .box.col-#{$i} {
    width: $base-box-width * $i + $box-margin * 2 * ($i - 1);
  }
}