: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-throwOutUp {
    animation: var(--f-throw-out-duration, 0.175s) ease-out both f-throwOutUp
}

.f-throwOutDown {
    animation: var(--f-throw-out-duration, 0.175s) ease-out both f-throwOutDown
}

@keyframes f-throwOutUp {
    to {
        transform: translate3d(0, calc(var(--f-throw-out-distance, 150px) * -1), 0);
        opacity: 0
    }
}

@keyframes f-throwOutDown {
    to {
        transform: translate3d(0, var(--f-throw-out-distance, 150px), 0);
        opacity: 0
    }
}

.f-zoomInUp {
    animation: var(--f-transition-duration, 0.2s) ease .1s both f-zoomInUp
}

.f-zoomOutDown {
    animation: var(--f-transition-duration, 0.2s) ease both f-zoomOutDown
}

@keyframes f-zoomInUp {
    from {
        transform: scale(0.975) translate3d(0, 16px, 0);
        opacity: 0
    }

    to {
        transform: scale(1) translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes f-zoomOutDown {
    to {
        transform: scale(0.975) translate3d(0, 16px, 0);
        opacity: 0
    }
}

.f-fadeIn {
    animation: var(--f-transition-duration, 0.2s) var(--f-transition-easing, ease) var(--f-transition-delay, 0s) both f-fadeIn;
    z-index: 2
}

.f-fadeOut {
    animation: var(--f-transition-duration, 0.2s) var(--f-transition-easing, ease) var(--f-transition-delay, 0s) both f-fadeOut;
    z-index: 1
}

@keyframes f-fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes f-fadeOut {
    100% {
        opacity: 0
    }
}

.f-fadeFastIn {
    animation: var(--f-transition-duration, 0.2s) ease-out both f-fadeFastIn;
    z-index: 2
}

.f-fadeFastOut {
    animation: var(--f-transition-duration, 0.1s) ease-out both f-fadeFastOut;
    z-index: 2
}

@keyframes f-fadeFastIn {
    0% {
        opacity: .75
    }

    100% {
        opacity: 1
    }
}

@keyframes f-fadeFastOut {
    100% {
        opacity: 0
    }
}

.f-fadeSlowIn {
    animation: var(--f-transition-duration, 0.5s) ease both f-fadeSlowIn;
    z-index: 2
}

.f-fadeSlowOut {
    animation: var(--f-transition-duration, 0.5s) ease both f-fadeSlowOut;
    z-index: 1
}

@keyframes f-fadeSlowIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes f-fadeSlowOut {
    100% {
        opacity: 0
    }
}

.f-crossfadeIn {
    animation: var(--f-transition-duration, 0.2s) ease-out both f-crossfadeIn;
    z-index: 2
}

.f-crossfadeOut {
    animation: calc(var(--f-transition-duration, 0.2s)*.5) linear .1s both f-crossfadeOut;
    z-index: 1
}

@keyframes f-crossfadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes f-crossfadeOut {
    100% {
        opacity: 0
    }
}

.f-slideIn.from-next {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideInNext
}

.f-slideIn.from-prev {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideInPrev
}

.f-slideOut.to-next {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideOutNext
}

.f-slideOut.to-prev {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-slideOutPrev
}

@keyframes f-slideInPrev {
    0% {
        transform: translateX(100%)
    }

    100% {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes f-slideInNext {
    0% {
        transform: translateX(-100%)
    }

    100% {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes f-slideOutNext {
    100% {
        transform: translateX(-100%)
    }
}

@keyframes f-slideOutPrev {
    100% {
        transform: translateX(100%)
    }
}

.f-classicIn.from-next {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicInNext;
    z-index: 2
}

.f-classicIn.from-prev {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicInPrev;
    z-index: 2
}

.f-classicOut.to-next {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicOutNext;
    z-index: 1
}

.f-classicOut.to-prev {
    animation: var(--f-transition-duration, 0.85s) cubic-bezier(0.16, 1, 0.3, 1) f-classicOutPrev;
    z-index: 1
}

@keyframes f-classicInNext {
    0% {
        transform: translateX(-75px);
        opacity: 0
    }

    100% {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes f-classicInPrev {
    0% {
        transform: translateX(75px);
        opacity: 0
    }

    100% {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes f-classicOutNext {
    100% {
        transform: translateX(-75px);
        opacity: 0
    }
}

@keyframes f-classicOutPrev {
    100% {
        transform: translateX(75px);
        opacity: 0
    }
}

.f-carousel {
    --f-carousel-theme-color: #706f6c;
    --f-carousel-spacing: 0px;
    --f-carousel-slide-width: 100%;
    --f-carousel-slide-height: auto;
    --f-carousel-slide-padding: 0;
    --f-button-width: 42px;
    --f-button-height: 42px;
    --f-button-color: var(--f-carousel-theme-color, currentColor);
    --f-button-hover-color: var(--f-carousel-theme-color, currentColor);
    --f-button-bg: transparent;
    --f-button-hover-bg: var(--f-button-bg);
    --f-button-active-bg: var(--f-button-bg);
    --f-button-svg-width: 24px;
    --f-button-svg-height: 24px;
    --f-button-next-pos: 10px;
    --f-button-prev-pos: 10px;
    --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;
    position: relative;
    box-sizing: border-box
}

    .f-carousel *,
    .f-carousel *:before,
    .f-carousel *:after {
        box-sizing: inherit
    }

    .f-carousel.is-ltr {
        direction: ltr
    }

    .f-carousel.is-rtl {
        direction: rtl
    }

.f-carousel__viewport {
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    width: 100%;
    height: 100%
}

    .f-carousel__viewport.is-draggable {
        cursor: move;
        cursor: grab
    }

    .f-carousel__viewport.is-dragging {
        cursor: move;
        cursor: grabbing
    }

.f-carousel__track {
    display: flex;
    margin: 0 auto;
    padding: 0;
    height: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

.f-carousel__slide {
    position: relative;
    flex: 0 0 auto;
    width: var(--f-carousel-slide-width);
    max-width: 100%;
    height: var(--f-carousel-slide-height);
    margin: 0 var(--f-carousel-spacing) 0 0;
    padding: var(--f-carousel-slide-padding);
    outline: 0;
    transform-origin: center center
}

    .f-carousel__slide img.is-preloading {
        visibility: hidden
    }

    .f-carousel__slide > .f-spinner {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

.f-carousel.is-vertical {
    --f-carousel-slide-height: 100%
}

    .f-carousel.is-vertical .f-carousel__track {
        flex-wrap: wrap
    }

    .f-carousel.is-vertical .f-carousel__slide {
        margin: 0 0 var(--f-carousel-spacing) 0
    }

:root {
    --f-carousel-dots-width: 24px;
    --f-carousel-dots-height: 30px;
    --f-carousel-dot-width: 8px;
    --f-carousel-dot-height: 8px;
    --f-carousel-dot-radius: 50%;
    --f-carousel-dot-color: var(--f-carousel-theme-color, currentColor);
    --f-carousel-dot-opacity: 0.2;
    --f-carousel-dot-hover-opacity: 0.4
}

.f-carousel.has-dots {
    margin-bottom: var(--f-carousel-dots-height)
}

.f-carousel__dots {
    position: absolute;
    bottom: calc(var(--f-carousel-dots-height)*-1);
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 0 auto !important;
    padding: 0;
    list-style: none !important;
    user-select: none
}

    .f-carousel__dots li {
        margin: 0;
        padding: 0;
        border: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: var(--f-carousel-dot-opacity);
        transition: opacity .15s ease-in-out
    }

        .f-carousel__dots li + li {
            margin: 0
        }

        .f-carousel__dots li:hover {
            opacity: var(--f-carousel-dot-hover-opacity)
        }

        .f-carousel__dots li.is-current {
            opacity: 1
        }

        .f-carousel__dots li button {
            appearance: none;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0;
            padding: 0;
            width: var(--f-carousel-dots-width);
            height: var(--f-carousel-dots-height);
            border: 0;
            background: rgba(0, 0, 0, 0);
            cursor: pointer;
            transition: all .2s linear
        }

.f-carousel__dot {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    width: var(--f-carousel-dot-width);
    height: var(--f-carousel-dot-height);
    border-radius: var(--f-carousel-dot-radius);
    background-color: var(--f-carousel-dot-color);
    line-height: 0;
    font-size: 0;
    cursor: pointer;
    pointer-events: none
}

.f-carousel__dots.is-dynamic li:not(.is-prev, .is-next, .is-current, .is-after-next, .is-before-prev) button {
    transform: scale(0);
    width: 0
}

.f-carousel__dots.is-dynamic li.is-before-prev button,
.f-carousel__dots.is-dynamic li.is-after-next button {
    transform: scale(0.22)
}

.f-carousel__dots.is-dynamic li.is-prev button,
.f-carousel__dots.is-dynamic li.is-next button {
    transform: scale(0.66)
}

.f-carousel__dots.is-dynamic li.is-current button {
    transform: scale(1)
}

.f-carousel__dots.is-dynamic li.is-before-prev button,
.f-carousel__dots.is-dynamic li.is-after-next button {
    transform: scale(0.33)
}

.f-carousel__dots.is-dynamic li.is-current:first-child {
    margin-left: calc(var(--f-carousel-dots-width)*2)
}

.f-carousel__dots.is-dynamic li.is-prev:first-child {
    margin-left: var(--f-carousel-dots-width)
}

.f-carousel__dots.is-dynamic li.is-next:last-child {
    margin-right: var(--f-carousel-dots-width)
}

.f-carousel__dots.is-dynamic li.is-current:last-child {
    margin-right: calc(var(--f-carousel-dots-width)*2)
}

.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-current:first-child {
    margin-left: 0;
    margin-right: var(--f-carousel-dots-width)
}

.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-prev:first-child {
    margin-left: 0;
    margin-right: var(--f-carousel-dots-width)
}

.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-current:last-child {
    margin-left: 0;
    margin-right: var(--f-carousel-dots-width)
}

.f-carousel.is-rtl .f-carousel__dots.is-dynamic .is-next:last-child {
    margin-right: 0;
    margin-left: var(--f-carousel-dots-width)
}

:root {
    --f-button-width: 40px;
    --f-button-height: 40px;
    --f-button-border: 0;
    --f-button-border-radius: 0;
    --f-button-color: #374151;
    --f-button-bg: #f8f8f8;
    --f-button-hover-bg: #e0e0e0;
    --f-button-active-bg: #d0d0d0;
    --f-button-shadow: none;
    --f-button-transition: all 0.15s ease;
    --f-button-transform: none;
    --f-button-svg-width: 20px;
    --f-button-svg-height: 20px;
    --f-button-svg-stroke-width: 1.5;
    --f-button-svg-fill: none;
    --f-button-svg-filter: none;
    --f-button-svg-disabled-opacity: 0.65
}

.f-button {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: content-box;
    position: relative;
    margin: 0;
    padding: 0;
    width: var(--f-button-width);
    height: var(--f-button-height);
    border: var(--f-button-border);
    border-radius: var(--f-button-border-radius);
    color: var(--f-button-color);
    background: var(--f-button-bg);
    box-shadow: var(--f-button-shadow);
    pointer-events: all;
    cursor: pointer;
    transition: var(--f-button-transition)
}

@media(hover: hover) {
    .f-button:hover:not([disabled]) {
        color: var(--f-button-hover-color);
        background-color: var(--f-button-hover-bg)
    }
}

.f-button:active:not([disabled]) {
    background-color: var(--f-button-active-bg)
}

.f-button:focus:not(:focus-visible) {
    outline: none
}

.f-button:focus-visible {
    outline: none;
    box-shadow: inset 0 0 0 var(--f-button-outline, 2px) var(--f-button-outline-color, var(--f-button-color))
}

.f-button svg {
    width: var(--f-button-svg-width);
    height: var(--f-button-svg-height);
    fill: var(--f-button-svg-fill);
    stroke: currentColor;
    stroke-width: var(--f-button-svg-stroke-width);
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: opacity .15s ease;
    transform: var(--f-button-transform);
    filter: var(--f-button-svg-filter);
    pointer-events: none
}

.f-button[disabled] {
    cursor: default
}

    .f-button[disabled] svg {
        opacity: var(--f-button-svg-disabled-opacity)
    }

.f-carousel__nav .f-button.is-prev,
.f-carousel__nav .f-button.is-next,
.fancybox__nav .f-button.is-prev,
.fancybox__nav .f-button.is-next {
    position: absolute;
    z-index: 1
}

.is-horizontal .f-carousel__nav .f-button.is-prev,
.is-horizontal .f-carousel__nav .f-button.is-next,
.is-horizontal .fancybox__nav .f-button.is-prev,
.is-horizontal .fancybox__nav .f-button.is-next {
    top: 50%;
    transform: translateY(-50%)
}

.is-horizontal .f-carousel__nav .f-button.is-prev,
.is-horizontal .fancybox__nav .f-button.is-prev {
    left: var(--f-button-prev-pos)
}

.is-horizontal .f-carousel__nav .f-button.is-next,
.is-horizontal .fancybox__nav .f-button.is-next {
    right: var(--f-button-next-pos)
}

.is-horizontal.is-rtl .f-carousel__nav .f-button.is-prev,
.is-horizontal.is-rtl .fancybox__nav .f-button.is-prev {
    left: auto;
    right: var(--f-button-next-pos)
}

.is-horizontal.is-rtl .f-carousel__nav .f-button.is-next,
.is-horizontal.is-rtl .fancybox__nav .f-button.is-next {
    right: auto;
    left: var(--f-button-prev-pos)
}

.is-vertical .f-carousel__nav .f-button.is-prev,
.is-vertical .f-carousel__nav .f-button.is-next,
.is-vertical .fancybox__nav .f-button.is-prev,
.is-vertical .fancybox__nav .f-button.is-next {
    top: auto;
    left: 50%;
    transform: translateX(-50%)
}

.is-vertical .f-carousel__nav .f-button.is-prev,
.is-vertical .fancybox__nav .f-button.is-prev {
    top: var(--f-button-next-pos)
}

.is-vertical .f-carousel__nav .f-button.is-next,
.is-vertical .fancybox__nav .f-button.is-next {
    bottom: var(--f-button-next-pos)
}

    .is-vertical .f-carousel__nav .f-button.is-prev svg,
    .is-vertical .f-carousel__nav .f-button.is-next svg,
    .is-vertical .fancybox__nav .f-button.is-prev svg,
    .is-vertical .fancybox__nav .f-button.is-next svg {
        transform: rotate(90deg)
    }

.f-carousel__nav .f-button:disabled,
.fancybox__nav .f-button:disabled {
    pointer-events: none
}
