place media query inside of class for better extending

lib/templates/less.mustache

@@ -28,14 +28,12 @@
 {{#sprite}}
 {{class}} {
   background-image: url('{{{escaped_image}}}');
-}
-
-{{/sprite}}
-{{#retina}}
-@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
-  {{class}} {
+  {{#retina}}
+  @media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
     background-image: url('{{{escaped_image}}}');
     background-size: {{px.total_width}} {{px.total_height}};
   }
+  {{/retina}}
 }
-{{/retina}}
+
+{{/sprite}}