KNACSS/sass/components/media.scss

/* ----------------------------- */
/* ==Media object                */
/* ----------------------------- */
/* see http://codepen.io/raphaelgoetter/pen/KMWWwj */

@media (min-width: $tiny) {
  .media {
    display: flex;
    align-items: flex-start;

    &-media-content {
      flex: 1;
    }

    // vertical align image
    &-figure--center {
      align-self: center;
    }
    // reverse variant
    &--reverse {
      flex-direction: row-reverse;
    }
  }
}