:root {
    --dynamique-color      : var(--color-1);
    --dynamique-color-hover: var(--color-1-alt);
}
.construction {
    --dynamique-color      : var(--color-1);
    --dynamique-color-hover: var(--color-1-alt);
}
.renovation {
    --dynamique-color      : var(--color-2-alt);
    --dynamique-color-hover: var(--color-2);
}
.clim,
.clim-plomberie {
    --dynamique-color      : var(--color-3-alt);
    --dynamique-color-hover: var(--color-3);
}
strong {
    color: var(--dynamique-color);
}
p strong {
    color: inherit;
}
.separateur {
    padding: 2rem 0;
}
.btn-1 {
    background: var(--dynamique-color)!important;
}
.btn-1:hover {
    background: var(--dynamique-color-hover)!important;
}
.h2,
h2 {
    /* font-size    : 54px; */
    font-style   : italic;
    font-family  : var(--title-font);
    line-height  : 1;
    margin-bottom: 1rem;
}
.h3,
h3 {
    font-size    : 22px;
    font-weight  : 400;
    font-style   : italic;
    font-family  : var(--text-font);
    color        : var(--noir);
    margin-bottom: 1rem;
}
.h3 strong,
h3 strong {
    font-size  : 18px;
    font-weight: 700;
    font-family: var(--text-font);
    color      : var(--noir);
}
.h4,
h4 {
    font-size     : 22px;
    text-transform: uppercase;
    color         : var(--dynamique-color);
    margin-left   : -2rem;
}
.h5 strong,
h5 strong {
    text-transform: uppercase;
    color         : var(--noir);
    font-size     : 16px;
}
.logo-center {
    position: relative;
}
.logo-center:after {
    content  : '';
    position : absolute;
    top      : -1px;
    left     : calc(50% + 3rem);
    transform: translateX(-50%);
    width    : 205px;
    height   : 154px;
    z-index  : 20;
}
.construction.logo-center:after {
    background: url("../../img/construction.svg?1") no-repeat;
}
.renovation.logo-center:after {
    background: url("../../img/renovation.svg?1") no-repeat;
}
.clim.logo-center:after {
    background: url("../../img/clim.svg?2") no-repeat;
}
.croix {
    position: relative;
    width   : 100%;
    height  : 100%;
}
.croix {
    position: relative;
    width   : 100%;
    height  : 100%;
}
.croix:before {
    content        : "";
    position       : absolute;
    top            : 50%;
    left           : 50%;
    width          : 100%;
    height         : 100%;
    transform      : translate(-50%, -50%);
    background     : url("../../img/croix.svg") no-repeat center center;
    background-size: contain;
    z-index        : 0;
}
.listesquare ul {
    list-style  : none;
    padding-left: 1.5em;
}
.listesquare ul li {
    line-height: 2;
}
.listesquare ul li strong {
    color: var(--noir);
}
.listesquare ul li::before {
    content    : "●";
    color      : var(--dynamique-color);
    display    : inline-block;
    width      : 1em;
    margin-left: -1.5em;
}
.listesquare.triangle ul li::before {
    content    : "►";
    color      : var(--dynamique-color);
    display    : inline-block;
    width      : 1.3em;
    margin-left: -1.5em;
}
.split-container-fluid {
    z-index: 2;
}
.split.alpha:before {
    content           : "";
    position          : absolute;
    left              : 50%;
    top               : 50%;
    transform         : translate(-30%,-50%);
    width             : 180px;
    height            : 211px;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 184 211'%3E%3Cpath d='M123.323 210.793H0L91.9512 0L183.902 210.793H152.693L91.9512 72.138L43.7638 182.005H110.346L123.323 210.793Z' fill='black'/%3E%3C/svg%3E");
    mask-repeat       : no-repeat;
    mask-size         : contain;
    background-color  : var(--dynamique-color);
}
.split.alpha.left:before {
    left: 0;
}
.alpha.left .split-container-fluid img {
    border-right: 0;
}
.alpha .split-container-fluid img {
    border-right: 1rem solid var(--bg-light);
}
.data-item__title {
    font-weight: bold;
}
.avis .data-item__title {
    font-weight: bold;
    font-style : italic;
}
.data-item__category {
    font-style: italic;
    font-size : 14px;
}
.trait-after {
    position    : relative;
    padding-left: 35px;
}
.trait-after:after {
    content         : "";
    position        : absolute;
    left            : 0;
    top             : 0;
    width           : 1px;
    height          : 100%;
    background-color: var(--noir);
}
form .text-danger {
    display: none;
}
/*-----------------------ATOUTS--------------------------*/
.atouts-widgets .data-item__svg {
    height: 70px;
}
.centered {
    display        : flex;
    flex-direction : column;
    justify-content: center;
}


.border-image-left{
    padding: 20px 20px 20px 0;
    background: var( --bg-body);
}
.border-image-right{
    padding: 20px 0px 20px 20px;
    background: var( --bg-light);
}


@media (max-width: 1650px) {
    .split.alpha:before {
        display: none;
    }
}
@media (max-width: 1199px) {
    h2 {
        font-size: 44px;
    }
}
@media (max-width: 1025px) {
    .h4,
    h4 {
        margin-left: 0;
    }
}
@media (max-width: 991px) {
    .separateur {
        padding: 0;
    }
    .alpha .split-container-fluid img {
        border-right: 0 solid var(--bg-light);
    }
    .logo-center:after {
        display: none;
    }
    .croix h2 {
        text-align: center !important;
    }
    .croix p {
        text-align: center !important;
    }
    .content .split-container {
        width    : 100%;
        max-width: 100%;
    }
    .page-header {
        padding: 0;
    }

    .border-image-left{
    padding:  0;

}
.border-image-right{
    padding: 0;

}

}
#content ul li {
    margin-bottom: 8px;
}




@media (max-width:767px) {
    .h2,
    h2 {
        font-size: 40px;
    }
    img.map {
        width: 70% !important;
    }
}
img.map {
    max-width: 100%;
    display  : block;
    margin   : 0 auto;
}
.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;
}
.realisations-index .card:hover .bloc-img .overlayfade,
.realisations-widgets .card:hover .bloc-img .overlayfade {
    opacity: 1;
}

.realisations .card-title svg{
    min-width:23px;
}
.card:hover {
    cursor: pointer;
}
@media (max-width:575px) {
    .h2,
    h2 {
        font-size: 35px;
    }
    .h3,
    h3 {
        font-size: 16px;
    }
    #main-menu .logo > img {
        height: 40px;
    }
    .atouts-widgets .data-item__svg {
        height: 50px;
    }
    .realisations-detail .h2 {
        font-size: 30px;
    }
    .trait-after {
        padding-left: 20px;
    }
}
.split {
    overflow-x: hidden;
}