.u-hidden {
  display: none;

  @each $name, $width in $breakpoints {
    &\@#{$name}-down {
      @media (max-width: $width) {
        display: none;
      }
    }

    &\@#{$name}-up {
      @media (min-width: $width + 1) {
        display: none;
      }
    }
  }
}