.movie-container.svelte-kz4quw.svelte-kz4quw.svelte-kz4quw:before {
  content: "";
  width: 100%;
  display: block;
  padding-bottom: 56.25%
}

.movie-container.svelte-kz4quw.svelte-kz4quw.svelte-kz4quw {
  height: auto;
  width: 100%;
  position: relative
}

.movie-container.svelte-kz4quw .overlay-backdrop.svelte-kz4quw.svelte-kz4quw {
  pointer-events: none;
  border-color: #fff;
  border-style: solid;
  border-width: 0 2px;
  position: absolute;
  inset: 0
}

.movie-container.svelte-kz4quw .overlay.svelte-kz4quw.svelte-kz4quw {
  --transition-func: cubic-bezier(.075, .82, .165, 1);
  --transition-duration: .8s;
  --transition-delay: .2s;
  position: absolute;
  inset: 0;
  isolation: isolate;
  cursor: pointer;
  display: grid;
  place-items: center;
  overflow: hidden;
  transition: opacity var(--transition-duration) var(--transition-func)
}

.movie-container.svelte-kz4quw .overlay.svelte-kz4quw .c-image {
  transition: transform var(--transition-duration) var(--transition-func)
}

.movie-container.svelte-kz4quw .overlay .play-path.svelte-kz4quw.svelte-kz4quw {
  transition-property: stroke;
  transition-timing-function: linear;
  transition-duration: .2s;
  transition-delay: .4s
}

.movie-container.svelte-kz4quw .overlay .outer-circle.svelte-kz4quw.svelte-kz4quw {
  transition: stroke calc(var(--transition-duration) - var(--transition-delay)) ease
}

.movie-container.svelte-kz4quw .overlay .inner-circle.svelte-kz4quw.svelte-kz4quw {
  fill: #0065bd;
  transform: scale(0);
  transform-origin: center;
  transition: transform var(--transition-duration) var(--transition-func);
  transition-delay: var(--transition-delay)
}

.movie-container.svelte-kz4quw input.svelte-kz4quw:checked~.overlay.svelte-kz4quw {
  opacity: 0;
  pointer-events: none
}

@media (hover: hover) and (pointer: fine) {
  .movie-container.svelte-kz4quw:hover .c-image {
    transform: scale(1.05)
  }

  .movie-container.svelte-kz4quw:hover .play-path.svelte-kz4quw.svelte-kz4quw {
    stroke: #fff;
    transition-delay: 0ms;
    transition-timing-function: ease
  }

  .movie-container.svelte-kz4quw:hover .inner-circle.svelte-kz4quw.svelte-kz4quw {
    transform: scale(1);
    transition-delay: 0ms
  }

  .movie-container.svelte-kz4quw:hover .outer-circle.svelte-kz4quw.svelte-kz4quw {
    stroke: #0065bd;
    transition-timing-function: linear;
    transition-delay: var(--transition-delay)
  }
}
