
.outer-textbildslidersmall {
    position: relative;
    padding: var(--paddingMobile);
    overflow: hidden;
    &::after {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 421px;
        height: 460px;
        background-image: url('/ake/images/gestaltung/background01.svg');
        background-repeat: no-repeat;
        background-size: contain;
        z-index: -1;
    }
    .s_container {
        height: 100%;
        background-size: cover;
        background-position: center;
        position: relative;
        max-width: var(--max-width);
        margin: 0 auto;
        h4 {
            color: var(--farbedunkel);
            text-transform: uppercase;
            width: 100%;
            text-align: center;
        }
        p {
            text-align: center;
            width: 100%;
            max-width: 550px;
            margin: 0 auto;
        }
        .container-inner {
            margin-top: 3rem;
            .carousel {
                width: 100%;
                .carousel-cell {
                    width: calc(100% - 20px);
                    aspect-ratio: 1/1;
                    margin: 0 10px;
                    cursor: pointer;
                    transition: width .3s;
                    .carousel-content {
                        position: relative;
                        border-radius: 16px;
                        height: 100%;
                        &::after {
                            content: "";
                            position: absolute;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            background-color: rgba(0,0,0,.7);
                            border-radius: 16px;
                        }
                        img {
                            width: 100%;
                            height: 100%;
                            border-radius: 16px;
                            object-fit: cover;
                        }
                        .text {
                            position: absolute;
                            bottom: 1.25rem;
                            left: 1.25rem;
                            max-width: 355px;
                            height: fit-content;
                            z-index: 1;
                            h6 {
                                color: var(--white);
                                padding: 0;
                            }
                            p {
                                color: var(--white);
                                text-align: left;
                                max-width: 171px;
                            }
                        }
                    }
                }
                .flickity-prev-next-button {
                    background-color: var(--farbehell)!important;
                    .arrow {
                        fill: var(--black)!important;
                    }
                }
            }
        }
    }
}











@media (min-width: 1200px) {
    .outer-textbildslidersmall {
        padding: var(--paddingDesktop);
        .s_container {
           
            .container-inner {
                .carousel {
                    .carousel-cell {
                        width: calc(20% - 20px);
                    }
                }
            }
        }
    }
}