@media query support

index.js

@@ -286,7 +286,7 @@
             errorMsg = "[_parseSelector] Expected {, }, ; or :, " +
                        "instead found " + next;
 
-        if (selector.indexOf("@keyframes") > -1) {
+        if(selector.match(/@(-\w+-)*keyframes/) !== null || selector.indexOf("@media") > -1) {
           this.keyframes = true;
           this.nesting = 0;
         }
@@ -305,7 +305,6 @@
         }
         } else if (next === ';' || next === '}') {
           // Otherwise, this is a parse error; we should have seen `{` instead.
-          console.log("X");
           throw new ParseError("MISSING_CSS_BLOCK_OPENER", this, selectorStart, selectorEnd, selector);
         } else {
           // We get here if an unexpected character was found.

test.js

@@ -61,3 +61,33 @@ s2 = "@keyframes spin {\
 ";
 
 test();
+
+s1 = ".hero-section .illustration {\
+  width: 60%;\
+  display: inline-block;\
+  margin: 20px 0;\
+  position: relative;\
+}\
+@media (min-width: 1020px) {\
+  .hero-section .illustration {\
+    margin: 80px 40px 0 0;\
+    width: 40%;\
+  }\
+}\
+";
+
+s2 = ".hero-section .illustration {\
+  width: 60%;\
+  display: inline-block;\
+  margin: 20px 0;\
+  position: relative;\
+}\
+@media (min-width: 1020px) {\
+  .hero-section .illustration {\
+    margin: 80px 0 0 40px;\
+    width: 40%;\
+  }\
+}\
+";
+
+test();