/* The <picture> wrapper components/image puts around an <img> when it has a
   second format to offer.

   `display: contents` removes its box from layout without removing the <img>
   inside it, so the image stays a direct child of the slide as far as flexbox
   is concerned and every rule in carousel.css / slideshow.css keeps matching
   the same element in the same place. Without this the wrapper would become
   the flex item, and the `width: 100%` and `max-width` on the image would
   start resolving against a shrink-to-fit box instead of the slide.

   Safe to hide this way because <picture> carries no semantics of its own —
   it is a selection mechanism, not content, and `display: contents` only
   removes the element that has it, never its children. */

.image {
  display: contents;
}