$break-lg: 1200px;
$break-md: 900px;
$break-sm: 600px;

@mixin above-mobile {
  @media only screen and (min-width: $break-sm) {
    @content;
  }
}

@mixin mobile {
  @media only screen and (max-width: 599px) {
    @content;
  }
}

@mixin tablet-up {
  @media only screen and (min-width: $break-md) {
    @content;
  }
}

@mixin desktop-up {
  @media only screen and (max-width: $break-lg) {
    @content;
  }
}