@sml-bp: 480px; @med-bp: 720px; @lrg-bp: 970px; .phablet(@rules) { @media screen and (min-width: @sml-bp) { @rules(); } }; .tablet(@rules) { @media screen and (min-width: @med-bp) { @rules(); } }; .desktop(@rules) { @media screen and (min-width: @lrg-bp) { @rules(); } .no-mq & { @rules(); } }; body { background: black; } .phablet ({ body { background: blue; } }); .tablet({ body { background: red; } }); .desktop ({ body { background: yellow; } }); .my-class { color: #FFF; .tablet({ color: #000; }); .desktop({ color: red; }); }