$l-device: 1200px;
$m-device: 760px;
$s-device: 480px;

@mixin d($size) {
  @if $size == l {
    @media screen and (min-width: $l-device) {
      @content;
    }
  }
  @else if $size == m {
    @media screen and (min-width: $m-device) and (max-width: $l-device - 1) {
      @content;
    }
  }
  @else if $size == s {
    @media screen and (max-width: $s-device - 1) {
      @content;
    }
  }
}

expected - CSS

$l-device: 1200px; $m-device: 760px; $s-device: 480px; @mixin d($size) { @if $size == l { @media screen and (min-width: $l-device) { @content; } } @else if $size == m { @media screen and...