.testimonials-slider-spirule {
    @apply overflow-hidden;

    .testimonials {
        &__testimonial {

            &.has_inclination {
                margin-right: 30px;

                .testimonials__testimonial__content {

                    @media only screen and (min-width: 1024px) {

                        &:after {
                            @apply absolute bg-white;
                            width: 30px;
                            content: '';
                            right: -30px;
                            top: 0;
                            height: 100%;
                            clip-path: polygon(0px 100%, 0px 100%, 30px 0px, 0px 0px);

                        }
                    }
                }
            }

            &__introducing {
                @media only screen and (min-width: 1024px) {

                    &:before {
                        @apply absolute bg-white;
                        top: 0;
                        left: 55px;
                        width: calc(100% - 55px);
                        height: calc(100% + 24px);
                        content: '';
                        z-index: 0;
                    }
                }

                .color-index {
                    top: 0;
                    left: 55px;
                    width: calc(100% - 55px);
                    height: 100%;
                    z-index: 1;
                }

                .photo {
                    min-width: 124px;
                    width: 124px;
                    min-height: 124px;
                    height: 124px;
                }
            }

        }
    }

    .slick-list {
        overflow: visible;
        position: relative;
        padding: 0 10% 0 0;

        @media only screen and (min-width: 1024px) {
            padding: 0 20% 0 0;

        }
    }

    /* the slides */
    .slick-slide {
        @apply outline-none;
        margin: 0 10px;

        @media only screen and (min-width: 1024px) {
            margin: 0 80px;

        }
    }

    /* the parent */
    .slick-list {
        margin: 0 -10px;

        @media only screen and (min-width: 1024px) {
            margin: 0 -80px;
        }
    }
}


.arrows-wrapper {
    margin-left: 55px;

    .slick-arrow {
        @apply outline-none;
        min-width: 45px;
        width: 45px;
        height: 45px;
        min-height: 45px;
    }
}