.swiper-container {
    width: 100vw;
    height: 100vh;
}

.swiper-slide {
    background-color: #fcfcfc;
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    color: #fcfcfc;
}

.swiper-slide>.swiper-slide-cover {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: transparent no-repeat 50% 50% /cover;
}

.swiper-slide .slide-01 {
    background-image: linear-gradient(180deg, transparent, #0000007a), url(../img/ai-detection.jpg);
    transform-origin: 50% 50%;
}

.swiper-slide .slide-02 {
    background-image: linear-gradient(180deg, transparent, #0000007a), url(../img/fleet-monitor.jpg);
    transform-origin: 50% 50%;
}

.swiper-slide .slide-03 {
    background-image: linear-gradient(180deg, transparent, #0000007a), url(../img/command-control.jpg);
    transform-origin: 50% 50%;
}

.swiper-slide .slide-04 {
    background-image: linear-gradient(180deg, transparent, #0000007a), url(../img/cybersecutiry-firewall.jpg);
    transform-origin: 50% 50%;
}

.swiper-scale-effect .swiper-slide-cover {
    transition-timing-function: linear;
    transition-duration: 20s;
    transform: scale(1);
}

.swiper-scale-effect .swiper-slide.swiper-slide-active .swiper-slide-cover {
    transform: scale(1.1);
}

:root {
    --swiper-pagination-bottom: 40px;
    --swiper-theme-color: rgba(252, 252, 252, 0.85) !important;
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: #FCFCFC;
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #262626;
}

.swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 10px)) !important;
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 10px)) !important;
    box-shadow: inset 1px 1px 1px rgba(38, 38, 38, 0.85);
    background: var(--swiper-pagination-bullet-inactive-color, rgba(252, 252, 252, 0.85)) !important;
    opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.55) !important;
    --swiper-pagination-bullet-horizontal-gap: 6px;
}

.swiper-pagination-bullet-active {
    box-shadow: inset 1px 1px 1px rgba(38, 38, 38, 0.85);
    background: var(--swiper-pagination-bullet-active-color, rgba(252, 252, 252, 0.85)) !important;
    opacity: var(--swiper-pagination-bullet-active-opacity, 0.85) !important;
    --swiper-pagination-bullet-horizontal-gap: 10px;
}