// Small devices (landscape phones, 576px and up)
@include media-breakpoint-up(sm) {

}

// Medium devices (tablets, 768px and up)
@include media-breakpoint-up(md) { 

}

// Large devices (desktops, 992px and up)
@include media-breakpoint-up(lg) {

}

// X-Large devices (large desktops, 1200px and up)
@include media-breakpoint-up(xl) {

}

// XX-Large devices (larger desktops, 1400px and up)
@include media-breakpoint-up(xxl) {

}

// Occasionally use media queries that go in the other direction
@include media-breakpoint-down(sm) {}
@include media-breakpoint-down(md) {}
@include media-breakpoint-down(lg) {}
@include media-breakpoint-down(xl) {}
@include media-breakpoint-down(xxl) {}