/* ------------------------------------------------------------------
   Site overrides, loaded after app.css.

   app.css is a compiled Foundation build. Keeping these rules in their
   own file means they survive a future recompile of app.css from the
   SCSS sources (recoverable from assets/css/app.css.map).
   ------------------------------------------------------------------ */

/* Responsive art direction for the event card.
   Mobile gets the 3:4 portrait flyer, medium and up gets the 16:9
   landscape cut, so the card's aspect ratio has to follow the source. */
.event-card .event-card-image picture {
  display: block;
  width: 100%;
  height: 100%;
}

@media print, screen and (min-width: 40em) {
  .event-card .event-card-image {
    aspect-ratio: 16/9;
  }
}