firefox flexbox fix

_src/_assets/styl/content-featured.styl

@@ -38,12 +38,9 @@
     display: block
     position: relative
 
-    @media $breakpoint2
-        &:hover
-            transform: scale(1.03)
-
 .featured-title
     @extend .transition
+    transition-property: transform, opacity
     margin: 0
     position: absolute
     top: 25%
@@ -61,11 +58,11 @@
     left: 0
 
     opacity: 0
-    transform: translate(0, -20px)
+    transform: translate3d(0, -20px, 0)
 
     .featured-link:hover &
         opacity: 1
-        transform: translate(0, 0)
+        transform: translate3d(0, 0, 0)
 
 img.featured-image
     display: block

_src/_assets/styl/content-photo.styl

@@ -18,6 +18,7 @@
 
         figcaption
             @extend .transition
+            transition-property: transform, opacity
             position: absolute
             top: 25%
             min-width: 45%
@@ -38,11 +39,11 @@
                 left: -16%
 
             opacity: 0
-            transform: translate(0, -20px)
+            transform: translate3d(0, -20px, 0)
 
         &:hover figcaption
             opacity: 1
-            transform: translate(0, 0)
+            transform: translate3d(0, 0, 0)
 
     .entry-content
         text-align: left

_src/_assets/styl/grid.styl

@@ -10,6 +10,7 @@
 *:after
     box-sizing: border-box
 
+
 //
 // Base
 //
@@ -22,6 +23,9 @@
 
 .grid__col
     flex: 1
+    // Firefox grid fix for whatever reason
+    min-height: 0
+    min-width: 0
 
 
 //