:root {
  --swiper-theme-color: #fff;
  --fancy-slider-font-family: sans-serif;
  --fancy-slider-button-side-offset: 32px;
  --fancy-slider-button-mobile-side-offset: 24px;
  --fancy-slider-button-mobile-bottom-offset: 16px;
  --fancy-slider-title-font-size: 80px;
  --fancy-slider-title-line-height: 1.2;
  
  /* background */
  --fancy-slider-transition-background-duration: 1000ms; /* duration background color */
  --fancy-slider-transition-background-delay: 1000ms;    /* delay background color */
  
  /* other */
  --fancy-slider-transition-slide-delay: 850ms; /* delay slide translation */
  --fancy-slider-transition-title-delay: 800ms; /* delay title translation */
  --fancy-slider-transition-timing-function: cubic-bezier(0.5, 0, 0, 1); /* global timing function */
  
  /* scaling */
  /*--fancy-slider-transition-scale-slide-delay: 0ms;      /* delay slide scale */
  /*--fancy-slider-transition-scale-slide-duration: 750ms; /* duration slide scale */
  --fancy-slider-transform-scale-slide: 0.6;               /* before scale in slide - same as in js */
  /*--fancy-slider-transition-scale-img-delay: 0ms;      /* delay img scale */
  /*--fancy-slider-transition-scale-img-duration: 750ms; /* duration img scale */
  --fancy-slider-transform-scale-img: 1.2;               /* before scale in img - same as in js */
  
  /* nav */
  --fancy-slider-transition-button: 400ms;        /*  */
  --fancy-slider-transition-button-arrow: 400ms;  /*  */
  --fancy-slider-transition-button-circle: 400ms; /*  */
}
/*
html,
body {
  position: relative;
  height: 100%;
  margin: 0;
  padding: 0;
}
body {
  color: #fff;
  line-height: 1.5;
  font-family: -apple-system, system-ui, Helvetica Neue, Helvetica, Arial,
    Segoe UI, Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
*/
.fancy-slider {
  --fancy-slider-title-font-size: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-family: var(--fancy-slider-font-family);
}
@media (max-width: 480px) {
  .fancy-slider {
    --fancy-slider-title-font-size: 60px;
  }
}
.fancy-slider-no-transition {
  transition-duration: 0ms !important;
  transition-delay: 0ms !important;
  transition-property: none !important;
}
.fancy-slider-no-transition *:not(.swiper-wrapper) {
  transition-duration: 0ms !important;
  transition-delay: 0ms !important;
  transition-property: none !important;
}
.fancy-slider-no-transition .swiper-wrapper {
  transition-delay: 0ms !important;
}
.fancy-slider .swiper {
  width: 100%;
  height: 100%;
  transition-duration: var(--fancy-slider-transition-background-duration);
  transition-property: background-color;
  transition-delay: var(--fancy-slider-transition-background-delay);
}
.fancy-slider .swiper-wrapper {
  transition-delay: var(--fancy-slider-transition-slide-delay);
  transition-timing-function: var(--fancy-slider-transition-timing-function);
}
.fancy-slider .swiper-slide {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.fancy-slider-title {
  transition-delay: var(--fancy-slider-transition-title-delay);
  z-index: 10;
}
.fancy-slider-title-text {
  font-weight: 700;
  font-size: var(--fancy-slider-title-font-size);
  line-height: var(--fancy-slider-title-line-height);
  letter-spacing: -1px;
  color: #fff0;
  -webkit-text-stroke: 2px #fff;
}
.fancy-slider-scale {
  width: 100%;
  height: 100%;
  position: absolute;
  transform: scale(var(--fancy-slider-transform-scale-slide));
  /*transition-duration: var(--fancy-slider-transition-scale-slide-duration);
  transition-delay: var(--fancy-slider-transition-scale-slide-delay);*/
  transition-property: transform;
  transition-timing-function: var(--fancy-slider-transition-timing-function);
  opacity: 0.9;
  overflow: hidden;
}
.fancy-slider-scale img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(var(--fancy-slider-transform-scale-img)) /*translate(50%)*/;
  /*transition-duration: var(--fancy-slider-transition-scale-img-duration);
  transition-delay: var(--fancy-slider-transition-scale-img-delay);*/
  transition-timing-function: var(--fancy-slider-transition-timing-function);
  transition-property: transform;
}

/* nav */
.fancy-slider-button {
  transition: var(--fancy-slider-transition-button);
  outline: none;
  position: absolute;
  width: 140px;
  z-index: 10;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}
.fancy-slider-button svg {
  display: block;
  transition: var(--fancy-slider-transition-button);
}
.fancy-slider-button .fancy-slider-svg-circle-wrap {
  transition: var(--fancy-slider-transition-button-circle);
  transform-origin: -20px 40px;
  opacity: 1;
}
.fancy-slider-button circle {
  transition: var(--fancy-slider-transition-button-circle);
  stroke-width: 2px;
  stroke: #fff;
  fill: none;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  opacity: 1;
  transform-origin: 0px 0px 0px;
}
.fancy-slider-button .fancy-slider-svg-arrow {
  transition: var(--fancy-slider-transition-button-arrow);
  fill: #fff;
  transform: rotateY(180deg) translate(-55px, 36.1px) scale(1.75);
}
.fancy-slider-button-prev {
  left: var(--fancy-slider-button-side-offset);
}
.fancy-slider-button-next {
  right: var(--fancy-slider-button-side-offset);
}
@media (max-width: 640px) {
  .fancy-slider-button {
    top: auto;
    bottom: var(--fancy-slider-button-mobile-bottom-offset);
    transform: none;
  }
  .fancy-slider-button-prev {
    left: var(--fancy-slider-button-mobile-side-offset);
  }
  .fancy-slider-button-next {
    right: var(--fancy-slider-button-mobile-side-offset);
  }
}
.fancy-slider-button-disabled {
  opacity: 0.2;
  cursor: default;
}
.fancy-slider-button .fancy-slider-svg-wrap {
  transform: translateY(353px);
}
.fancy-slider-button-next .fancy-slider-svg-wrap {
  transform: translateY(353px) rotateY(180deg);
  transform-origin: 80px 0px 0px;
}
.fancy-slider-button .fancy-slider-svg-line {
  transition: var(--fancy-slider-transition-button);
  stroke: #fff;
  stroke-width: 2;
  transform: translate(50px, 42px);
}
.fancy-slider-button-prev:not(.fancy-slider-button-disabled):hover svg {
  transform: translate(-16px);
}
.fancy-slider-button-next:not(.fancy-slider-button-disabled):hover svg {
  transform: translate(16px);
}
.fancy-slider-button:not(.fancy-slider-button-disabled):hover
  .fancy-slider-svg-circle-wrap {
  transform: scale(1.1);
}
.fancy-slider-button:not(.fancy-slider-button-disabled):hover circle {
  stroke-dasharray: 4px;
  stroke-dashoffset: 4px;
  opacity: 1;
}
.fancy-slider-button:not(.fancy-slider-button-disabled):hover
  .fancy-slider-svg-arrow {
  transform: rotateY(180deg) translate(-40px, 36.1px) scale(1.75);
}
.fancy-slider-button:not(.fancy-slider-button-disabled):hover
  .fancy-slider-svg-line {
  transform: translate(35px, 42px) scaleX(0.5);
}

/* swiper */
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-wrapper {
  transform: translate(0);
}
.swiper-pointer-events {
  touch-action: pan-y;
}
.swiper-pointer-events.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  backface-visibility: hidden;
}
.swiper-3d,
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(
    to left,
    rgba(0, 0, 0, 0.5),
    rgba(0, 0, 0, 0)
  );
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.5),
    rgba(0, 0, 0, 0)
  );
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.5),
    rgba(0, 0, 0, 0)
  );
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.5),
    rgba(0, 0, 0, 0)
  );
}
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-vertical.swiper-css-mode > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-centered > .swiper-wrapper:before {
  content: "";
  flex-shrink: 0;
  order: 9999;
}
.swiper-centered.swiper-horizontal
  > .swiper-wrapper
  > .swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-centered.swiper-horizontal > .swiper-wrapper:before {
  height: 100%;
  width: var(--swiper-centered-offset-after);
}
.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-centered.swiper-vertical > .swiper-wrapper:before {
  width: 100%;
  height: var(--swiper-centered-offset-after);
}
.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
}