// ============================================================================= // Mixins // =============================================================================

// Handling breakpoints for media queries // @param {Number} $val the media query specification.

@mixin breakpoint($val) {

@if $val == extra-small {
  @media all and (max-width: 415px) {
    @content;
  }
} @else if $val == small {
  @media all and (max-width: 767px) {
    @content;
  }
} @else if $val == medium {
  @media all and (max-width: 1024px) {
    @content;
  }
} @else if $val == large {
  @media all and (max-width: 1223px) {
    @content;
  }
} @else {
  @warn "The parameter #{$val} is not valid";
}

}