.max-width {
  width: 100%;
}
.width-auto {
  width: auto;
}

// widths
@for $i from 1 through 30 {
  .width-#{$i} {
    width: ($spacer * $i) !important;
  }
}

@for $i from 1 through 30 {
  .max-width-#{$i} {
    max-width: ($spacer * $i) !important;
    flex-grow: 1;
  }
}

@for $i from 1 through 30 {
  .min-width-#{$i} {
    min-width: ($spacer * $i) !important;
  }
}

@for $i from 1 through 30 {
  .offset-width-#{$i} {
    margin-left: ($spacer * $i) !important;
  }
}