h2 {
    color        : var(--dark);
    font-family  : var(--text-font);
    font-size    : 41px;
    font-weight  : 700;
    margin-bottom: 1.2rem;
    line-height  : 1.1;
}
h3 {
    text-transform: uppercase;
    color         : var(--dark);
    font-weight   : 700;
    font-size     : 20px;
    margin-bottom : 1rem;
    font-family   : var(--title-font);
}
h4 {
    text-transform: uppercase;
    font-size     : 20px;
    margin-bottom : 1rem;
    font-weight   : 500;
}
.page-header {
    color: white;
}
.page-header .content {
    width      : 805px;
    border-left: 4px solid var(--color-1);
}
.page-header .container-fluid {
    position: relative;
    padding : 0 2.5rem;
}
.page-header p {
    font-size: 31px;
}
.page-header img {
    object-position: left;
}
.page-header h1 {
    font-weight   : 700;
    font-size     : 56px;
    text-transform: uppercase;
    margin-bottom : 1rem;
    font-family   : var(--title-font);
}
.feature p {
    font-family: var(--title-font);
    color      : var(--dark);
}
.shadow-vert {
    filter: drop-shadow(-10px 10px 0 #94C11F);
}
.shadow-blue {
    filter: drop-shadow(-10px 10px 0 #007BBD);
}
.vert .card img {
    filter: drop-shadow(-10px 10px 0 #94C11F);
}
.widgets.vert h4 {
    color      : var(--color-text);
    font-weight: 500;
}
.realisations-widgets.vert h4 {
    color: var(--color-text);
}
.realisations-widgets.bleu h4 {
    color      : var(--color-2);
    font-weight: 500;
}
.realisations .data-item__title,
.realisations-index .data-item__title {
    font-size     : 20px;
    font-family   : var(--title-font);
    margin-bottom : 1rem;
    text-transform: uppercase;
    font-weight   : 600;
}
.realisations h1.data-item__title {
    font-size     : 35px;
    font-family   : var(--title-font);
    margin-bottom : 1rem;
    text-transform: uppercase;
    font-weight   : 600;
}
.realisations-detail .content .data-item__content_short {
    font-size  : 18px;
    font-weight: 600;
}
.realisations-detail .content-img swiper-slide {
    position: relative;
    padding : 0 0 1rem 1.5rem;
}
.dropdown-menu {
    border       : none;
    border-radius: 0;
    box-shadow   : var(--shadow-1);
}
.realisations-detail .content-img swiper-slide:before {
    content   : '';
    position  : absolute;
    top       : 18px;
    left      : 5px;
    width     : 96%;
    height    : 100%;
    background: var(--color-1);
    z-index   : -1;
}
.bleu .card img {
    filter: drop-shadow(-10px 10px 0 #007BBD);
}
.green .container .row {
    margin-left: -10rem;
}
.blue .container .row {
    margin-right: -10rem;
}
.green ul li::marker {
    color    : var(--color-1);
    font-size: 1.2em;
}
.blue ul li::marker {
    color    : var(--color-2);
    font-size: 1.2em;
}
.color-text {
    color: #81A424;
}
.menu-level-1 svg {
    width: 80px;
}
.menu-level-1 .breack-after {
    text-align: center;
}
.menu-level-1 .breack-after a:hover {
    background: transparent;
}
.menu-level-1 a {
    font-family: var(--text-font);
}
#main-menu:not(.menu-breakpoint) .sub-menu ul.link-image {
    padding-left: var(--link-image-width);
}
#main-menu .sub-menu ul.link-image li.link-image a {
    background    : transparent;
    pointer-events: none;
}
.page-header {
    position: relative;
}
.page-header:after {
    content   : url("../../img/logo-qualite.svg");
    bottom    : 5%;
    right     : 2%;
    position  : absolute;
    background: rgba(255, 255, 255, 0.2);
    /* couche translucide */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index   : 2;
}
.page-header img.header-logo {
    width     : 90%;
    height    : auto;
    object-fit: unset;
    bottom    : 10px;
    top       : unset;
    min-height: unset;
    z-index   : 2;
    backdrop-filter: blur(3px);
    left      : 50%;
    transform : translateX(-50%);
}
.menu-breakpoint .menu-level-1 svg {
    width: 50px;
}
.temoignages-widgets .data-item__content_short {
    text-align   : center;
    font-style   : italic;
    margin-bottom: 10px;
}
swiper-container::part(button-next) {
    right: -34px;
    color: black;
    width: 17px;
}
swiper-container::part(button-prev) {
    left : -34px;
    color: black;
    width: 17px;
}
.logo-qualite {
    width: 400px;
}
.logo-list {
    gap: 10px 20px;
}
@media(max-width:1699px) {
    .green .container .row {
        margin-left: -5rem;
    }
    .blue .container .row {
        margin-right: -5rem;
    }
}
@media(max-width:1499px) {
    .green .container .row {
        margin-left: -2rem;
    }
    .blue .container .row {
        margin-right: -2rem;
    }
}
@media(max-width:1299px) {
    .page-header:after {
        bottom   : 0;
        right    : -5%;
        transform: scale(0.7);
    }
    .page-header h1 {
        font-size: 45px;
    }
    .page-header p {
        font-size: 18px;
    }
    .page-header .content {
        padding: 0 0 0 20px;
    }
    .green .container .row {
        margin-left: calc(-.5 * var(--bs-gutter-x));
    }
    .blue .container .row {
        margin-right: calc(-.5 * var(--bs-gutter-x));
    }
}
.infos {
    font-style: italic;
    font-size : 14px;
}
@media(max-width:1199px) {
    h2 {
        font-size: 30px;
    }
}
@media(max-width:767px) {
    .page-header .content {
        width        : 100%;
        margin-bottom: 80px;
    }
    .page-header:before {
        background: linear-gradient(to right, rgb(0 0 0 / 56%) 0%, rgb(0 0 0 / 43%) 100%);
    }
    .page-header h1 {
        font-size: 35px;
    }
    .page-header {
        height    : 350px;
        min-height: unset;
    }
    .page-header img {
        min-height: 350px;
    }
    .page-header:after {
        bottom: -5px;
        right : -11%;
    }
}
@media(max-width:575px) {
    #main-menu .logo > img {
        height: 57px;
    }
    .page-header h1,
    .realisations h1.data-item__title {
        font-size: 27px;
    }
    swiper-container::part(button-next) {
        right: -10px;
    }
    swiper-container::part(button-prev) {
        left: -10px;
    }
    .features-stacked-md .feature-img {
        padding-right: 1rem;
    }
    .feature-img svg {
        width: 50px;
    }
    .feature .feature-img i {
        font-size: 35px;
    }
    h2 {
        font-size: 25px;
    }
    .page-header .container-fluid {
        padding: 0 1rem;
    }
    .page-header .content {
        padding: 0 0 0 15px;
    }
    .page-header:after {
        content: none;
    }
    #content ul {
        padding-left: 20px;
    }
    .qualiba .feature {
        flex-direction: column;
    }
    .qualiba .feature-img svg {
        width: auto;
    }
}
@media(max-width:450px) {
    swiper-container::part(button-next) {
        right: -22px;
    }
    swiper-container::part(button-prev) {
        left: -22px;
    }
}
.realisations-index .card .bloc-img .overlayfade,
.realisations-widgets .card .bloc-img .overlayfade {
    position        : absolute;
    top             : 0;
    bottom          : 0;
    left            : 0;
    right           : 0;
    height          : 100%;
    width           : 100%;
    opacity         : 0;
    transition      : 0.5s ease;
    background-color: rgb(0 ,0, 0 ,0.47);
    color           : white;
    display         : flex;
    align-items     : center;
    justify-content : center;
    text-transform  : uppercase;
    font-weight     : 600;
    font-size       : 20px;
    font-family     : var(--title-font);
}
.realisations-index .card:hover .bloc-img .overlayfade,
.realisations-widgets .card:hover .bloc-img .overlayfade {
    opacity: 1;
}
#slide-menu:not(.menu-breakpoint) > ul:not(.top-menu).upper-menu > li > a {
    text-transform: none;
}
@media(max-width:575px) {
    .realisations-detail .content-img swiper-slide:before {
        top  : 11px;
        left : 11px;
        width: 94%;
    }
    swiper-container::part(button-prev) {
        left : -20px;
        width: 13px;
    }
    swiper-container::part(button-next) {
        width: 13px;
        right: -24px;
    }
    .content-img swiper-container::part(button-prev) {
        left: -13px;
    }
    swiper-container::part(pagination) {
        bottom: 23px;
    }
    .realisations-detail .content .data-item__content_short {
        font-size: 16px;
    }
    .footer-container .logo {
        padding: 1rem 4rem 0 2rem;
    }
}