a.btn-besoin-aide:hover,a.btn-forgot-password:hover {
    color: var(--couleurElement);
}
a.panier-produit-lien:hover{
    color: #212529;
}
.card-produit {
    height: 325px;
    box-shadow: 0 0 7px 3px #e0e0e0;
    overflow: hidden;
}

.visuel-produit {
    height: 240px;
    overflow: hidden;
    margin: auto;
    background-repeat: no-repeat;
    background-position: center;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: 100%;
}

.card-produit .ruban-nouveaute{
    position: absolute;
    top: 7.5%;
    left: -25%;
    background-color: var(--couleurNouveaute);
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    font-family: "Roboto-BoldCondensed", sans-serif;
    padding: 5px;
    width: 100%;
    transform: rotate(-35deg);
}
.header-widget{
    height: 85px;
    padding: 9px 12px;
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.footer-produit {
    height: 85px;
    padding: 12px;
    position: absolute;
    width: 100%;
    bottom: 0;
}

.footer-produit p {
    font-size: 14px;
    line-height: 16px;
    display: block;
}

/*.footer-produit .prix-produit,
.footer-produit .prixHT,
.footer-produit .ref-produit {
    white-space: nowrap;
}*/

.footer-produit .prix-produit > .gros-prix {
    font-size: 18px;
}

.btn-more {
    float: right;
    text-align: right;
    transform: translate(-38%, 70%);
}

.card-produit .icon-arrow-left {
    padding-left: 7px;
    vertical-align: inherit;
    font-weight: bold;
}

.btn-more a:hover {
    color: white;
    text-decoration: none;
}

button.see-more-produit {
    color: var(--couleurElement);
    background: none;
    border: none;
    display: inline-grid;
}

.txt-btn {
    font-size: 25px;
    font-family: 'Roboto Condensed', sans-serif;
}

.slick-push-hp .slick-dots li.slick-active button::before {
    opacity: .75;
    color: var(--couleurElement) !important;
    line-height: 12px;
    padding-top: 0.1rem;
}

.slick-push-hp .slick-dots li button::before {
    border: solid var(--couleurElement) 2px !important;
}

.hover-produit {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
}

.hover-produit:hover {
    background: #ffffff8a;
    border: solid var(--couleurElement) 3px;
    opacity: 1 !important;
    transition: 0.2s;
}

.cta-vignette {
    text-align: center;
    margin: auto;
    position: absolute;
    top: 40%;
    transform: translate(0, -50%);
    left: 0;
    right: 0;
}
.cta-widget-vignette {
    text-align: center;
    margin: auto;
    position: absolute;
    top: 57%;
    transform: translate(0, -50%);
    left: 0;
    right: 0;
}
span.plus-btn {
    background: var(--couleurElement);
    width: 36px;
    font-size: 32px;
    height: 36px;
    border-radius: 32px;
    color: white;
    font-weight: bolder;
    font-family: 'Roboto Bold', sans-serif;
    text-align: center;
    margin: auto;
    line-height: 36px;
}

.cta-vignette a:hover {
    text-decoration: none;
}

.small {
    font-size: 13px !important;
}

@media screen and (min-width: 768px) and (max-width: 990px) {

    .card-produit {
        height: 245px;
        margin: auto;
    }

    .visuel-produit {
        height: 185px;
        overflow: hidden;
        margin: auto;
        background-repeat: no-repeat;
        background-position: center;
        background-color: white;
        background-size: contain;
    }

    .footer-produit p {
        font-size: 12px !important;
        line-height: 16px;
    }

    .footer-produit .prix-produit{
        white-space: normal;
    }

    .card-produit .ruban-nouveaute{
        font-size: 10px;
    }

}
@media screen and (min-width: 200px) and (max-width: 576px) {

    .card-produit {
        height: 245px;
        margin: auto;
    }

    .visuel-produit {
        height: 149px;
        overflow: hidden;
        margin: auto;
        background-repeat: no-repeat;
        background-position: center;
        background-color: white;
        background-size: contain;
    }

    .footer-produit {
        height: 109px;
        padding: 10px;
    }

    .footer-produit p {
        font-size: 11px !important;
        line-height: 16px;
    }

    .footer-produit .gros-prix {
        font-size: 14px !important;
        line-height: 14px;
    }

    .footer-produit .prix-produit{
        white-space: normal;
    }

    .card-produit .ruban-nouveaute{
        font-size: 10px;
        left: -25%;
        top: 8%;
        width: 115%;
    }

    .flex-sm-wrap {
        flex-wrap: wrap !important;
    }

    .mobile-max-height {
        max-height: 28px !important;
        text-overflow: clip !important;
        white-space: normal !important;
    }
}