@mixin breakpoint($point) {
  $x-large: "(min-width: 1200px)";
  $large: "(min-width: 1080px) and (max-width: 1199px)";
  $medium: "(min-width: 768px) and (max-width: 1079px)";
  $medium-up: "(min-width: 768px)";
  $medium-down: "(max-width: 1199px)";
  $small: "(max-width: 767px)";
  $x-small: "(max-width: 480px)";

  @if $point == x-large {
    @media #{$x-large} { @content; }
  }
  @else if $point == large {
    @media #{$large} { @content; }
  }
  @else if $point == medium {
    @media #{$medium} { @content; }
  }
  @else if $point == not-small {
    @media #{$not-small} { @content; }
  }
  @else if $point == medium-up {
    @media #{$medium-up} { @content; }
  }
  @else if $point == medium-down {
    @media #{$medium-down} { @content; }
  }
  @else if $point == small {
    @media #{$small} { @content; }
  }
  @else if $point == x-small {
    @media #{$x-small} { @content; }
  }
}
