.hdp.hdp_slider {
    position: relative;

    @media (max-width: 991px) {
        margin-top: -350px;
        padding: 200px 0px 0px 0px !important;
    }

    @media (min-width: 992px) {
        margin-top: -234px;
    }

    @media (min-width: 1200px) {
        margin-top: -244px;
    }

    @media (min-width: 1400px) {
        margin-top: -259px;
    }

    .sr7-btn {
        width: fit-content !important;
        padding: 12px 20px !important;
        border-radius: 50px !important;
        text-transform: uppercase !important;
        text-decoration: none !important;
        font-size: 14px !important;
        height: fit-content !important;
        display: block !important;
        transition: all var(--transition) !important;
        font-family: var(--text-font) !important;

        @media (min-width: 992px) {
            padding: 15px 25px !important;
        }
    }

    sr7-slide h3 {
        
        font-family: var(--title-font-hdp) !important;
        text-transform: uppercase !important;
    }

    sr7-slide h2 {
        font-family: var(--curvy-font) !important;
    }

    sr7-slide h2+p {
        font-family: var(--text-font) !important;

    }

    .sr7-leftarrow,
    .sr7-rightarrow {
        display: none !important;
    }

    @media (min-width: 992px) {

        sr7-slide h3,
        sr7-slide h2,
        sr7-slide h1,
        sr7-slide h2+p,
        sr7-slide h1+p,
        sr7-slide p,
        .sr7-btn {
            margin-left: 35px !important;
        }

        .sr7-leftarrow,
        .sr7-rightarrow {
            cursor: pointer !important;
            background: var(--white) !important;
            border: none !important;
            height: 62px !important;
            width: 62px !important;
            display: grid !important;
            place-items: center !important;

            &:before {
                content: '' !important;
                background-image: url(../../img/arrow_black.svg) !important;
                position: absolute !important;
                width: 25px !important;
                height: 20px !important;
                background-repeat: no-repeat !important;
                transition: all var(--transition) !important;
            }

            &:hover {
                background: #FFF !important;
            }
        }

        .sr7-arrows.sr7-touchhover,
        #SR7_1_1 .zeus .tp-title-wrap {
            background: #FFF !important;
        }

        .sr7-leftarrow {
            border-radius: 0px 50px 50px 0px !important;
            left: -30px !important;
            transition: left var(--transition) !important;

            &:before {
                transform: rotate(180deg) !important;
            }

            &:hover {
                &:before {
                    left: 20px !important;
                }
            }
        }

        .sr7-rightarrow {
            border-radius: 50px 0px 0px 50px !important;
            right: -25px !important;
            transition: right var(--transition) !important;

            &:hover {
                &:before {
                    right: 15px !important;
                }
            }
        }
    }
}

@media (min-width: 992px) {

    .hdp.hdp_slider::before,
    .hdp.hdp_slider::after {
        content: '';
        position: absolute;
        background-color: #FFF;
        width: 15px;
        height: 110vh;
        z-index: 10;
        top: 0;
    }

    .hdp.hdp_slider::before {
        left: 0px;
    }

    .hdp.hdp_slider::after {
        right: 0px;
    }
}

.homeslider.hdp {
    position: relative;

    &:after {
        content: '';
        background-repeat: no-repeat;
        bottom: 0;
        left: 0;
        position: absolute;
        width: 80%;
        height: 70%;
        background-position: left bottom;
        transition: all var(--transition);
        z-index: 1;
    }
}

.homeslider.hdp.violet {
    background-color: var(--violet);

    &:after {
        background-image: url(../../img/wave_rouge.svg);
    }
}

.homeslider.hdp.vert_clair {
    background-color: var(--green-dark2);

    &:after {
        background-image: url(../../img/wave_vert_fonce.svg);

    }
}

.homeslider.hdp.vert_fonce {
    background-color: var(--green-dark1);

    &:after {
        background-image: url(../../img/wave_vert_clair.svg);

    }
}

.hdp.homeslider {
    height: 100vh;
    margin: -174px 0px 15px 0px;
    color: var(--white);
    transition: background-color 0.5s ease;
    position: relative;

    @media (min-width: 768px) {
        height: calc(100vh - 30px);
        margin: -174px 15px 15px 15px;
    }

    @media (max-width: 992px) {
        height: 100%;
    }

    &:before {
        transition: background-color 0.5s ease;
    }

    /* &.deco_un {
        &.vert_fonce {
            &:before {
                filter: brightness(0) saturate(100%) invert(12%) sepia(57%) saturate(7016%) hue-rotate(160deg) brightness(96%) contrast(103%);
            }
        }

        &.vert_clair {
            &:before {
                filter: brightness(0) saturate(100%) invert(17%) sepia(14%) saturate(5034%) hue-rotate(127deg) brightness(100%) contrast(102%);
            }
        }

        &.violet {
            &:before {
                filter: brightness(0) saturate(100%) invert(31%) sepia(36%) saturate(2901%) hue-rotate(340deg) brightness(98%) contrast(98%);
            }
        }

        &:before {
            content: '';
            background-image: url(../../img/pepins_rouge.svg);
            background-repeat: no-repeat;
            background-size: contain;
            position: absolute;
            width: calc(100vw - 52%);
            height: 600px;
            z-index: 0;
            top: 50%;
            transform: translateY(-50%);
            right: 10px;
        }
    } */

    /* &.deco_deux {
        &.vert_fonce {
            &:before {
                filter: brightness(0) saturate(100%) invert(12%) sepia(57%) saturate(7016%) hue-rotate(160deg) brightness(96%) contrast(103%);
            }
        }

        &.vert_clair {
            &:before {
                filter: brightness(0) saturate(100%) invert(17%) sepia(14%) saturate(5034%) hue-rotate(127deg) brightness(100%) contrast(102%);
            }
        }

        &.violet {
            &:before {
                filter: brightness(0) saturate(100%) invert(31%) sepia(36%) saturate(2901%) hue-rotate(340deg) brightness(98%) contrast(98%);
            }
        }

        &:before {
            background-image: url(../../img/pepins_vert.svg);
            content: '';
            background-repeat: no-repeat;
            background-size: contain;
            position: absolute;
            width: calc(100vw - 55%);
            height: 600px;
            z-index: 0;
            top: 50%;
            transform: translateY(-50%);
            right: 10px;
        }
    } */

    >.container {
        height: 100%;
        align-items: center;
        display: flex;
        justify-content: center;
        z-index: 11;
        position: relative;
        margin-top: 100px;

        @media (max-width: 992px) {
            padding-top: 174px;
        }

        .homeslider__slides {
            .homeslider__slide {
                transition: background-color 0.5s ease;
                z-index: 10000;
                position: relative;

                .container {
                    padding: 0;
                    gap: 0px;
                    margin: 0;

                    @media (min-width: 992px) {
                        display: flex !important;
                        justify-content: space-between;
                        align-items: center;
                        flex-direction: row !important;
                    }

                    @media (max-width: 992px) {
                        max-width: 90vw;
                        display: flex;
                        flex-direction: column-reverse;
                    }

                    .homeslider__content {
                        display: flex;
                        flex-direction: column;
                        text-align: left;
                        width: 100%;

                        .homeslider__slide__subtitle {
                            font-family: var(--curvy-font);
                            font-size: 44px;
                            margin: 0;
                        }

                        .homeslider__slide__title {
                            text-transform: uppercase;
                            margin: 0;
                            font-family: var(--title-font-hdp);
                            color: var(--white);
                        }

                        .homeslider__slide__texte {
                            color: var(--white);
                            margin-top: 20px;

                            @media (min-width: 992px) {
                                padding-right: 200px;
                            }
                        }

                        .bouton {
                            margin-top: 20px;
                        }
                    }

                    .homeslider__media {
                        display: flex;
                        justify-content: center;
                        width: 100%;
                        position: relative;

                        img {
                            z-index: 9;
                        }
                    }
                }
            }
        }
    }

    @media (min-width: 600px) {
        .pagination {
            position: absolute;
            z-index: 999;
            width: 100%;
            top: 50%;
            transform: translateY(-50%);
            display: flex;
            justify-content: space-between;

            .prev,
            .next {
                cursor: pointer;
                background: var(--white);
                border: none;
                height: 62px;
                width: 62px;
                position: relative;
            }

            .prev {
                border-radius: 0px 50px 50px 0px;
                left: -9px;

                img {
                    transform: rotate(180deg);
                }
            }

            .next {
                border-radius: 50px 0px 0px 50px;
                right: -9px;
            }
        }
    }

    .hdp__content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding-bottom: 50px;
        padding-top: 50px;
        position: relative;
        z-index: 2;
    }

    @media (min-width: 1200px) {
        .hdp__content {
            min-height: 350px;
        }
    }

    .hdp .mx-auto {
        text-align: center;
    }

    .hdp .ms-auto {
        text-align: right;
    }

    .slick-track {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .slick-slide {
        float: none;
        height: auto;
        height: initial;
        width: 100%;
    }

    .slick-slider {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        width: 100%;
    }

    .slick-disabled {
        opacity: 0;
    }

    .slick-active button {
        background: #50a0f0;
    }
}