.nut-col {
  float: left;
  box-sizing: border-box;
  word-break: break-all;

  &-gutter {
    &:last-child {
      padding-right: 0 !important;
    }
    &:first-child {
      padding-left: 0 !important;
    }
  }
}

@for $i from 1 through 24 {
  .nut-col-offset-#{$i} {
    margin-left: 100/ 24 * $i * 1%;
  }

  .nut-col-#{$i} {
    width: 100/ 24 * $i * 1%;
  }
}