@media (prefers-reduced-motion: no-preference) {
  @view-transition {
    navigation: auto;
  }

  ::view-transition-old(root) {
    animation: 150ms ease-out both vt-out;
  }

  ::view-transition-new(root) {
    animation: 180ms ease-out both vt-in;
  }

  @keyframes vt-out {
    to { opacity: 0; }
  }

  @keyframes vt-in {
    from { opacity: 0; }
  }

  html.no-vt body {
    animation: page-in 180ms ease-out;
  }

  html.no-vt.is-leaving body {
    animation: none;
    opacity: 0;
    transition: opacity 150ms ease-out;
  }

  @keyframes page-in {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  img {
    animation: img-in 200ms ease-out both;
  }

  .blueimp-gallery img,
  #ajax-img img,
  #top-nav img.logo {
    animation: none;
  }

  @keyframes img-in {
    from { opacity: 0; }
    to { opacity: 1; }
  }
}