// Helper classes.
@each $property in (border, margin, padding) {
  @each $direction in ('', -left, -right, -top, -bottom) {
    .#{$property}#{$direction} {
      @if $property == border {
        #{$property}#{$direction}: 1px solid $gray-lighter;
      }
      @else {
        #{$property}#{$direction}: 1em;
      }
      @if $direction == -top {
        &:not(.no-first):first-of-type {
          #{$property}#{$direction}: 0;
        }
      }
      @else if $direction == -bottom {
        &:not(.no-last):last-of-type {
          #{$property}#{$direction}: 0;
        }
      }
    }
    .no-#{$property}#{$direction} {
      #{$property}#{$direction}: 0;
      &.important {
        #{$property}#{$direction}: 0 !important;
      }
    }
  }
}