[fix bug 1124570] Remove delay showing home promo's for smaller screens

Author: alexgibson

media/css/mozorg/home/home-promo.less

@@ -58,7 +58,6 @@
         color: #fff;
         overflow: hidden;
         opacity: 1;
-        .transition(opacity .3s ease-in-out);
     }
 
     #promo-1 {
@@ -142,18 +141,6 @@
     }
 }
 
-.js {
-    .promo-grid {
-        .item {
-            opacity: 0;
-        }
-
-        &.reveal .item {
-            opacity: 1;
-        }
-    }
-}
-
 .promo-large-landscape,
 .promo-large-portrait {
     z-index: 0;
@@ -1563,6 +1550,19 @@ html[lang|="en"] {
  */
 @media only screen and (min-width: (@widthSquareGrid_6)) {
 
+    .js {
+        .promo-grid {
+            .item {
+                opacity: 0;
+                .transition(opacity .3s ease-in-out);
+            }
+
+            &.reveal .item {
+                opacity: 1;
+            }
+        }
+    }
+
     .promo-grid.stagger .item {
 
         &:first-child {