Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----

$base-font-size: 16px;

@function em($px, $base: $base-font-size) {
	@return ($px / $base) + 0em;
}

$breakpoints: (
  600: em(600px),
  760: em(760px),
  1000: em(1000px),
  1200: em(1200px)
);

@mixin bp($breakpoint, $min-or-max: min-width) {
  @if map-has-key($breakpoints, $breakpoint) {
    @media screen and ($min-or-max: #{map-get($breakpoints, $breakpoint)}) {
      @content;
    }
  } @else {
    @warn "No variable '#{$breakpoint}' in $breakpoints map";
  }
}

.selector {
  @include bp(600) {
    color: red;
  }
  
  @include bp(1200, max-width) {
    color: blue;
  }
}

SassMeister-output.css

@media screen and (min-width: 37.5em) {
  .selector {
    color: red;
  }
}
@media screen and (max-width: 75em) {
  .selector {
    color: blue;
  }
}