Media query mixin

gistfile1.scss

$on-wide:            'screen and (min-width: 1600px)';
$off-wide:           'screen and (max-width: 1599px)';
$on-desktop:         'screen and (min-width: 850px)';
$off-desktop:        'screen and (max-width: 849px)';
$on-medium:          'screen and (max-width: 600px)';
$off-medium:         'screen and (min-width: 600px)';
$on-mobile:          'screen and (max-width: 480px)';
$off-mobile:         'screen and (min-width: 481px)';
$on-portrait:        'screen and (max-width: 400px)';
$on-retina:          '(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)';
$on-ipad:            '(device-width: 768px) and (device-height: 1024px)';

@mixin media-query($queries...) {
  @media #{$queries} {
    @content;
  }
}

// Usage:
@include media-query($on-ipad, $off-desktop) {
  // do stuff...
}