Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.2.19)
// Compass (v0.12.6)
// ----

$mediaqueries-support: true !default;

// Predefined Break-points
$desktop: 1260px !default;
$tablet: 960px !default;
$phone: 480px !default;

@function translate-media-condition($c) {
  $condMap: (
            "screen": "only screen",
            "print": "only print",
            "retina": "(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-device-pixel-ratio: 1.5), (min-resolution: 120dpi)",
            ">desktop": "(min-width: #{$desktop + 1})",
            "<desktop": "(max-width: #{$desktop})", 		
            ">tablet": "(min-width: #{$tablet + 1})",
            "<tablet": "(max-width: #{$tablet})",
            ">phone": "(min-width: #{$phone + 1})",
            "<phone": "(max-width: #{$phone})",
	);
  @return map-get( $condMap, $c );
}

// The media mixin
@mixin media($args...) {
    @if ($mediaqueries-support) {
        $query: "";
        @each $arg in $args {
          $op: "";
          @if ( $query != "" ) {
            $op: " and ";
          }
          $query: $query + $op + translate-media-condition($arg);
        }
        @media #{$query} {
            @content;
        }
    }
}

SassMeister-output.css

Invalid CSS after "...       "screen"": expected ")", was ": "only screen","