.slider {
    height: 450px;
    width: 100%;
    grid-column: full-content !important;

    .swiper-slide {
        display: grid;
        grid-template-columns: var(--anresis-content-grid);
        grid-template-rows: 100%;

        .slide-image-container {
            grid-column: 1 / -1;
            grid-row: 1;
            width: 100%;
            height: 100%;
        }

        .slide-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .slide-dots {
            grid-column: full-content;
            grid-row: 1;

            background-image: url(./dots.png);
            background-position: 0 5px;
        }

        .slide-title {
            font: var(--anresis-font-slider-title);
            margin-block-end: var(--anresis-spacing-1);
        }

        .slide-text {
            font: var(--anresis-font-slider-text);
            margin-block-end: var(--anresis-spacing-6);

            p {
                color: var(--anresis-color-white-text);
            }
        }

        .slide-content {
            grid-column: content;
            grid-row: 1;
            background: transparent linear-gradient(296deg, rgba(51, 190, 204, 0.7) 0%, rgba(0, 205, 193, 0.7) 100%) 0 0 no-repeat padding-box;
            padding: var(--anresis-spacing-6);
            align-self: center;
            color: var(--anresis-color-white-text);
            width: 45%;

            @media (max-width: 1023px) {
                width: 65%;
            }

            @media (max-width: 767px) {
                width: 100%;
            }
        }
    }

    .swiper-button-prev,
    .swiper-button-next {
        opacity: 0.75;
        background-color: rgba(256,256,256,0.2);
        width: 60px;
        height: 60px;
        border-radius: 50%;

        > svg {
            filter: var(--anresis-color-white-filter);
            width: 40px;
            height: 40px;
        }

        @media (max-width: 767px) {
            display: none;
        }
    }

    .swiper-button-prev {
        left: 2rem;
    }

    .swiper-button-next {
        right: 2rem;
    }

    .swiper-pagination {
        bottom: var(--anresis-spacing-7);

        .swiper-pagination-bullet {
            width: 15px;
            height: 15px;
            opacity: 0.25;
            background-color: var(--anresis-color-white-background);
            margin: 0 var(--anresis-spacing-2) !important;

            &:hover,
            &.swiper-pagination-bullet-active {
                opacity: 0.75;
            }
        }
    }


}
