// ==========================================================================
// SCSS Mixins
// ==========================================================================

// Min width media queries
@mixin min-breakpoint($point) {
    @if $point == xx-large {
        @media (min-width: 1920px) { @content; }
    }
    @else if $point == x-large {
        @media (min-width: 1440px) { @content; }
    }
    @else if $point == large {
        @media (min-width: 1024px) { @content; }
    }
    @else if $point == medium {
        @media (min-width: 980px) { @content; }
    }
    @else if $point == small {
        @media (min-width: 768px) { @content; }
    }
    @else if $point == 600 {
        @media (min-width: 600px) { @content; }
    }
    @else if $point == x-small {
        @media (min-width: 480px)  { @content; }
    }
    @else if $point == xx-small {
        @media (min-width: 360px)  { @content; }
    }
    @else if $point == xxx-small {
        @media (min-width: 320px)  { @content; }
    }
}

// Max width media queries
@mixin max-breakpoint($point) {
    @if $point == xx-large {
        @media (max-width: 1919px) { @content; }
    }
    @else if $point == x-large {
        @media (max-width: 1439px) { @content; }
    }
    @else if $point == large {
        @media (max-width: 1023px) { @content; }
    }
    @else if $point == medium {
        @media (max-width: 979px) { @content; }
    }
    @else if $point == 600 {
        @media (max-width: 599px) { @content; }
    }
    @else if $point == small {
        @media (max-width: 767px) { @content; }
    }
    @else if $point == x-small {
        @media (max-width: 479px)  { @content; }
    }
    @else if $point == xx-small {
        @media (max-width: 359px)  { @content; }
    }
    @else if $point == xxx-small {
        @media (max-width: 319px)  { @content; }
    }
}
