Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

$breakpoints-initialized: (papa-bear: false, mama-bear: false, baby-bear: false);
$breakpoints: (papa-bear: 1600px, mama-bear: 1250px, baby-bear: 650px);

@mixin initialize-breakpoint($point) {
  @if not map-get($breakpoints-initialized, $point) {
    $breakpoints-initialized: map-merge($breakpoints-initialized, ($point: true)) !global;
    @at-root {
      %#{$point}-column {
        float: left;
      }
      %#{$point}-first {
        clear: left;
      }
    }
  }
}

@mixin breakpoint($point) {
  $bp: map-get($breakpoints, $point);
  @if $bp {
    @media (max-width: $bp) { @include initialize-breakpoint($point); @content; }
  } @else {
    @warn "No porridge for you!"
  }
}

.whatever {
  @include breakpoint(papa-bear) {
    @extend %papa-bear-column;
    border-width: 5px;
  }
}
.something-else {
  //@include breakpoint(papa-bear) {
    @extend %papa-bear-column;
    @extend %papa-bear-first;
    border-width: 10px;
  //}
}





// Computes the "brightness" of a color
//
// Brightness is similiar to lightness in HSL but more closely approximates
// how humans perceive the intensity of the different RGB components of
// a color. Brightness is sometimes called luminance.
//
// Returns a number between 0% and 100%, where 100% is fully bright
// (white) and 0% is fully dark (black).
@function brightness($color) {
  @return ((red($color) * .299) + (green($color) * .587) + (blue($color) * .114)) / 255 * 100%;
}

$contrasted-dark-default:   #000 !default;
$contrasted-light-default:  #fff !default;

// Returns either the `$light` or `$dark` color
// by deciding which contrasts more with `$color`.
//
// E.g. This can be used to select the more readable foreground color
// for a given background color.
//
// `$dark` defaults to black and `$light` defaults to white.
//
// When `$color` is `null`, this function returns `null`.
@function contrast-color( $color, $dark: $contrasted-dark-default, $light: $contrasted-light-default) {
  @if $color == null { @return null; }
  @else {
    $color-brightness: brightness($color);
    $dark-text-brightness: brightness($dark);
    $light-text-brightness: brightness($light);
    @return if(abs($color-brightness - $light-text-brightness) > abs($color-brightness - $dark-text-brightness), $light, $dark);
  }
}

// Sets the specified background color and calculates a dark or light
// contrasted text color.  The arguments are passed through to the
// [contrast-color function](#function-contrast-color).
@mixin contrasted( $background-color, $dark: $contrasted-dark-default, $light: $contrasted-light-default) {
  background-color: $background-color;
  color: contrast-color($background-color, $dark, $light);
}

.color { color:contrast-color(brown);}







    $breakpoints:(
        mobile : 0 480,
        tablet : 481 768,
        desktop: 769 0 
    );

    @mixin media(){
        
    }
    
    .foo{ bar:doh;}

SassMeister-output.css

@media (max-width: 1600px) { .whatever { border-width: 5px; }
  .whatever, .something-else { float: left; }
  .something-else { clear: left; } }

.something-else { border-width: 10px; }

.color { color: white; }

.foo { bar: doh; }