@mixin generate-media-above ($size) {
  @if map-has-key ($screen-sizes, $size) {
    $size: map-get($screen-sizes, $size);
    @media(min-width: $size) {
      @content;
    }
  }
}

@mixin generate-media-below ($size) {
  @if map-has-key ($screen-sizes, $size) {
    $size: map-get($screen-sizes, $size);
    @media(max-width: ($size - 1)) {
      @content;
    }
  }
}