stylus.styl

respond-below($width)
  media = 'all and (max-width: %s)' % $width
  @media media
    {block}


respond-above($width)
  media = 'all and (min-width: %s)' % $width
  @media media
    {block}

respond-between($min-width, $max-width) {
  $max-width = $max-width - 1;
  media = 'all and (min-width: %s) and (max-width: %s)' % ($min-width $max-width);
  @media media {
    {block}
  }
}

usage.styl

$xs-screen = 480px;
$sm-screen = 768px;
$md-screen = 1024px; // 992 bs-native
$lg-screen = 1200px;
$xl-screen = 1440px;

.sm-hidden {
  +respond-below($sm-screen) {
      display: none !important;
  }
}