.fancybox__slide {
    --carousel-button-width: 1.25vw;
    --carousel-button-height: 1.25vw;
    --carousel-button-svg-width: 1.25vw;
    --carousel-button-svg-height: 1.25vw;
    padding: 0;
}

.fancybox__backdrop {
    background: rgba(13, 17, 22, 0.5) none repeat scroll 0% 0%;
}

.fancybox__content {
    max-height: 90vh;
    padding: 3.33vw 4vw;
    cursor: default;
}

.fancybox__content > .carousel__button.is-close {
    font-size: 1.25vw;
    right: 1.25vw;
    top: 1.25vw;
    color: #5C6168;
}

.fancybox__content > .carousel__button.is-close:hover {
    opacity: 0.5;
}

.fancybox__container {
    --carousel-button-svg-filter: none;
}

@media screen and (max-width: 1199px) {
    .fancybox__slide {
        --carousel-button-width: 3.13vw;
        --carousel-button-height: 3.13vw;
        --carousel-button-svg-width: 3.13vw;
        --carousel-button-svg-height: 3.13vw;
    }
    
    .fancybox__content {
        width: 90vw;
        padding: 8.34vw 5.64vw;
    }
    
    .fancybox__content > .carousel__button.is-close {
        font-size: 3.13vw;
        right: 3.13vw;
        top: 3.13vw;
    }
}

@media (min-width: 1024px) {
    .fancybox__slide {
        padding: 0;
    }
}

@media screen and (max-width: 767px) {
    .fancybox__slide {
        padding: 0;
        --carousel-button-width: 6.4vw;
        --carousel-button-height: 6.4vw;
        --carousel-button-svg-width: 6.4vw;
        --carousel-button-svg-height: 6.4vw;
    }
    
    .fancybox__content {
        padding: calc(30px + 4.27vw) 4.27vw;
        max-height: unset;
        height: 100vh;
        width: 100vw;
    }
    
    .fancybox__content > .carousel__button.is-close {
        font-size: 6.4vw;
        right: 4.4vw;
        top: 8.4vw;
    }
}

@media screen and (max-width: 428px) {
    .fancybox__content {
        width: 100%;
        height: 100vh;
        max-height: 100vh;
    }
}

body.compensate-for-scrollbar {
    padding-right: 0 !important;
}
