media and autogrid without o- prefix

sass/components/autogrid.scss

@@ -3,7 +3,7 @@
 /* ----------------------------- */
 /* see https://codepen.io/raphaelgoetter/pen/zzwxEE */
 
-.o-autogrid {
+.autogrid {
   @media (min-width: $small) {
     display: grid;
     grid-auto-flow: column;

sass/components/media.scss

@@ -4,24 +4,21 @@
 /* see http://codepen.io/raphaelgoetter/pen/KMWWwj */
 
 @media (min-width: $small) {
-  .o-media {
+  .media {
     display: flex;
     align-items: flex-start;
-  }
 
-  .o-media-content {
-    flex: 1;
-    min-width: 0; /* avoid min-width:auto */
-  }
-}
-
-/* Media variants */
-@media (min-width: $small) {
-  .o-media--reverse {
-    flex-direction: row-reverse;
-  }
-
-  .o-media-figure--center {
-    align-self: center;
+    &-media-content {
+      flex: 1;
+    }
+
+    // vertical align image
+    &-figure--center {
+      align-self: center;
+    }
+    // reverse variant
+    &--reverse {
+      flex-direction: row-reverse;
+    }
   }
 }