a[data-fancybox] img {
  cursor: zoom-in;
}

.fancybox__backdrop::after {
  content: "";
  position: absolute;
  width: 10%;
  height: 10%;
  filter: blur(2px);
  left: 50%;
  top: 50%;
  transform: scale(11);
  opacity: 0.3;
  background-image: var(--bg-image);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

.fancybox__container {
  --fancybox-bg: #000;

  --fancybox-thumbs-width: 48px;
  --fancybox-thumbs-ratio: 1;

  --carousel-button-bg: rgb(91 78 76 / 74%);

  --carousel-button-svg-width: 24px;
  --carousel-button-svg-height: 24px;

  --carousel-button-svg-stroke-width: 2.5;
}

.fancybox__nav {
  --carousel-button-svg-width: 24px;
  --carousel-button-svg-height: 24px;
}

.fancybox__nav .carousel__button.is-prev {
  left: 20px;
}

.fancybox__nav .carousel__button.is-next {
  right: 20px;
}

.carousel__button.is-close {
  left: auto;
  top: 20px;
  right: 20px;
}

.fancybox__slide {
  padding: 8px 88px;
}

/* Thumbnails */
.fancybox__thumbs .carousel__slide {
  padding: 8px 8px 16px 8px;
}

.is-nav-selected::after {
  display: none;
}

.fancybox__thumb {
  border-radius: 6px;
  opacity: 0.4;
}

.fancybox__thumb:hover,
.is-nav-selected .fancybox__thumb {
  border-radius: 6px;
  opacity: 1;
}

.is-nav-selected .fancybox__thumb::after {
  display: none;
}




@media screen and(min-width:575px) {
  .fancybox__content {
    width: 800px !important;
    height: 600px !important;
  }

  .fancybox__content img {
    width: 100%;
    height: 100%;
  }
}