.slider {
    .section__title {
        margin-bottom: 50px;
    }

    .section__btn {
        margin: 40px auto 0px auto !important;
    }

    .slider__basic {
        margin: 0px !important;
    }

    .slider__item {
        display: flex !important;
        justify-content: center;
        align-items: center;
        gap: 60px;
        /* opacity: 0; */
        opacity: 1;
        /* visibility: hidden; */
        visibility: visible;
        transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out;

        @media (max-width: 992px) {
            flex-direction: column;
            gap: 30px;
        }

        .slider__img {
            display: flex;
            flex-direction: column;
            align-items: center;
            transition: transform 0.4s ease-in-out;
            padding: 10px;
            gap: 30px;

            @media (min-width: 992px) {
                max-width: 50%;
                gap: 0px;
            }

            img {
                outline: rgba(60, 40, 80, 0.33) solid 8px;
                border-radius: 8px;
            }

            .slider__benefices {
                max-width: 565px;
                min-height: 170px;
                border-radius: 8px;
                background: linear-gradient(90deg, rgba(30, 20, 40, 1) 0%, rgba(17, 105, 39, 1) 100%);
                outline: 8px solid rgba(13, 190, 57, 0.33);
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;

                @media (min-width: 992px) {
                    padding-right: 40px;
                    margin: -50px 0px 15px 0px;
                    flex-direction: row;
                }

                h4 {
                    color: var(--main-color4);
                    height: fit-content;
                    width: fit-content;
                    margin: 0px;
                    text-transform: uppercase;
                    font-size: 18px;
                    font-family: var(--bold);

                    @media (min-width: 992px) {
                        transform: rotate(-90deg);
                    }
                }

                p {
                    color: var(--white);
                    padding: 15px;
                    height: fit-content;
                    width: fit-content;
                    margin: 0px;
                    
                    @media (min-width: 992px) {
                        border-top: 1px solid rgba(255, 255, 255, 0.16);
                        border-bottom: 1px solid rgba(255, 255, 255, 0.16);
                        padding: 15px 0;
                    }
                }
            }
        }

        .slider__text {
            margin-bottom: 30px;
            transition: transform 0.4s ease-in-out;

            @media (min-width: 992px) {
                max-width: 45%;
            }

            h2,
            h3,
            h4 {
                margin-bottom: 30px;
            }

            ul {
                padding: 0px;
                li {
                    position: relative;
                    padding: 0px 0px 0px 30px;
                    
                    &:last-child {
                        border-bottom: 1px solid rgba(7, 116, 186, 0.16);
                        padding: 0px 0px 40px 30px;
                        
                        @media (min-width: 992px) {
                            margin-bottom: 40px;
                        } 
                    }
                }
            }

            ul:not([class]) li::before {
                background: var(--main-color1);
                border-radius: 100%;
                content: "";
                display: inline-block;
                height: 8px;
                margin: -2px 15px 0px 15px;
                vertical-align: middle;
                width: 8px;
                outline: 2px solid rgba(7, 116, 186, 0.33);
                position: absolute;
                left: -5px;
                top: 11px;
            }
        }
    }

    .pagination {
        display: flex;
        justify-content: start;
        align-items: center;
        margin-left: auto;
        position: relative;
        margin-top: -35px;
        flex-direction: column;
        gap: 40px;

        @media (min-width: 992px) {
            flex-direction: row-reverse;
            max-width: 45%;
            gap: 0px;
        }

        .arrows {
            display: flex;
            justify-content: center;
            align-items: center;

            @media (min-width: 992px) {
                position: absolute;
                right: 25px;
            }


            .slick-prev,
            .slick-next {
                background: url('../../img/arrow.svg') no-repeat center;
                width: 40px;
                height: 20px;
                background-size: contain;
                position: relative !important;

                &:before {
                    display: none;
                }

                &.slick-disabled {
                    opacity: 0.33;
                }
            }

            .slick-prev {
                transform: rotate(180deg);
            }

            .slick-next {
                transform: rotate(0deg);
            }
        }

        .slick-dots {
            position: relative !important;
            width: auto !important;
            bottom: unset !important;
            display: flex;

            li {
                display: flex !important;
                justify-content: center;
                margin: 0 3px !important;
                transition: width 0.3s ease-in-out;

                &.slick-active {
                    width: 80px !important;

                    button {
                        background: var(--main-color3);
                        width: 100%;
                    }
                }

                button {
                    width: 12px;
                    height: 12px;
                    color: transparent;
                    background: transparent;
                    border: 1px solid var(--main-color3);
                    border-radius: 6px;
                    transition: width 0.3s ease-in-out;

                    &:before {
                        display: none;
                    }
                }
            }
        }
    }

    .slick-slide {
        &.slick-active {
            .slider__item {
                opacity: 1;
                visibility: visible;
            }
        }
    }
}