/* Small cross cursor for mouse-operated devices only. */
@media (hover: hover) and (pointer: fine) {
  .cross-cursor {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2147483647;
    width: 24px;
    height: 24px;
    pointer-events: none;
    opacity: 0;
    transform: translate3d(-100px, -100px, 0) translate(-50%, -50%);

    transition: opacity .18s ease;
  }
  .cross-cursor.is-visible { opacity: 1; }
  .cross-cursor.is-over-photo { mix-blend-mode: difference; }
  .cross-cursor.is-over-photo::before,
  .cross-cursor.is-over-photo::after { background: #fff; }
  .cross-cursor::before, .cross-cursor::after {
    content: "";
    position: absolute;
    background: #000;
  }
  .cross-cursor::before { top: 0; left: calc(50% - .5px); width: 1px; height: 100%; }
  .cross-cursor::after { top: calc(50% - .5px); left: 0; width: 100%; height: 1px; }
}
@media (prefers-reduced-motion: reduce) {
  .cross-cursor { transition: none; }
}