@each $breakpoint in map-keys($grid-breakpoints) {
  $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
  @include media-breakpoint-up($breakpoint) {
    .rotate#{$infix}-0 {
      transform: rotate(0deg);
    }
    .rotate#{$infix}-45 {
      transform: rotate(45deg);
    }
    .rotate#{$infix}-90 {
      transform: rotate(90deg);
    }
    .rotate#{$infix}-135 {
      transform: rotate(135deg);
    }
    .rotate#{$infix}-180 {
      transform: rotate(180deg);
    }
    .rotate#{$infix}-225 {
      transform: rotate(225deg);
    }
    .rotate#{$infix}-270 {
      transform: rotate(270deg);
    }
    .rotate#{$infix}-315 {
      transform: rotate(315deg);
    }
    .rotate#{$infix}-0, .rotate#{$infix}-45, .rotate#{$infix}-90, .rotate#{$infix}-135, .rotate#{$infix}-180, .rotate#{$infix}-225, .rotate#{$infix}-270, .rotate#{$infix}-315 {
      transition: transform 0.5s ease;
    }
  }
}