// Media Queries.
$retina                 : "only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx)";

$mobile                 : "only screen and (min-device-width : 320px) and (max-device-width : 767px)";
$mobile-portrait        : "only screen and (max-width: 509px) and (min-device-width: 1024px), (max-device-width: 480px) and (orientation: portrait)";
$mobile-landscape       : "only screen and (max-width: 509px) and (min-device-width: 1024px), (max-device-width: 480px) and (orientation: landscape)";

$tablet                 : "only screen and (min-device-width : 768px) and (max-device-width : 1024px), (min-width: 768px) and (max-width: 1200px)";
$tablet-portrait        : "only screen and (max-device-width: 1024px) and (min-device-width: 480px) and (orientation: portrait)";
$tablet-landscape       : "only screen and (max-device-width: 1024px) and (min-device-width: 480px) and (orientation: landscape)";

$desktop                : "only screen and (min-width: 1200px)";
$desktop-mdm            : "only screen and (min-width: 1400px)";
$desktop-fhd            : "only screen and (min-width: 1800px)";
$desktop-whd            : "only screen and (min-width: 2500px)";
$desktop-qhd            : "only screen and (min-width: 3400px)";
$desktop-uhd            : "only screen and (min-width: 3800px)";

// CREATING BREAKPOINT MIXINS
@mixin retina {
    @include media($retina) {
        @content;
    }
}

@mixin mobile {
    @include media($mobile) {
        @content;
    }
}

@mixin mobile-landscape {
    @include media($mobile-landscape) {
        @content;
    }
}

@mixin mobile-portrait {
    @include media($mobile-portrait) {
        @content;
    }
}

@mixin tablet {
    @include media($tablet) {
        @content;
    }
}

@mixin tablet-landscape {
    @include media($tablet-landscape) {
        @content;
    }
}

@mixin tablet-portrait {
    @include media($tablet-portrait) {
        @content;
    }
}

@mixin desktop {
    @include media($desktop) {
        @content;
    }
}

@mixin desktop-mdm {
    @include media($desktop-mdm) {
        @content;
    }
}

@mixin desktop-fhd {
    @include media($desktop-fhd) {
        @content;
    }
}

@mixin desktop-qhd {
    @include media($desktop-qhd) {
        @content;
    }
}

@mixin desktop-whd {
    @include media($desktop-whd) {
        @content;
    }
}

@mixin desktop-uhd {
    @include media($desktop-uhd) {
        @content;
    }
}