@mixin xs-max {
    @media only screen and (max-width: 380px) {
        @content;
    }
}

@mixin sm-max {
    @media only screen and (max-width: 640px) {
        @content;
    }
}

@mixin md-max {
    @media only screen and (max-width: 768px) {
        @content;
    }
}

@mixin lg-max {
    @media only screen and (max-width: 1024px) {
        @content;
    }
}

@mixin xl-max {
    @media only screen and (max-width: 1280px) {
        @content;
    }
}

@mixin xxl-max {
    @media only screen and (max-width: 1600px) {
        @content;
    }
}




@mixin xs-min {
    @media only screen and (min-width: 380px) {
        @content;
    }
}

@mixin sm-min {
    @media only screen and (min-width: 640px) {
        @content;
    }
}

@mixin md-min {
    @media only screen and (min-width: 768px) {
        @content;
    }
}

@mixin lg-min {
    @media only screen and (min-width: 1024px) {
        @content;
    }
}

@mixin xl-min {
    @media only screen and (min-width: 1280px) {
        @content;
    }
}

@mixin portrait {
    @media (orientation: portrait) {
        @content;
    }
}
@mixin landscape {
    @media (orientation: landscape) {
        @content;
    }
}