@each $breakpoint, $px in $breakpoints-min {
  @media (min-width: map-get($breakpoints-min, #{$breakpoint})) {
    .#{$breakpoint}\:center {
      text-align: center;
    }
    .#{$breakpoint}\:justify {
      text-align: justify;
    }
    .#{$breakpoint}\:left {
      text-align: left;
    }
    .#{$breakpoint}\:right {
      text-align: right;
    }
  }
}

@each $breakpoint, $px in $breakpoints-min {
  @media (min-width: map-get($breakpoints-min, #{$breakpoint})) {
    .#{$breakpoint}\:baseline {
      vertical-align: baseline;
    }
    .#{$breakpoint}\:bottom {
      vertical-align: bottom;
    }
    .#{$breakpoint}\:middle {
      vertical-align: middle;
    }
    .#{$breakpoint}\:top {
      vertical-align: top;
    }
  }
}