How to use

.c-component-name { // Setting a min (mobile first) @include bolt-mq(xsmall) { background-color: red; } // Setting a max (desktop first) @include bolt-mq($until: xsmall) { background-color: blue; } // Setting a range (adaptive) @include bolt-mq($from: medium, $until: xlarge) { background-color: yellow; } // Setting orientation or other media queries @include bolt-mq($from: xlarge, $until: xxxlarge, $and: '(orientation: portrait)') { background-color: green; } }