
@layer site {
:root {
    --carousel-theme-color: #007aff;
}
.carousel {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
}
.carousel-items {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
}
.carousel-items {
    transform: translate3d(0px,0,0);
}
.carousel-item {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
}
.carousel-depth {
    perspective: 1200px;
}
.carousel-depth .carousel-item, .carousel-depth .carousel-items {
    transform-style: preserve-3d;
}
:root {
    --carousel-navigation-size: 44px;
}
.carousel-pagination {
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0,0,0);
    z-index: 10;
}
@keyframes carousel-preloader-spin {
0% {
    transform: rotate(0deg);
}
100% {
    transform: rotate(360deg);
}
}
}