:root {
  --f-spinner-width: 36px;
  --f-spinner-height: 36px;
  --f-spinner-color-1: rgba(0, 0, 0, 0.1);
  --f-spinner-color-2: rgba(17, 24, 28, 0.8);
  --f-spinner-stroke: 2.75;
}
.f-spinner {
  margin: auto;
  padding: 0;
  width: var(--f-spinner-width);
  height: var(--f-spinner-height);
}
.f-spinner svg {
  width: 100%;
  height: 100%;
  vertical-align: top;
  animation: f-spinner-rotate 2s linear infinite;
}
.f-spinner svg * {
  stroke-width: var(--f-spinner-stroke);
  fill: none;
}
.f-spinner svg *:first-child {
  stroke: var(--f-spinner-color-1);
}
.f-spinner svg *:last-child {
  stroke: var(--f-spinner-color-2);
  animation: f-spinner-dash 2s ease-in-out infinite;
}
@keyframes f-spinner-rotate {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes f-spinner-dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}
.f-panzoom {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transform: translate3d(0, 0, 0);
  background: #fff;
}
.f-panzoom.is-draggable {
  cursor: move;
  cursor: grab;
}
.f-panzoom.can-zoom_in {
  cursor: zoom-in;
}
.f-panzoom.can-zoom_out {
  cursor: zoom-out;
}
.f-panzoom.is-dragging {
  cursor: move;
  cursor: grabbing;
}
.f-panzoom.in-fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  margin: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  aspect-ratio: unset !important;
  z-index: 9999;
}
.f-panzoom__content {
  display: block;
  margin: auto;
  position: relative;
  max-width: 100%;
  max-height: 100%;
  min-height: 0;
  object-fit: contain;
  transform: translate3d(0, 0, 0) scale(1) rotate(0) skew(0);
  transform-origin: center center;
  transition: none;
  -webkit-user-select: none;
  user-select: none;
}
.is-loading .f-panzoom__content {
  display: none;
}
.is-scaling .f-panzoom__content {
  filter: blur(0px);
  will-change: transform, width, height;
  backface-visibility: hidden;
}
picture.f-panzoom__content > img {
  width: 100%;
  height: auto;
  max-height: 100%;
}
.f-panzoom__content:not(:last-child) {
  margin-bottom: 0;
}
.f-panzoom__viewport {
  margin: auto;
  position: relative;
  width: fit-content;
  height: fit-content;
  min-height: 1px;
}
.f-panzoom__viewport:not(:last-child) {
  margin-bottom: 0;
}
.f-panzoom__caption:not(:first-child) {
  margin-bottom: auto;
}
html.with-panzoom-in-fullscreen {
  overflow: hidden;
}
