/* MAIN */
@font-face {
    font-family: "Quicksand";
    src:
            url("../fonts/Quicksand-Regular.ttf") format("truetype");
}
@font-face {
    font-family: "Quicksand-semibold";
    src:
            url("../fonts/Quicksand-SemiBold.ttf") format("truetype");
}
@font-face {
    font-family: "Quicksand-bold";
    src:
            url("../fonts/Quicksand-Bold.ttf") format("truetype");
}


/* GLOBAL */

.home,
.home * {
    box-sizing: border-box;
}
.home {
    margin-right: auto;
    margin-left: auto;
    background: #ffffff;
    width: 1440px;
    position: relative;
}
.anchor{
    cursor: pointer;
}
.text-bg-success{
    background-color: #63c79d !important;
}
.desktop-hide{
    display: none;
}
.mobile-hide{
    display: block;
}


/* HEADER */

.header {
    border-style: solid;
    border-color: #5bc5f2;
    border-width: 0px 0px 2px 0px;
    display: flex;
    flex-direction: column;
    gap: 0px;
    align-items: flex-start;
    justify-content: flex-start;
    position: sticky;
    left: 0px;
    top: 0px;
    z-index: 1;
}
.header-mobile {
    display: none;
}
.pr-header {
    background: #ffffff;
    padding: 16px 40px 16px 40px;
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    flex-shrink: 0;
    width: 1440px;
    position: relative;
    overflow: hidden;
}
.pr-header .text {
    color: #232323;
    text-align: left;
    font: 600 16px/150% "Quicksand", sans-serif;
    position: relative;
}
.pr-header .arrow11 {
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}
.header1 {
    background: #ffffff !important;
    color: #232323;
}
.header1 a {
    color: #232323;
}
.header1 .navbar-collapse{
    display: block !important;
}
.header1 .navbar-nav{
    float: right;
}
.header2 {
    background: #ffffff;
    padding: 0px 0px 0px 60px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    width: 1440px;
    position: relative;
}
.header2 .menu {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    flex-shrink: 0;
    position: relative;
}
.header2 .nav-item .nav-link:hover{
    background: #5bc5f2;
    color: #ffffff;
}
.header2 .li-menu {
    color: #000000;
    text-align: left;
    font: 600 16px "Quicksand-semibold", sans-serif;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    padding: 0;
}
.header2 .li-menu a {
    color: #000000;
    text-decoration: none;
    padding: 26px 16px 26px 16px;
}
.header2 .li-menu-btn a {
    padding: 21px 16px 21px 16px;
}
.header2 .li-menu-btn a i{
    font-size: 24px;
    vertical-align: middle;
    margin-right: 3px;
}
.header2 .li-menu-double a {
    padding: 16px;
}
.header2 .nav-item .nav-link{
    font: 600 16px "Quicksand-semibold", sans-serif;
    color: #000000;
    text-decoration: none;
    padding: 26px 19px 26px 19px;
}
.header2 .li-menu a:hover {
    background-color: #ffffff;
    color: #5bc5f2;
}
.header2 .nav-item .nav-link:hover{
    background-color: #ffffff;
    color: #5bc5f2;
}
.header2{
    background-color: #ffffff !important;
}
.header2 .navbar-nav{
    margin-right: 0 !important;
}
.header2 .li-menu-demo a{
    background: #5bc5f2;
    color: #ffffff;
}
.header2 .li-menu-demo a:hover{
    color: #000000;
    background: #5bc5f2;
}
.menu{
    position: sticky;
    top: 0px;
}
.dropdown-item:focus, .dropdown-item:hover {
    color: #5bc5f2;
    background-color: #ffffff;
}
h2{
    margin: 0;
}
h3{
    margin: 0;
}
h4{
    margin: 0;
}


/* POURQUOI */

.pourquoi{
    text-align: center;
}
.pourquoi .intro{
    width: 1440px;
    height: 633px;
    background-image: url("../images/background-intro.jpg");
    font: 48px 'Quicksand', sans-serif;
    color: #47267F;
    text-align: left;
    padding-top: 155px;
    padding-left: 665px;
}
.pourquoi .intro img{
    margin-bottom: 20px;
}
.pourquoi .intro b{
    font: 48px 'Quicksand-bold', sans-serif;
}
.pourquoi .intro b.underline{
    text-decoration: underline;
    text-decoration-color: #5bc5f2;
    text-decoration-thickness: 5px;
}
.pourquoi .intro .baseline{
    margin-top: 10px;
    letter-spacing: 6px;
    font: 18px 'Quicksand', sans-serif;
    text-transform: uppercase;
    color: #232323;
}
.pourquoi .blocs{
    width: 1110px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 10px;
}
.pourquoi .bloc{
    float: left;
    width: 255px;
    height: 175px;
    text-align: center;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    margin-right: 20px;
    font: 18px 'Quicksand', sans-serif;
    color: #47267F;
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 8px;
}
.pourquoi .bloc b{
    font: 18px 'Quicksand-bold', sans-serif;
}
.pourquoi .bloc .picto{
    margin-top: 15px;
    margin-bottom: 10px;
}
.bloc-bleu{
    background-color: #d8f1fc;
}
.bloc-violet{
    background-color: #d3cbe0;
}
.pourquoi .btn-demo{
    margin-top: 50px;
    margin-bottom: 50px;
}
.pourquoi .btn-demo a{
    font: 20px 'Quicksand-bold', sans-serif;
    background-color: #5bc5f2;
    padding: 15px;
    margin-top: 30px;
    color: #232323;
    text-decoration: none;
}
.pourquoi .definition-bloc{
    background-color: #ffffff;
    background-image: url("../images/background-definition.jpg");
    background-position: 0;
    background-repeat: no-repeat;
    min-height: 582px;
}
.pourquoi .definition-inner-bloc{
    width: 580px;
    margin-left: 670px;
    text-align: left;
    padding-top: 50px;
}
.pourquoi .definition-inner{
    margin-top: 20px;
}
.pourquoi .definition-inner-bloc .text-bottom{
    margin-top: 20px;
}
.pourquoi .definition-inner-bloc{
    width: 580px;
    margin-left: 670px;
    text-align: left;
    padding-top: 90px;
    font: 18px 'Quicksand', sans-serif;
}
.pourquoi .definition-inner-bloc .definition-numero{
    float: left;
    width: 48px;
    position: relative;
    color: #5bc5f2;
    font: 40px "Quicksand", sans-serif;
    margin-right: 10px;
}
.pourquoi .definition-inner-bloc .definition-texte{
    float: left;
    width: 450px;
}
.pourquoi .pourquoi-beone{
    margin-bottom: 50px;
}
.pourquoi .pourquoi-beone-titre{
    text-align: center;
    font: 36px 'Quicksand-bold', sans-serif;
    margin-bottom: 15px;
    width: 1070px;
    margin-left: auto;
    margin-right: auto;
}
.pourquoi .pourquoi-beone-description{
    width: 1070px;
    margin-left: auto;
    margin-right: auto;
    font: 18px 'Quicksand', sans-serif;
    margin-bottom: 40px;
}
.pourquoi .pourquoi-beone-description b{
    font: 18px 'Quicksand-bold', sans-serif;
}
.pourquoi .pourquoi-beone-blocs{
    margin-left: 195px;
}
.pourquoi .pourquoi-beone-bloc{
    float: left;
    width: 520px;
    margin-right: 50px;
    text-align: left;
}
.pourquoi .pourquoi-beone-soustitre{
    font: 24px 'Quicksand-bold', sans-serif;
    margin-bottom: 15px;
    color: #47267F;
}
.pourquoi .pourquoi-beone-text{
    font: 18px 'Quicksand', sans-serif;
}
.pourquoi .pourquoi-beone-text b{
    font: 18px 'Quicksand-bold', sans-serif;
}
.pourquoi .pourquoi-beone-text img{
    margin-bottom: 15px;
}
.pourquoi ul {
    list-style: none;
    margin-top: 10px;
}
.pourquoi ul li::before {
    content: "•";
    color: #47267F;
    display: inline-block;
    width: 1em;
    margin-left: -1em
}
.pourquoi ul li {
    margin-bottom: 5px;
}




/* FONCTIONNALITES */

.fonctionnalites {
    width: 1440px;
    position: relative;
    background-size: 100% 100%;
    height: 534px;
}
.fonctionnalites .titre {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    justify-content: flex-start;
    position: absolute;
    left: 325px;
    top: 24px;
}
.fonctionnalites .be-one-concr-tement-c-est-quoi {
    color: #000000;
    text-align: center;
    font: 700 36px 'Quicksand-bold', sans-serif;
    position: relative;
}
.fonctionnalites .c-est-l-union-de-ces-4-fonctionnalit-s {
    color: #232323;
    text-align: center;
    font: 400 24px 'Quicksand-semibold', sans-serif;
    position: relative;
}
.fonctionnalites .ct-as {
    display: flex;
    flex-direction: row;
    gap: 12px;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 298.5px;
    top: 145px;
}
.fonctionnalites .onglet1,
.fonctionnalites .onglet2,
.fonctionnalites .onglet3,
.fonctionnalites .onglet4 {
    border-radius: 12px;
    padding: 4px 0px 4px 0px;
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    font: 700 20px 'Quicksand', sans-serif;
}
.fonctionnalites .active {
    padding: 4px 12px 4px 12px;
    font: 700 20px 'Quicksand-bold', sans-serif;
}
.fonctionnalites .active a {
    color: #000000;
    text-align: center;
    text-decoration: none;
}
.fonctionnalites .ellipse-2 {
    background: #000000;
    border-radius: 50%;
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    position: relative;
}
.fonctionnalites .bdd-rcu2 {
    color: #000000;
    text-align: center;
    font: 400 20px 'Quicksand', sans-serif;
    position: relative;
    text-decoration: none;
}
.fonctionnalites .ellipse-3 {
    background: #000000;
    border-radius: 50%;
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    position: relative;
}
.fonctionnalites .ellipse-4 {
    background: #000000;
    border-radius: 50%;
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    position: relative;
}
.fonctionnalites .rubrique {
    display: flex;
    flex-direction: row;
    gap: 28px;
    align-items: flex-start;
    justify-content: flex-start;
    position: absolute;
    left: 181px;
    top: 207px;
}
.fonctionnalites .bloc-txt {
    background: #ffffff;
    border-radius: 8px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    width: 515px;
    height: 268px;
    position: relative;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    overflow: hidden;
}
.fonctionnalites .txt {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: stretch;
    flex: 1;
    position: relative;
    color: #232323;
    font: 20px 'Quicksand', sans-serif;
}
.fonctionnalites .txt b {
    font: 20px 'Quicksand-bold', sans-serif;
}
.fonctionnalites .une-connaissance-unifi-e-du-consommateur {
    color: #000000;
    text-align: left;
    font: 700 24px 'Quicksand-bold', sans-serif !important;
    position: relative;
    align-self: stretch;
}
.fonctionnalites .centraliser-rcu {
    color: #232323;
    text-align: left;
    position: relative;
    align-self: stretch;
}
.fonctionnalites .rcu-r-f-rentiel-unique-contact-aussi-appel-customer-data-platform {
    color: #232323;
    text-align: left;
    font: 400 16px 'Quicksand', sans-serif;
    position: relative;
    align-self: stretch;
}
.fonctionnalites .cta {
    padding: 16px 24px 16px 24px;
    display: flex;
    flex-direction: row;
    gap: 12px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    color: #232323;
    font: 400 16px 'Quicksand-bold', sans-serif;
    text-decoration: none;
}
.fonctionnalites .icon {
    font-size: 24px;
}
.fonctionnalites .ellipse-5 {
    background: #232323;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    position: absolute;
    left: 176px;
    top: 16px;
}
.fonctionnalites .arrow {
    position: absolute;
    left: 180px;
    top: 20px;
    overflow: visible;
}
.fonctionnalites .img {
    flex-shrink: 0;
    width: 535px;
    height: 535px;
    position: static;
}
.fonctionnalites .visuel {
    border-radius: 8px;
    width: 535px;
    height: 268px;
    position: absolute;
    left: 543px;
    top: 0px;
}
.fonctionnalites .onglet1,
.fonctionnalites .onglet2,
.fonctionnalites .onglet3,
.fonctionnalites .onglet4 {
    border-radius: 0;
    padding: 4px 0px 4px 0px;
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    font: 700 20px 'Quicksand', sans-serif;
}
.fonctionnalites .onglet1 a,
.fonctionnalites .onglet2 a,
.fonctionnalites .onglet3 a,
.fonctionnalites .onglet4 a {
    color: #000000;
    font: 700 20px 'Quicksand', sans-serif;
    text-decoration: none;
    cursor: pointer;
}
.fonctionnalites .onglet1.active {
    background: #f5d678;
    padding: 4px 12px 4px 12px;
}
.fonctionnalites .onglet1.active a {
    color: #000000;
    text-align: center;
    text-decoration: none;
    font: 700 20px 'Quicksand-bold', sans-serif;
}
.fonctionnalites .onglet2.active {
    background: #d580cc;
    padding: 4px 12px 4px 12px;
}
.fonctionnalites .onglet2.active a {
    color: #000000;
    text-align: center;
    text-decoration: none;
    font: 700 20px 'Quicksand-bold', sans-serif;
}
.fonctionnalites .onglet3.active {
    background: #8bc7ae;
    padding: 4px 12px 4px 12px;
}
.fonctionnalites .onglet3.active a {
    color: #000000;
    text-align: center;
    text-decoration: none;
    font: 700 20px 'Quicksand-bold', sans-serif;
}
.fonctionnalites .onglet4.active {
    background: #6a8fc1;
    padding: 4px 12px 4px 12px;
}
.fonctionnalites .onglet4.active a {
    color: #000000;
    text-align: center;
    text-decoration: none;
    font: 700 20px 'Quicksand-bold', sans-serif;
}
#fct-rcu{
    background-color: #f6e1a1;
    background-image: url("../images/background-fonctionnalites1.png");
    background-size: 100%;
}
#fct-fid{
    display: none;
    background-color: #e0a6da;
    background-image: url("../images/background-fonctionnalites2.png");
    background-size: 100%;
}
#fct-anim{
    display: none;
    background-color: #aed6c5;
    background-image: url("../images/background-fonctionnalites3.png");
    background-size: 100%;
}
#fct-pilot{
    display: none;
    background-color: #97b0d2;
    background-image: url("../images/background-fonctionnalites4.png");
    background-size: 100%;
}
.fonctionnalites .cta1 {
    background: #f5d678;
}
.fonctionnalites .cta2 {
    background: #d580cc;
}
.fonctionnalites .cta3 {
    background: #8bc7ae;
}
.fonctionnalites .cta4 {
    background: #6a8fc1;
}
.fonctionnalites .une-connaissance-unifi-e-du-consommateur b {
    font: 700 22px 'Quicksand-bold', sans-serif !important;
}
.fonctionnalites ul.pink {
    list-style: none;
}
.fonctionnalites ul.pink li::before {
    content: "•";
    color: #d580cc;
    display: inline-block;
    width: 1em;
    margin-left: -1em
}
#fct{
    width: 1440px;
    height: 535px;
}
.fonctionnalites-mobile{
    display: none;
}


/* ECOSYSTEME */

.ecosysteme {
    width: 1440px;
    height: 1568px;
    left: 0;
}
.ecosysteme .overlap-3 {
    background-color: #fff;
    width: 1440px;
    height: 1568px;
    position: relative;
}
.ecosysteme .overlap-4 {
    width: 1236px;
    height: 1018px;
    position: absolute;
    top: 66px;
    left: 73px;
}
.ecosysteme .ellipse-6 {
    width: 1236px;
    height: 910px;
    position: absolute;
    top: 108px;
    left: 0;
}
.ecosysteme .ellipse-7 {
    border: 16px solid;
    border-radius: 110px;
    width: 220px;
    height: 220px;
    position: absolute;
    top: 155px;
    left: 730px;
    border-color: #5bc5f2;
}
.ecosysteme .BE-ONE-rubrique {
    object-fit: cover;
    width: 338px;
    height: 418px;
    position: absolute;
    top: 0px;
    left: 762px;
}
.ecosysteme .titre-5 {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    width: 743px;
    display: flex;
    position: absolute;
    top: 0;
    left: 111px;
}
.ecosysteme .text-wrapper-27 {
    align-self: stretch;
    margin-top: -1px;
    position: relative;
    color: #000000;
    font: 700 36px 'Quicksand-bold', sans-serif;
}
.ecosysteme .elle-est-compos-e-de-3 {
    letter-spacing: 0;
    align-self: stretch;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.ecosysteme .text-wrapper-25 {
    color: #232323;
    font: 24px 'Quicksand-semibold', sans-serif;
}
.ecosysteme .text-wrapper-25 b {
    color: #232323;
    font: 24px 'Quicksand-bold', sans-serif;
}
.ecosysteme .les-outils {
    letter-spacing: 0;
    width: 528px;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    position: absolute;
    top: 247px;
    left: 111px;
}
.ecosysteme .text-wrapper-14 {
    color: #232323;
    font: 18px 'Quicksand', sans-serif;
}
.ecosysteme .text-wrapper-14 b {
    font: 18px 'Quicksand-bold', sans-serif;
}
.ecosysteme .partie-7 {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    position: absolute;
    top: 197px;
    left: 111px;
}
.ecosysteme .partie-6 {
    letter-spacing: 5.76px;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.ecosysteme .text-wrapper-24 {
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
    font: 24px 'Quicksand-bold', sans-serif;
}
.ecosysteme .lco-systme {
    position: absolute !important;
    top: 311px !important;
    left: 111px !important;
}
.ecosysteme .l-co-syst-me {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    position: relative;
}
.ecosysteme .l-co-syst-me .element-parties {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    position: relative;
}
.ecosysteme .l-co-syst-me .elle-est-compos-e-de {
    width: 590px;
    margin-top: -1px;
    position: relative;
    font: 700 18px 'Quicksand', sans-serif;
}
.ecosysteme .l-co-syst-me .elle-est-compos-e-de b {
    font: 700 18px 'Quicksand-bold', sans-serif;
}
.ecosysteme ul.blue li b{
    font: 700 18px 'Quicksand-bold', sans-serif;
}
.ecosysteme .l-co-syst-me .CT-as {
    align-items: center;
    gap: 12px;
    width: -moz-fit-content;
    width: fit-content;
    height: 33px;
    display: flex;
    position: relative;
}
.ecosysteme .l-co-syst-me .class {
    background-color: #5bc5f2;
}
.ecosysteme .onglet.active {
    padding: 4px 12px;
    font: 700 20px 'Quicksand-bold', sans-serif;
    background-color: #5bc5f2;
}
.ecosysteme .onglet {
    align-items: flex-start;
    gap: 10px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    position: relative;
    font: 700 20px 'Quicksand', sans-serif;
}
.ecosysteme .onglet a {
    letter-spacing: 0;
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    position: relative;
    color: #232323;
    text-decoration: none;
    cursor: pointer;
    font: 700 20px 'Quicksand', sans-serif;
}
#bloc-ecouter{
    display: none;
}
#bloc-animer{
    display: none;
}
#bloc-piloter{
    display: none;
}
.ecosysteme .logo-ecouter{
    width: 120px;
}
.ecosysteme .bloc-ecouter-logos{
    float: left;
    width: 270px;
}
.ecosysteme .bloc-ecouter-logos2{
    float: left;
    width: 270px;
}
#bloc-animer .logo-animer-1{
    width: 220px;
    height: 90px;
}
#bloc-animer .logo-animer-2{
    width: 145px;
    height: 90px;
}
#bloc-ecouter .bloc-txt {
    width: 475px;
}
#bloc-ecouter .div-ecouter{
    text-align: center;
}
#bloc-animer ul.blue {
    list-style: none;
    font: 18px 'Quicksand', sans-serif;
}
#bloc-animer ul.blue li {
    margin-bottom: 10px;
}
#bloc-animer ul.blue li::before {
    content: "•";
    color: #5bc5f2;
    display: inline-block;
    width: 1em;
    margin-left: -1em
}
#bloc-piloter .bloc-txt{
    width: 560px;
}
#bloc-piloter .property-1-piloter,
.logo-piloter{
    width: 450px;
    height: 125px;
}
#btn-infra,
#btn-flux,
#btn-equipes,
#btn-process{
    cursor: pointer;
}
.ecosysteme .l-co-syst-me .ellipse {
    border-radius: 2px;
    min-width: 4px;
    height: 4px;
    position: relative;
    background-color: #000000;
}
.ecosysteme .onglet.defaut {
    padding: 4px 0;
}
.ecosysteme .l-co-syst-me .rubrique {
    background-color: #fff;
    border-radius: 8px;
    align-items: flex-start;
    gap: 68px;
    width: 1072px;
    padding: 28px;
    display: flex;
    position: relative;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
}
.ecosysteme .l-co-syst-me .bloc-txt {
    border-radius: 8px;
    flex: 1;
    gap: 16px;
    display: block;
    position: relative;
    overflow: hidden;
    width: 545px;
    float: left;
}
.ecosysteme .l-co-syst-me .TXT-2 {
    flex-direction: column;
    align-self: stretch;
    align-items: flex-start;
    gap: 8px;
    display: flex;
    position: relative;
}
.ecosysteme .l-co-syst-me .trouver-un-titre {
    align-self: stretch;
    margin-top: -1px;
    position: relative;
    color: #47267F;
    font: 700 24px 'Quicksand-bold', sans-serif;
    margin-bottom: 5px;
}
.ecosysteme .l-co-syst-me .collecter, .l-co-syst-me .animer {
    letter-spacing: 0;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
}
.ecosysteme .l-co-syst-me .be-one-collecte-les {
    align-self: stretch;
    position: relative;
}
.ecosysteme .l-co-syst-me .span-2 {
    color: #232323;
    font: 18px 'Quicksand', sans-serif;
}
.ecosysteme .l-co-syst-me .span-2 b {
    color: #232323;
    font: 18px 'Quicksand-bold', sans-serif;
}
.ecosysteme .l-co-syst-me .property-1-pilote,
.ecosysteme .l-co-syst-me .property-1-collecter,
.ecosysteme .l-co-syst-me .property-1-animer {
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 448px;
    padding-left: 20px;
}
.ecosysteme .l-co-syst-me .exemple-de-logo {
    display: flex;
    position: relative;
}
.ecosysteme .l-co-syst-me .div-2 {
    flex-direction: column;
    align-self: stretch;
    align-items: center;
    gap: 16px;
    display: flex;
    position: relative;
}
.ecosysteme .l-co-syst-me .text-wrapper-4 {
    text-align: center;
    align-self: stretch;
    margin-top: -1px;
    position: relative;
    font: 18px 'Quicksand-bold', sans-serif;
}
.ecosysteme .l-co-syst-me .overlap-group-wrapper {
    align-self: stretch;
    min-width: 448px;
    height: 88px;
    position: relative;
}
.ecosysteme .l-co-syst-me .overlap-group {
    width: 464px;
    height: 104px;
    position: relative;
    top: -6px;
    left: -6px;
}
.ecosysteme .l-co-syst-me .logo-3 {
    width: 160px;
    height: 104px;
    position: absolute;
    top: 0;
    left: 0;
}
.ecosysteme .l-co-syst-me .exemple-de-logo.property-1-ecouter .logo-4,
.ecosysteme .l-co-syst-me .exemple-de-logo.property-1-pilote .logo-4,
.ecosysteme .l-co-syst-me .exemple-de-logo.property-1-collecter .logo-4 {
    width: 160px;
    left: 152px;
}
.ecosysteme .l-co-syst-me .logo-4 {
    height: 104px;
    position: absolute;
    top: 0;
}
.ecosysteme .l-co-syst-me .logo-5 {
    width: 160px;
    height: 104px;
    position: absolute;
    top: 0;
    left: 304px;
}
.ecosysteme .l-co-syst-me .logo-6 {
    width: 160px;
    height: 104px;
    position: absolute;
    top: 0;
    left: 0;
}
.ecosysteme .l-co-syst-me .logo-7 {
    width: 160px;
    height: 104px;
    position: absolute;
    top: 0;
    left: 152px;
}
.ecosysteme .l-co-syst-me .liste-non-exhaustive {
    text-align: center;
    align-self: stretch;
    position: relative;
    font-family: Quicksand, Helvetica;
    font-size: 16px;
}
.ecosysteme .les-technologies {
    letter-spacing: 0;
    width: 646px;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    position: absolute;
    top: 1185px;
    left: 184px;
}
.ecosysteme .text-wrapper-14 {
    color: #232323;
}
.ecosysteme .text-wrapper-19 {
}
.ecosysteme .text-wrapper-14 {
    color: #232323;
}
.ecosysteme .partie-8 {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    position: absolute;
    left: 184px;
    top: 1130px;
}
.ecosysteme .partie-6 {
    letter-spacing: 5.76px;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.ecosysteme .text-wrapper-24 {
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
}
.ecosysteme .cards {
    align-items: flex-start;
    gap: 16px;
    width: 1072px;
    display: flex;
    position: absolute;
    top: 1229px;
    left: 184px;
}
.ecosysteme .card-2 {
    border-radius: 8px;
    flex-direction: column;
    flex: 1;
    justify-content: center;
    align-items: center;
    gap: 24px;
    height: 264px;
    padding: 40px 16px;
    display: flex;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.16) 2px 2px 8px 0px;
}
.ecosysteme .icon-title {
    flex-direction: column;
    align-self: stretch;
    align-items: center;
    gap: 4px;
    display: flex;
    position: relative;
    font: 22px "Quicksand-semibold", sans-serif;
}
.ecosysteme .element-3 {
    background-color: #fff;
    min-width: 48px;
    height: 48px;
    position: relative;
}
.ecosysteme .vector {
    width: 47px;
    height: 40px;
    position: absolute;
    top: 0;
    left: 0;
}
.ecosysteme .text-wrapper-29 {
    text-align: center;
    align-self: stretch;
    position: relative;
}
.ecosysteme .CTA {
    justify-content: center;
    align-items: center;
    gap: 12px;
    width: -moz-fit-content;
    width: fit-content;
    padding: 16px 24px;
    display: flex;
    position: relative;
    background-color: #5bc5f2;
    text-decoration: none;
    color: #232323;
}
.ecosysteme .CTA .text {
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -.5px;
    position: relative;
    font: 18px "Quicksand-bold", sans-serif;
}
.ecosysteme .CTA .icon {
    background-color: #232323;
    border-radius: 12px;
    min-width: 24px;
    height: 24px;
    position: relative;
}
.ecosysteme .CTA .arrow {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 4px;
    left: 4px;
}
.ecosysteme .design-component-instance-node {
    margin-bottom: -4px !important;
}
.ecosysteme .element-3 {
    background-color: #fff;
    min-width: 48px;
    height: 48px;
    position: relative;
}
.ecosysteme .vector-2 {
    width: 41px;
    height: 39px;
    position: absolute;
    top: 7px;
    left: 0;
}
.ecosysteme .vector-3 {
    width: 43px;
    height: 46px;
    position: absolute;
    top: 0px;
    left: 0px;
}


/* APPROCHE */

.notre-approche {
    width: 1440px;
    height: 1980px;
    background-color: #d8f1fc;
    background-image: url("../images/fond-bulle.png");
    background-position: 0px 175px;
    background-repeat: no-repeat;
}
.notre-approche .cas-clients {
    width: 1260px;
    height: 243px;
    margin-left: 185px;
    margin-top: 40px;
}
.notre-approche .sous-titre-2 {
    justify-content: center;
    align-items: center;
    gap: 30px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
}
.notre-approche .line-3 {
    object-fit: cover;
    min-width: 348px;
    height: 1px;
    position: relative;
}
.notre-approche .eux-aussi-ont-choisi {
    letter-spacing: 0;
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 20px;
    font-weight: 700;
    line-height: normal;
    position: relative;
    text-transform: uppercase;
}
.notre-approche .overlap-group-4 {
    width: 1255px;
    height: 198px;
}
.notre-approche .card-clients {
    width: 1255px;
    overflow-x: scroll;
    display: block;
    padding-top: 30px;
    overflow: hidden;
    height: 230px;
}
.notre-approche .card {
    border-radius: 8px;
    align-items: center;
    gap: 34px;
    padding: 20px;
    display: block;
    position: relative;
    overflow: hidden;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    width: 290px;
    height: 195px;
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}
#card1, #card2, #card3, #card4{
    display: block;
}
#card5, #card6, #card7, #card8, #card9, #card10, #card11{
    display: none;
}
.notre-approche .IMG-logo {
    max-width: 250px;
    max-height: 65px;
}
.notre-approche .card-logo{
    text-align: center;
}
.notre-approche .line-4 {
    object-fit: cover;
    align-self: stretch;
    width: 1px;
    height: 138px;
    position: relative;
    float: left;
}
.notre-approche .descriptif {
    margin-top: 10px;
    text-align: center;
}
.notre-approche .p-4 {
    letter-spacing: 0;
    align-self: stretch;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 20px;
    font-weight: 400;
    line-height: normal;
    position: relative;
    padding: 0 !important;
}
.notre-approche .list {
    flex-direction: column;
    align-self: stretch;
    align-items: flex-start;
    display: flex;
    position: relative;
}
.notre-approche .bullet-point-2 {
    align-self: stretch;
    align-items: center;
    gap: 8px;
    display: flex;
    position: relative;
}
.notre-approche .ellipse-3 {
    border-radius: 2px;
    min-width: 4px;
    height: 4px;
    position: relative;
    background-color: #5bc5f2;
}
.notre-approche .CTA-arrow-2 {
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    margin-left: 980px;
    margin-top: -230px;
}
.notre-approche .CTA-5 {
    background-color: #5bc5f2;
    border-radius: 20px;
    min-width: 40px;
    height: 40px;
    position: relative;
}
.notre-approche .arrow-5 {
    width: 5px;
    height: 9px;
    margin-left: 16px;
    margin-top: 10px;
}
.notre-approche .overlap-2 {
    margin-top: 160px;
    text-align: center;
}
.notre-approche .IMG-computer-home {
    width: 824px;
    height: 519px;
}
.notre-approche .exemples{
    background-image: url("../images/img-computer-home.png");
    background-repeat: no-repeat;
    background-position: 130px 15px;
    padding-bottom: 50px;
}
.notre-approche .partie {
    text-align: left;
}
.notre-approche .partie-2 {
    flex-direction: column;
    align-items: center;
    gap: 4px;
    display: flex;
}
.notre-approche .partie-3 {
    letter-spacing: 5.76px;
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche .l-approche {
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
    font: 700 36px 'Quicksand-bold', sans-serif;
    margin-bottom: 10px;
}
.notre-approche .bloc-indispensables {
    flex-direction: column;
    align-items: flex-start;
    width: 670px;
    display: flex;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    float:  left;
    margin-left: 180px;
    background-color: #ffffff;
}
.notre-approche .titre-2 {
    border-radius: 8px 8px 0 0;
    flex-direction: column;
    text-align: left;
    align-self: stretch;
    align-items: flex-start;
    gap: 4px;
    padding: 12px;
    display: flex;
    position: relative;
    overflow: hidden;
    background-color: #5bc5f2;
    font: 24px "Quicksand-bold", sans-serif;
    color: #ffffff;
}
.notre-approche .bloc-2 {
    border-radius: 0 0 8px 8px;
    gap: 28px;
    padding: 20px;
    position: relative;
    overflow: hidden;
    font: 20px "Quicksand", sans-serif;
    background-color: #ffffff;
    width: 670px;
}
.notre-approche .div-6 {
    float: left;
    position: relative;
}
.notre-approche .bullets {
    flex-direction: column;
    align-self: stretch;
    align-items: flex-start;
    gap: 4px;
    height: 152px;
    display: flex;
    position: relative;
}
.notre-approche .bullet-point-3 {
    align-self: stretch;
    align-items: baseline;
    gap: 8px;
    display: flex;
    position: relative;
}
.notre-approche .ellipse-4 {
    border-radius: 4px;
    min-width: 8px;
    height: 8px;
    position: relative;
    background-color: #5bc5f2;
}
.notre-approche .bullet-point-4 {
    align-self: stretch;
    align-items: baseline;
    gap: 8px;
    height: 75px;
    display: flex;
    position: relative;
}
.notre-approche .p-5 {
    letter-spacing: 0;
    flex: 1;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche .line-5 {
    object-fit: cover;
    display: block;
    min-width: 1px;
    height: 225px;
    position: relative;
    float: left;
    margin-right: 20px;
    margin-left: 20px;
}
.notre-approche .div-6 {
    display: block;
    float: left;
    position: relative;
    height: 230px;
    width: 290px;
}
.notre-approche .bullet {
    flex-direction: column;
    align-self: stretch;
    align-items: flex-start;
    gap: 4px;
    display: flex;
    position: relative;
}
.notre-approche .p-6 {
    letter-spacing: 0;
    flex: 1;
    align-self: stretch;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche .bloc-additionnels {
    flex-direction: column;
    align-items: flex-start;
    width: 380px;
    display: flex;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    float:  left;
    margin-left: 20px;
}
.notre-approche .titre-3 {
    border-radius: 8px 8px 0 0;
    flex-direction: column;
    justify-content: center;
    align-self: stretch;
    align-items: flex-start;
    gap: 4px;
    height: 55.06px;
    padding: 12px;
    display: flex;
    position: relative;
    overflow: hidden;
    background-color: #5bc5f2;
    font: 24px "Quicksand-bold", sans-serif;
    color: #ffffff;
}
.notre-approche .tarif-fixe-wrapper {
    border-radius: 0 0 8px 8px;
    align-self: stretch;
    align-items: flex-start;
    gap: 4px;
    padding: 20px;
    display: flex;
    position: relative;
    overflow: hidden;
    font: 20px "Quicksand", sans-serif;
    background-color: #ffffff;
}
.notre-approche .tarif-fixe {
    flex-direction: column;
    flex: 1;
    align-items: flex-start;
    gap: 12px;
    height: 250px;
    display: flex;
    position: relative;
}
.notre-approche .bullet {
    flex-direction: column;
    align-self: stretch;
    align-items: flex-start;
    gap: 4px;
    display: flex;
    position: relative;
    font: 18px "Quicksand", sans-serif;
}
.notre-approche .onglets {
    align-items: center;
    gap: 12px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
}
.notre-approche .onglet {
    align-items: flex-start;
    gap: 10px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    position: relative;
    padding: 10px;
    font: 700 20px 'Quicksand', sans-serif;
}
.notre-approche .onglet a {
    text-decoration: none;
    color: #232323;
}
.tarification-btn.active {
    background-color: #5bc5f2 !important;
    font: 700 20px 'Quicksand-bold', sans-serif;
    padding: 4px 8px;
}
.tarification-btn  {
    cursor: pointer;
}
#tarification-frame1{
    display: none;
}
#tarification-frame2{
    display: block;
}
.tarification-frame{

}
.notre-approche .ellipse-5 {
    background-color: #000;
    border-radius: 2px;
    min-width: 4px;
    height: 4px;
    position: relative;
}
.notre-approche .onglet .BDD-RCU {
    letter-spacing: 0;
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    position: relative;
}
.notre-approche .exemple {
    border-radius: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    width: 518px;
    padding: 19px 21px;
    display: flex;
    overflow: hidden;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    background-color: #ffffff;
    margin-left: 635px;
    margin-top: 25px;
    font: 18px "Quicksand", sans-serif;
}
.notre-approche .exemple-pour-une {
    letter-spacing: 0;
    align-self: stretch;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche  .text-wrapper-5 {
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    position: relative;
    color: #000000;
    text-align: center;
    font: 700 36px 'Quicksand-bold', sans-serif;
}
.notre-approche .text-wrapper-7 {
    font: 20px "Quicksand-bold", sans-serif;
}
.notre-approche .text-wrapper-8 {
    font-weight: 300;
}
.notre-approche .text-wrapper-9 {
    letter-spacing: 0;
    flex: 1;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche .text-wrapper-10 {
    text-align: center;
    font: 18px 'Quicksand-bold', sans-serif;
    padding-top: 20px;
}
.notre-approche .text-wrapper-11 {
    letter-spacing: 0;
    align-self: stretch;
    margin-top: -12px;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
    position: relative;
    margin-top: 0px;
}
.notre-approche .text-wrapper-12 {
    letter-spacing: 0;
    align-self: stretch;
    margin-top: -1px;
    line-height: normal;
    position: relative;
    font: 20px "Quicksand-bold", sans-serif;
    text-align: left;
    padding-bottom: 10px;
}
.notre-approche .text-wrapper-13 {
    flex: 1;
    margin-top: -1px;
    position: relative;
    font: 18px "Quicksand", sans-serif;
    text-align:  left;
}
.notre-approche .text-wrapper-14 {
    color: #232323;
    font: 18px "Quicksand", sans-serif;
}
.notre-approche .text-wrapper-14 b {
    color: #232323;
    font: 18px "Quicksand-bold", sans-serif;
}
.notre-approche .text-wrapper-15 {
}
.notre-approche .text-wrapper-16 {
    flex: 1;
    align-self: stretch;
    margin-top: -1px;
    position: relative;
}
.notre-approche .text-wrapper-17 {
    letter-spacing: 0;
    width: -moz-fit-content;
    width: fit-content;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
    position: relative;
    margin-top: 0px;
}
.notre-approche .text-wrapper-18 {
    text-align: center;
    font: 18px "Quicksand", sans-serif;
    padding-top: 20px;
}
.notre-approche .text-wrapper-18 b {
    font: 18px "Quicksand-bold", sans-serif;
}
.notre-approche .text-wrapper-19 {
    font: 18px "Quicksand-bold", sans-serif;
}
.notre-approche .text-wrapper-20 {
    color: #000;
}
.notre-approche .text-wrapper-21 {
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
    font: 16px "Quicksand", sans-serif;
}
.notre-approche .text-wrapper-22 {
    color: #000;
    letter-spacing: 0;
    font-family: Quicksand, Helvetica;
    font-size: 36px;
    font-weight: 400;
}
.notre-approche .text-wrapper-23 {
    font-size: 20px;
}
.notre-approche  .text-wrapper-24 {
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
    font: 24px "Quicksand-bold", sans-serif;
}
.notre-approche  .text-wrapper-25 {
    color: #232323;
    font: 24px 'Quicksand', sans-serif;
    text-align: center;
}
.notre-approche  .text-wrapper-25 b {
    color: #232323;
    font: 24px 'Quicksand-bold', sans-serif;
}
.notre-approche .prix {
    align-items: flex-start;
    gap: 10px;
    width: -moz-fit-content;
    width: fit-content;
    padding: 8px 21px;
    display: flex;
    position: relative;
}
.notre-approche .element-mois {
    letter-spacing: 0;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 36px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche .exemple-2 {
    border-radius: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    width: 484px;
    padding: 19px 21px;
    display: flex;
    overflow: hidden;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    background-color: #ffffff;
    margin-left: 765px;
    margin-top: 20px;
}
.notre-approche .exemple-pour-une {
    letter-spacing: 0;
    align-self: stretch;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    position: relative;
    margin-bottom: 5px;
}
.notre-approche .prix {
    align-items: flex-start;
    gap: 10px;
    width: -moz-fit-content;
    width: fit-content;
    padding: 8px 21px;
    display: flex;
    position: relative;
}
.notre-approche .element-mois {
    letter-spacing: 0;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 36px;
    font-weight: 400;
    line-height: normal;
    position: relative;
    background-color: #5bc5f2;
    padding: 8px 21px;
}
.notre-approche .IMG-convictions {
    width: 688px;
    height: 663px;
    float: left;
    margin-left: 55px;
}
.notre-approche .partie-4 {
    width: 546px;
    float: left;
    margin-left: 150px;
}
.notre-approche .une-m-thodologie {
    letter-spacing: 0;
    width: 544px;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    padding-top: 20px;
}
.notre-approche .element-convictions {
    width: 544px;
    position: relative;
}
.notre-approche .eight-convictions {
}
.notre-approche .CTA-arrow {
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    margin-left: 420px;
}
.notre-approche .element-convictions .default {
    background-color: #ced7e4;
}
.notre-approche .element-convictions .arrow-wrapper {
    border-radius: 20px;
    min-width: 40px;
    height: 40px;
    position: relative;
    cursor: pointer;
}
.notre-approche .element-convictions .arrow-2 {
    width: 5px;
    height: 9px;
}
.notre-approche .element-convictions .inactive {
    background-color: #5bc5f2;
}
.notre-approche .element-convictions .img-wrapper {
    border-radius: 20px;
    min-width: 40px;
    height: 40px;
    position: relative;
}
.notre-approche .element-convictions .arrow-2 {
    width: 5px;
    height: 9px;
    margin-left: 16px;
    margin-top: 12px;
}
.notre-approche .element-convictions .bloc-convictions {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 544px;
    height: 370px;
    display: flex;
    margin-bottom: 45px;
}
.notre-approche .element-convictions .bloc {
    justify-content: center;
    align-self: stretch;
    align-items: flex-start;
    gap: 12px;
    display: flex;
    position: relative;
}
.notre-approche .element-convictions .element-2 {
    width: 48px;
    margin-top: -2px;
    position: relative;
    color: #5bc5f2;
    font: 40px "Quicksand", sans-serif;
}
.notre-approche .element-convictions .TXT {
    flex-direction: column;
    flex: 1;
    align-items: flex-start;
    display: flex;
    position: relative;
}
.notre-approche .element-convictions .p-2 {
    align-self: stretch;
    position: relative;
    font: 18px "Quicksand-bold", sans-serif;
    padding: 0 !important;
    padding-bottom: 5px !important;
    margin: 0;
}
.notre-approche .element-convictions .p-3 {
    align-self: stretch;
    position: relative;
    font: 18px "Quicksand", sans-serif;
    padding: 0 !important;
    margin: 0;
}
.notre-approche .element-convictions .bloc {
    justify-content: center;
    align-self: stretch;
    align-items: flex-start;
    gap: 12px;
    display: flex;
    position: relative;
    margin-bottom: 10px;
}
.notre-approche .element-convictions .de-la-plateforme-be {
    letter-spacing: 0;
    align-self: stretch;
    font-family: Quicksand, Helvetica;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche .element-convictions .text-wrapper-2 {
    color: #232323;
}
.notre-approche .element-convictions .text-wrapper-3 {
}
.notre-approche .element-convictions .element-convictions-pour {
    font: 18px "Quicksand-bold", sans-serif;
}
.notre-approche  .partie-5 {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
}
.notre-approche  .partie-6 {
    letter-spacing: 5.76px;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -1px;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
.notre-approche  .titre-4 {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    margin-left: 362px;
    padding-top: 70px;
    padding-bottom: 120px;
}
.notre-approche  .elle-est-compos-e-de-2 {
    letter-spacing: 0;
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
    font-family: Quicksand, Helvetica;
    font-size: 24px;
    font-weight: 400;
    line-height: normal;
    position: relative;
}
#bloc-convictions-frame1{
    display: block;
}
#bloc-convictions-frame2{
    display: none;
}


/* FORMULAIRE */

.formulaire{
    text-align: center;
    margin-top: 50px;
    background-image: url("../images/ellipse-8.svg");
    background-repeat: no-repeat;
    background-position: 185px 140px;
    padding-bottom: 40px;
}
.formulaire .titre{
    text-align: center;
}
.formulaire .titre .text-wrapper-5{
    font: 36px "Quicksand-bold", sans-serif;
}
.formulaire .titre .text-wrapper-6{
    margin-top: 10px;
    font: 24px "Quicksand", sans-serif;
}
.formulaire .overlap-group-3 {
    width: 652px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    margin-top: 40px;
}
.formulaire .overlap-group-3 input[type=text],
.formulaire .overlap-group-3 input[type=email]{
    width: 310px;
    height: 65px;
    margin-right: 15px;
    margin-bottom: 10px;
    float: left;
}
.formulaire .overlap-group-3 textarea{
    width: 640px;
    height: 205px;
    clear: both;
}
.formulaire .CTA-wrapper{
    text-align: center;
}
.formulaire .CTA{
    background-color: #5bc5f2;
    text-decoration: none;
    font: 18px "Quicksand-bold", sans-serif;
    padding: 16px 24px;
    display: inline-block;
    margin-right: auto;
    margin-left: auto;
    color: #232323;
    margin-top: 25px;
}
.formulaire .CTA .text {
    float: left;
}
.formulaire .CTA .icon {
    background-color: #232323;
    border-radius: 12px;
    min-width: 24px;
    height: 24px;
    position: relative;
    float: left;
    margin-left: 10px;
}
.formulaire .CTA .arrow {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 4px;
    left: 4px;
}
#btn-send-form{
    border: none;
}


/* FOOTER */

.footer {
    background: #ffffff;
    border-style: solid;
    border-color: #5bc5f2;
    border-width: 2px 0px 0px 0px;
    padding: 20px 186px 20px 186px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 1440px;
    position: absolute;
    left: 0px;
    /*top: 7728px;*/
    overflow: hidden;
}
.footer .adresse {
    display: block;
    width: 1068px;
    position: relative;
}
.footer .logo {
    background: #ffffff;
    position: relative;
}
.footer .logo2 {
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}
.footer .le-lien-entre-fid-lit-omnicanale-et-engagement-par-kiss-the-bride {
    text-align: left;
    font: 400 12px "Quicksand", sans-serif;
    position: relative;
    align-self: stretch;
}
.footer .le-lien-entre-fid-lit-omnicanale-et-engagement-par-kiss-the-bride-span {
    color: #47267f;
    font: 400 12px "Quicksand", sans-serif;
}
.footer .le-lien-entre-fid-lit-omnicanale-et-engagement-par-kiss-the-bride-span2 {
    color: #232323;
    font: 400 12px "Quicksand", sans-serif;
}
.footer ._3-lieux {
    display: flex;
    flex-direction: row;
    gap: 12px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    width: 788px;
    position: relative;
}
.footer .lieux-1 {
    background: #ffffff;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    flex: 1;
    position: relative;
    overflow: hidden;
    width: 240px;
}
.footer .paris {
    color: #47267f;
    text-align: left;
    font: 700 24px "Quicksand-semibold", sans-serif;
    position: relative;
    align-self: stretch;
}
.footer ._158-ter-du-temple-75003-paris {
    color: #232323;
    text-align: left;
    font: 400 16px "Quicksand", sans-serif;
    position: relative;
    align-self: stretch;
}
.footer .t-l-phone {
    display: flex;
    flex-direction: row;
    gap: 4px;
    align-items: center;
    justify-content: flex-start;
    align-self: stretch;
    flex-shrink: 0;
    position: relative;
}
.footer .t-l-phone a{
    text-decoration: none;
    color: #232323;
}
.footer .t-l-phone a:hover {
    text-decoration: underline;
}
.footer .call {
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}
.footer .line-5 {
    border-style: solid;
    border-color: #5bc5f2;
    border-width: 0 1px 0 0;
    align-self: stretch;
    flex-shrink: 0;
    width: 60px;
    height: 130px;
    position: relative;
}
.footer .lieux-2 {
    background: #ffffff;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    flex: 1;
    position: relative;
    overflow: hidden;
    width: 240px;
}
.footer .lyon {
    color: #47267f;
    text-align: left;
    font: 700 24px "Quicksand-semibold", sans-serif;
    position: relative;
    align-self: stretch;
}
.footer ._100-all-e-des-fr-nes-69760-limonest {
    color: #232323;
    text-align: left;
    font: 400 16px "Quicksand", sans-serif;
    position: relative;
    align-self: stretch;
}
.footer .call2 {
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}
.footer .line-6 {
    border-style: solid;
    border-color: #5bc5f2;
    border-width: 0 1px 0 0;
    align-self: stretch;
    flex-shrink: 0;
    width: 25px;
    height: 130px;
    position: relative;
}
.footer .lieux-3 {
    background: #ffffff;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    flex: 1;
    position: relative;
    overflow: hidden;
    width: 240px;
}
.footer .lille {
    color: #47267f;
    text-align: left;
    font: 700 24px "Quicksand-semibold", sans-serif;
    position: relative;
    align-self: stretch;
}
.footer ._395-rue-du-g-n-ral-de-gaulle-59700-marcq-en-baroeul {
    color: #232323;
    text-align: left;
    font: 400 16px "Quicksand", sans-serif;
    position: relative;
    align-self: stretch;
    width: 220px;
}
.footer .call3 {
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}
.footer .newsletters {
    background: #f6f7f9;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    width: 1068px;
    position: relative;
}
.footer .champs-e-mail {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    align-self: stretch;
    flex-shrink: 0;
    position: relative;
}
#btn-send-news{
    border: none;
    padding: 0;
}
.footer .learn-more {
    color: #000000;
    text-align: left;
    font: 700 16px "Quicksand", sans-serif;
    position: relative;
    width: 332px;
}
.footer .input {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    width: 600px;
    position: relative;
}
.footer #news-email {
    color: #000000;
    text-align: left;
    font: 400 14px "Inter", sans-serif;
    opacity: 0.6;
    position: relative;
    flex: 1;
    background: #ffffff;
    border-radius: 6px 0px 0px 6px;
    border-style: solid;
    border-color: #ced7e4;
    border-width: 1px;
    padding: 16px 15px 15px 15px;
}
.footer .cta2 {
    display: flex;
    flex-direction: column;
    gap: 0px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
}
.footer .email-newsletter {
    color: #232323;
    text-align: center;
    font: 400 12px "Quicksand", sans-serif;
    position: relative;
    align-self: stretch;
}
.footer .email-newsletter a {
    text-decoration: none;
    color: #232323;
}
.footer .email-newsletter a:hover {
    text-decoration: underline;
}
.footer .sous-titre {
    display: flex;
    flex-direction: row;
    gap: 30px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1068px;
    position: relative;
    margin-top: 20px;
}
.footer .line-3 {
    border-style: solid;
    border-color: #000000;
    border-width: 1px 0 0 0;
    flex: 1;
    height: 0px;
    position: relative;
}
.footer .une-solution-kiss-the-bride {
    color: #000000;
    text-align: center;
    font: 700 16px "Quicksand-semibold", sans-serif;
    text-transform: uppercase;
    position: relative;
}
.footer .line-4 {
    border-style: solid;
    border-color: #000000;
    border-width: 1px 0 0 0;
    flex: 1;
    height: 0px;
    position: relative;
}
.footer .mentions-l-gales {
    display: flex;
    flex-direction: row;
    gap: 28px;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    margin-top: 20px;
}
.footer .text4 {
    color: #232323;
    text-align: left;
    font: 600 16px/150% "Quicksand", sans-serif;
    position: relative;
}
.footer .text4 a {
    text-decoration: none;
    color: #232323;
}
.footer .text4 a:hover {
    text-decoration: underline;
}
.footer .rs {
    display: flex;
    flex-direction: row;
    gap: 15px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    margin-top: 20px;
}
.footer .facebook {
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}
.footer .linkedin {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    position: static;
}
.footer .twitter {
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}
.footer .logo-wrapper{
    width: 385px;
    border-right: 1px solid #5BC5F2;
    float: left;
    margin-bottom: 15px;
}
.footer .logo-baseline{
    font: 18px "Quicksand", sans-serif;
}
.footer .villes{
    margin-top: 15px;
    margin-bottom: 15px;
    font: 18px "Quicksand-bold", sans-serif;
}
.footer .ville{
    font: 18px "Quicksand-bold", sans-serif;
    color: #47267F;
    float: left;
    border-right: 1px solid #5BC5F2;
    margin-left: 15px;
    padding-right: 25px;
}
.footer .ville-first{
    margin-left: 0;
}
.footer .ville-last{
    border-right: 0;
}
.footer .numtel{
    font: 22px "Quicksand", sans-serif;
}
.footer .footer-baseline{
    margin-left: 40px;
    float: left;
    width: 625px;
    font: 18px "Quicksand", sans-serif;
}
.footer .footer-baseline-titre{
    margin-top: 10px;
    font: 24px "Quicksand-bold", sans-serif;
    color: #47267F;
}
.footer .footer-baseline-cta{
    background-color: #5bc5f2;
    text-decoration: none;
    font: 18px "Quicksand-bold", sans-serif;
    padding: 16px 24px;
    display: inline-block;
    margin-right: auto;
    margin-left: auto;
    color: #232323;
    margin-top: 25px;
}
.footer .footer-baseline-cta .CTA {
    color: #232323;
    text-decoration: none;
}
.footer .footer-baseline-cta .text {
    float: left;
}
.footer .footer-baseline-cta .icon {
    background-color: #232323;
    border-radius: 12px;
    min-width: 24px;
    height: 24px;
    position: relative;
    float: left;
    margin-left: 10px;
}
.footer .footer-baseline-cta .arrow {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 4px;
    left: 4px;
}


/* MODAL */

.modal-title{
    font: 600 32px "Quicksand-semibold", sans-serif !important;
    padding-left: 25px;
    margin-bottom: 20px;
}
.modal-xl{
    width: 1070px;
}
.modal-header{
    border-bottom: 0;
    margin-top: 10px;
}
.modal-content{
    background-color: #ffffff;
    background-image: url("../images/backgroung-modal.png");
    background-position: 0px 109px;
    background-repeat: no-repeat;
    height: 895px;
}
.modal-header .btn-close {
    margin-right: 20px;
    color: #5bc5f2;
    background: transparent url("../images/btn-close.png") center/1em auto no-repeat;
    width: 42px;
    height: 42px;
    opacity: 1;
    background-size: 100% 100%;
}
#ecosystemeEquipesModal .modal-content{
    background-image: url("../images/backgroung-modal-equipe.png");
}
#ecosystemeProcessModal .modal-content{
    background-image: url("../images/backgroung-modal-process.png");
}

.modal-buttons{
    position: absolute;
    right: 25px;
    bottom: 30px;
}
.modal-buttons .arrow-wrapper {
    border-radius: 20px;
    min-width: 40px;
    height: 40px;
    position: relative;
    cursor: pointer;
    background-color: #5bc5f2;
    display: inline-block;
}
.modal-buttons .arrow {
    width: 5px;
    height: 9px;
    margin-left: 16px;
    margin-top: 12px;
}
.bloc-processes {
    margin-left: 77px;
    margin-top: 148px;
}
.bloc-process {
    width: 436px;
    height: 210px;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    background: #ffffff;
    border-radius: 8px;
    float: left;
    padding-left: 7px;
    padding-right: 7px;
    padding-top: 10px;
    margin-right: 20px;
    margin-bottom: 20px;
}
.bloc-process.bloc-process-bas {
    height: 180px;
}
.bloc-process .bloc-process-nombre {
    font: 42px 'Quicksand', sans-serif;
    color: #5bc5f2;
    text-align: center;
}
.bloc-process .bloc-process-titre {
    font: 20px 'Quicksand-bold', sans-serif;
    text-align: center;
    margin-bottom: 5px;
}
.bloc-process ul {
    list-style: none;
}
.bloc-process li::before {
    font: 20px 'Quicksand', sans-serif;
    content: "•";
    color: #5bc5f2;
    display: inline-block;
    width: 1em;
    margin-left: -1em
}


/* EXTERNAL PAGES */


.inner-moteurfidelite{
    background-color: #ffffff;
    background-image: url("../images/background-moteurfidelite.jpg");
    background-position: 0 0;
    background-repeat: no-repeat;
    min-height: 850px;
}
.inner-animationmarketing{
    background-color: #ffffff;
    background-image: url("../images/background-animationmarketing.jpg");
    background-position: 0 0;
    background-repeat: no-repeat;
    min-height: 850px;
}
.ariane{
    font: 15px "Quicksand", sans-serif;
    padding-left: 185px;
    padding-top: 50px;
}
.ariane a{
    text-decoration: none;
    color: #232323;
}
.ariane .active{
    font: 14px "Quicksand-semibold", sans-serif;
}
.inner-page .titre{
    text-align: center;
    font: 36px "Quicksand-semibold", sans-serif;
    margin-top: 50px;
}
.inner-page .sous-titre{
    text-align: center;
    font: 24px "Quicksand-semibold", sans-serif;
    margin-top: 10px;
}
.inner-page .description{
    text-align: center;
    font: 20px "Quicksand", sans-serif;
    width: 1080px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 20px;
}
.inner-page .description b{
    font: 20px 'Quicksand-bold', sans-serif;
}
.inner-page .description .small{
    font: 16px 'Quicksand', sans-serif;
    padding-top: 10px;
}
.inner-page .plus-fonctions{
    background-color: #f6f7f9;
    text-align: center;
    height: 190px;
}
.inner-page .plus-titre{
    font: 24px "Quicksand-semibold", sans-serif;
    text-align: center;
    padding-top: 40px;
    margin-bottom: 40px;
}
.inner-page .plus-menu{
}
.inner-page .plus-btn{
    padding: 14px;
    font: 18px "Quicksand-semibold", sans-serif;
    margin-right: 15px;
    text-decoration: none;
    color: #232323;
}
.inner-page .plus-btn-bdd{
    background-color: #f5d678;
}
.inner-page .plus-btn-moteur{
    background-color: #d580cc;
}
.inner-page .plus-btn-animation{
    background-color: #8bc7ae;
}
.inner-page .plus-btn-pilotage{
    background-color: #6a8fc1;
}


/* EXTERNAL PAGE : BDD RCU */

.inner-bddrcu{
    background-color: #ffffff;
    background-image: url("../images/background-bddrcu.jpg");
    background-position: 0 0;
    background-repeat: no-repeat;
    min-height: 850px;
}
.inner-bddrcu .inner-titre{
    font: 36px "Quicksand-semibold", sans-serif;
    margin-top: 150px;
    padding-left: 180px;
    margin-bottom: 20px;
}
.inner-bddrcu .bloc-left{
    float: left;
    margin-left: 180px;
}
.inner-bddrcu .bloc-right{
    float: left;
    margin-left: 40px;
}
.inner-bddrcu .bloc{
    font: 18px "Quicksand", sans-serif;
    width: 520px;
}
.inner-bddrcu .bloc1{
    height: 280px;
}
.inner-bddrcu .bloc2{
    height: 200px;
    margin-top: 10px;
}
.inner-bddrcu .bloc3{
    height: 200px;
    margin-top: 290px;
}
.inner-bddrcu .inner-bloc{
    float: left;
    width: 460px;
}
.inner-bddrcu .bloc .numero{
    width: 48px;
    position: relative;
    color: #F8E3A2;
    font: 40px "Quicksand", sans-serif;
    float: left;
    margin-right: 10px;
}
.inner-bddrcu .bloc .titrebloc{
    font: 24px "Quicksand-semibold", sans-serif;
    text-align: left;
}
.inner-bddrcu .bloc .texte{
    font: 18px "Quicksand", sans-serif;
}
.inner-bddrcu .plus-fonctions{
    margin-top: 80px;
}


/* EXTERNAL PAGE : MOTEUR FIDELITE */

.inner-moteurfidelite .ul-moteurfidelite{
    list-style: none;
    float: left;
    width: 520px;
    text-align: left;
}
.inner-moteurfidelite .ul-moteurfidelite li::before {
    font: 20px 'Quicksand', sans-serif;
    content: "•";
    color: #ffffff;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}
.inner-moteurfidelite .inner-titre{
    font: 36px "Quicksand-semibold", sans-serif;
    margin-top: 110px;
    padding-left: 180px;
    margin-bottom: 20px;
}
.inner-moteurfidelite .step{
}
.inner-moteurfidelite .step1{
    height: 300px;
    margin-left: 193px;
    padding-left: 89px;
    background-image: url("../images/background-moteurfidelite-1.jpg");
    background-position: top left;
    background-repeat: no-repeat;
}
.inner-moteurfidelite .step2{
    height: 300px;
    margin-left: 192px;
    padding-left: 94px;
    background-image: url("../images/background-moteurfidelite-2.jpg");
    background-position: top left;
    background-repeat: no-repeat;
}
.inner-moteurfidelite .step3{
    height: 300px;
    margin-left: 192px;
    padding-left: 94px;
    background-image: url("../images/background-moteurfidelite-3.jpg");
    background-position: top left;
    background-repeat: no-repeat;
}
.inner-moteurfidelite .step4{
    height: 415px;
    padding-left: 280px;
    background-image: url("../images/background-moteurfidelite-4.jpg");
    background-position: bottom left;
    background-repeat: no-repeat;
}
.inner-moteurfidelite .step-titre{
    font: 24px "Quicksand-semibold", sans-serif;
    margin-bottom: 10px;
}
.inner-moteurfidelite .step-soustitre{
    font: 20px "Quicksand", sans-serif;
    margin-bottom: 15px;
}
.inner-moteurfidelite .step .bloc{
    background-color: #ffffff;
    width: 470px;
    height: 165px;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    float: left;
    margin-right: 30px;
}
.inner-moteurfidelite .step .bloc .numero{
    width: 48px;
    position: relative;
    color: #d580cc;
    font: 40px "Quicksand", sans-serif;
    margin-left: 15px;
    margin-top: 15px;
}
.inner-moteurfidelite .step .bloc .texte{
    margin-top: 15px;
    margin-left: 15px;
    margin-right: 15px;
}
.inner-moteurfidelite .step .minibloc{
    width: 305px;
    height: 50px;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    float: left;
    margin-right: 30px;
    font: 20px "Quicksand", sans-serif;
    padding-left: 15px;
    margin-bottom: 20px;
    background-color: #ffffff;
}
.inner-moteurfidelite .step .minibloc-margin{
    padding-top: 15px;
}
.inner-moteurfidelite .bloc-special1{
    width: 305px;
    height: 155px;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    float: left;
    margin-right: 30px;
    font: 20px "Quicksand", sans-serif;
    padding-left: 15px;
    padding-top: 50px;
    background-color: #ffffff;
}
.inner-moteurfidelite .bloc-special2{
    width: 635px;
    height: 155px;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
    float: left;
    margin-right: 30px;
    font: 20px "Quicksand", sans-serif;
    padding-left: 15px;
    background-color: #ffffff;
}
.inner-moteurfidelite .bloc-special2 .bloc-special2-titre{
    font: 20px "Quicksand-bold", sans-serif;
    padding-top: 15px;
}
.inner-moteurfidelite .bloc-special2 .bloc-special2-inner1{
    float: left;
    width: 160px;
}
.inner-moteurfidelite .bloc-special2 .bloc-special2-inner2{
    float: left;
    width: 370px;
    border-left: 1px solid #ccc;
}
.inner-moteurfidelite .bloc-special2 .numero{
    width: 48px;
    position: relative;
    color: #d580cc;
    font: 40px "Quicksand", sans-serif;
    margin-top: 3px;
}
.inner-moteurfidelite .bloc-special2 .bloc-special2-inner2{
    float: left;
    width: 370px;
    border-left: 1px solid #ccc;
    padding-left: 15px;
}


/* EXTERNAL PAGE : ANIMATION MARKETING */

.inner-animationmarketing .inner-titre{
    font: 36px "Quicksand-semibold", sans-serif;
    margin-top: 145px;
    padding-left: 180px;
    margin-bottom: 20px;
}
.inner-animationmarketing .bloc-campagne{
    padding-left: 180px;
    font: 20px "Quicksand", sans-serif;
}
.inner-animationmarketing .bloc-campagne-titre{
    font: 24px "Quicksand-bold", sans-serif;
    color: #8BC7AE;
    margin-bottom: 10px;
}
.inner-animationmarketing .bloc-campagne-inner-titre{
    font: 24px "Quicksand-bold", sans-serif;
}
.inner-animationmarketing .bloc-campagne-inner-right{
    float: left;
    width: 470px
}
.inner-animationmarketing .bloc-campagne-wraper{
    height: 460px;
}
.inner-animationmarketing .bloc-campagne ul{
    font: 20px "Quicksand", sans-serif;
    list-style: none;
    text-align: left;
}
.inner-animationmarketing .bloc-campagne li::before {
    font: 20px 'Quicksand', sans-serif;
    content: "•";
    color: #8BC7AE;
    display: inline-block;
    width: 17px;
    margin-left: -1em;
}
.inner-animationmarketing .bloc-campagne-rubrique{
    width: 550px;
    height: 530px;
    float: left;
}
.inner-animationmarketing .bloc-campagne-image{
    float: left;
}
.inner-animationmarketing .bloc-campagne .numero{
    width: 48px;
    position: relative;
    color: #8BC7AE;
    font: 40px "Quicksand", sans-serif;
    float: left;
    margin-right: 10px;
    margin-top: -6px;
}
.inner-animationmarketing .bloc-campagne .text{
    margin-bottom: 5px;
}
.inner-animationmarketing .CTA-arrow {
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    margin-left: 420px;
}
.inner-animationmarketing .CTA-arrow .arrow-wrapper {
    border-radius: 20px;
    min-width: 40px;
    height: 40px;
    position: relative;
    cursor: pointer;
}
.inner-animationmarketing .CTA-arrow img {
    margin-left: 14px;
    margin-top: 9px;
}
.inner-animationmarketing .CTA-arrow .default {
    background-color: #ced7e4;
}
.inner-animationmarketing .CTA-arrow .inactive {
    background-color: #8BC7AE;
}
#bloc-campagne-1{
    display: block;
}
#bloc-campagne-2{
    display: none;
}
#bloc-campagne-3{
    display: none;
}
#bloc-campagne-4{
    display: none;
}
#bloc-campagne-5{
    display: none;
}


/* EXTERNAL PAGE : PILOTAGE ANALYSE */

.inner-pilotageanalyse{
    background-color: #ffffff;
    background-image: url("../images/background-pilotageanalyse.jpg");
    background-position: 0 0;
    background-repeat: no-repeat;
    min-height: 850px;
}
.inner-pilotageanalyse .inner-titre{
    font: 36px "Quicksand-semibold", sans-serif;
    margin-top: 220px;
    padding-left: 180px;
    margin-bottom: 20px;
}
.inner-pilotageanalyse .baseline{
    padding: 5px;
    font: 24px "Quicksand-semibold", sans-serif;
    color: #ffffff;
    background-color: #6a8fc1;
    margin-left: 180px;
    width: 1070px;
}
.bloc-indicateurs{
    margin-left: 160px;
}
.inner-pilotageanalyse .bloc-left{
    float: left;
}
.inner-pilotageanalyse .bloc-right{
    float: left;
    margin-left: 40px;
}
.inner-pilotageanalyse .bloc-left img{
    margin-top: 50px;
}
.inner-pilotageanalyse .bloc{
    font: 18px "Quicksand", sans-serif;
    width: 520px;
    margin-left: 30px;
}
.inner-pilotageanalyse .bloc:first-child{
    margin-top: 45px;
}
.inner-pilotageanalyse .inner-bloc{
    float: left;
    width: 460px;
    padding-bottom: 20px;
}
.inner-pilotageanalyse .bloc .numero{
    width: 48px;
    position: relative;
    color: #9AB3D5;
    font: 40px "Quicksand", sans-serif;
    float: left;
    margin-right: 10px;
}
.inner-pilotageanalyse .bloc .titrebloc{
    font: 24px "Quicksand-semibold", sans-serif;
    text-align: left;
}
.inner-pilotageanalyse .bloc .texte{
    font: 18px "Quicksand", sans-serif;
}
.inner-pilotageanalyse .indicateurs{
    margin-top: 50px;
    padding-top: 50px;
    padding-bottom: 80px;
    background-color: #9AB3D5;
    background-image: url("../images/background-pilotageanalyse-2.jpg");
    background-position: right bottom;
    background-repeat: no-repeat;
}
.inner-pilotageanalyse .baseline-indicateurs{
    padding: 5px;
    font: 24px "Quicksand-semibold", sans-serif;
    color: #ffffff;
    background-color: #6a8fc1;
    margin-left: 180px;
    width: 1070px;
}
.inner-pilotageanalyse .indicateurs .bloc .numero{
    width: 48px;
    position: relative;
    color: #ffffff;
    font: 40px "Quicksand", sans-serif;
    float: left;
    margin-right: 10px;
}

/* SMALL DESKTOP */

@media (min-width: 1024px) and (max-width: 1440px) {
    .home {
        width: 1024px;
    }
    .desktop-hide{
        display: block;
    }
    .semi-desktop-hide{
        display: none;
    }
    .mobile-hide{
        display: block;
    }
    .pr-header {
        width: 1024px;
    }
    .header1 {
        font: 600 14px "Quicksand", sans-serif;
    }
    .header1 .nav-item .dropdown-item {
        font: 600 14px "Quicksand", sans-serif;
    }
    .header2 {
        width: 1024px;
        padding: 0;
    }
    .header2 .li-menu {
        font: 600 14px "Quicksand-semibold", sans-serif;
    }
    .header2 .nav-item .nav-link {
        font: 600 14px "Quicksand-semibold", sans-serif;
    }
    .header2 .nav-item .dropdown-item {
        font: 600 14px "Quicksand-semibold", sans-serif;
    }
    .header2 .li-menu a {
        padding: 20px 8px 20px 8px;
    }
    .header2 .nav-item .nav-link {
        padding: 20px 8px 20px 8px;
    }
    .header2 .li-menu-double a {
        padding: 11px;
    }
    .intro .logo {
        margin-top: 65px;
    }
    .pourquoi .intro {
        width: 1024px;
        height: 475px;
        background-size: 100%;
        background-repeat: no-repeat;
        padding-top: 46px;
        padding-left: 543px;
    }
    .pourquoi h1 {
        font: 30px 'Quicksand-bold', sans-serif;
        width: 1000px;
    }
    .pourquoi .blocs {
        width: 1024px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 15px;
        padding-bottom: 10px;
    }
    .pourquoi .bloc {
        width: 232px;
        height: 190px;
    }
    .pourquoi .definition-bloc {
        background-size: 600px;
    }
    .pourquoi .definition-inner-bloc {
        width: 500px;
        margin-left: 520px;
    }
    .pourquoi .bloc {
        font: 18px 'Quicksand', sans-serif;
    }
    .pourquoi .pourquoi-beone-titre{
        width: 1024px;
    }
    .pourquoi .definition-inner-bloc .definition-numero {
        font: 30px "Quicksand", sans-serif;
    }
    .pourquoi .definition-inner-bloc .definition-texte {
        width: 425px;
    }
    .pourquoi .definition-inner-bloc {
        font: 16px 'Quicksand', sans-serif;
    }
    .pourquoi .btn-demo a {
        font: 18px 'Quicksand-bold', sans-serif;
    }
    .pourquoi .pourquoi-beone-titre {
        font: 30px 'Quicksand-bold', sans-serif;
    }
    .pourquoi .pourquoi-beone-description {
        width: 900px;
    }
    .pourquoi .pourquoi-beone-bloc {
        width: 420px;
        margin-right: 50px;
    }
    .pourquoi .pourquoi-beone-blocs {
        margin-left: 60px;
    }
    .pourquoi .pourquoi-beone-soustitre {
        font: 20px 'Quicksand-bold', sans-serif;
    }
    .pourquoi .pourquoi-beone-text {
        font: 16px 'Quicksand', sans-serif;
    }
    .pourquoi .pourquoi-beone-text img {
        max-width: 420px;
    }
    .fonctionnalites .be-one-concr-tement-c-est-quoi {
        font: 700 30px 'Quicksand-bold', sans-serif;
    }
    .fonctionnalites .titre {
        left: 180px;
    }
    .fonctionnalites .c-est-l-union-de-ces-4-fonctionnalit-s {
        font: 400 22px 'Quicksand-semibold', sans-serif;
    }
    .fonctionnalites {
        width: 1024px;
    }
    .fonctionnalites .ct-as {
        left: 100px;
    }
    .fonctionnalites .onglet1 a, .fonctionnalites .onglet2 a, .fonctionnalites .onglet3 a, .fonctionnalites .onglet4 a {
        font: 700 18px 'Quicksand', sans-serif;
    }
    .fonctionnalites .rubrique {
        left: 40px;
    }
    .fonctionnalites .bloc-txt {
        height: 290px;
        width: 450px;
    }
    .fonctionnalites .visuel {
        width: 450px;
        height: 225px;
        left: 500px;
    }
    .fonctionnalites .txt {
        font: 16px 'Quicksand', sans-serif;
    }
    .fonctionnalites .txt b {
        font: 16px 'Quicksand-bold', sans-serif;
    }
    .fonctionnalites .img {
        width: 490px;
        height: 290px;
    }
    .fonctionnalites .une-connaissance-unifi-e-du-consommateur b {
        font: 700 20px 'Quicksand-bold', sans-serif !important;
    }
    .fonctionnalites .cta {
        padding: 12px 20px 12px 20px;
        font: 400 16px 'Quicksand-bold', sans-serif;
    }
    #fct{
        width: 1024px;
        height: 535px;
    }
    .fonctionnalites-mobile{
        display: none;
    }
    .ecosysteme {
        width: 1024px;
        height: 1450px;
    }
    .ecosysteme .titre-5 {
        left: 50px;
    }
    .ecosysteme .text-wrapper-25 b {
        font: 20px 'Quicksand-bold', sans-serif;
    }
    .ecosysteme .text-wrapper-25 {
        font: 20px 'Quicksand-semibold', sans-serif;
    }
    .ecosysteme .text-wrapper-27 {
        font: 700 32px 'Quicksand-bold', sans-serif;
    }
    .ecosysteme .elle-est-compos-e-de-3{
        display: none;
    }
    .ecosysteme .overlap-3 {
        width: 1024px;
        height: 1450px;
    }
    .ecosysteme .overlap-4 {
        width: 1024px;
        left: 0;
    }
    .ecosysteme .BE-ONE-rubrique {
        left: 662px;
    }
    .ecosysteme .text-wrapper-24 {
        font: 22px 'Quicksand-bold', sans-serif;
    }
    .ecosysteme .text-wrapper-14 {
        font: 16px 'Quicksand', sans-serif;
    }
    .ecosysteme .text-wrapper-14 b {
        font: 16px 'Quicksand-bold', sans-serif;
    }
    .ecosysteme .onglet a {
        font: 700 18px 'Quicksand', sans-serif;
    }
    .ecosysteme .les-outils {
        left: 61px;
    }
    .ecosysteme .partie-7 {
        left: 61px;
    }
    .ecosysteme .ellipse-6 {
        top: 0;
    }
    .ecosysteme .ellipse-7 {
        left: 711px;
    }
    .ecosysteme .ellipse-6 {
        width: 1024px;
    }
    .ecosysteme .l-co-syst-me .rubrique {
        width: 1024px;
    }
    .ecosysteme .lco-systme {
        left: 61px !important;
    }

    .ecosysteme .l-co-syst-me .rubrique {
        width: 900px;
    }
    .ecosysteme .l-co-syst-me .span-2 {
        font: 16px 'Quicksand', sans-serif;
    }
    .ecosysteme .l-co-syst-me .trouver-un-titre {
        font: 700 20px 'Quicksand-bold', sans-serif;
    }
    .ecosysteme .l-co-syst-me .bloc-txt {
        width: 380px;
    }
    #bloc-ecouter .bloc-txt {
        width: 380px;
    }
    #bloc-piloter .bloc-txt {
        width: 380px;
    }
    #bloc-piloter .property-1-piloter, .logo-piloter {
        margin-left: 40px;
    }
    .ecosysteme .les-technologies {
        left: 64px;
        top: 1085px;
    }
    .ecosysteme .partie-8 {
        left: 64px;
        top: 1040px;
    }
    .ecosysteme .bloc-ecouter-logos {
        width: 250px;
    }
    .ecosysteme .bloc-ecouter-logos2 {
        width: 210px;
    }
    .ecosysteme .overlap-4 {
        height: auto;
    }
    .ecosysteme .cards {
        width: 920px;
        left: 60px;
        top: 1140px;
    }
    .ecosysteme .card-2 {
        margin-left: 7px;
    }
    .ecosysteme .CTA {
        padding: 16px 18px;
    }
    .ecosysteme .CTA .text {
        font: 15px "Quicksand-bold", sans-serif;
    }
    #ecosystemeInfrastructureModal img, #ecosystemeFluxModal img {
        max-width: 100%;
    }
    #ecosystemeProcessModal .modal-content {
        background-position: -30px 109px;
    }
    .bloc-process {
        width: 407px;
    }
    .notre-approche {
        width: 1024px;
        background-size: 115%;
        height: 1815px;
    }
    .notre-approche .titre-4 {
        margin-left: 155px;
        padding-top: 65px;
        padding-bottom: 95px;
    }
    .notre-approche .IMG-convictions {
        width: 490px;
        height: 472px;
        margin-left: 2px;
    }
    .notre-approche .une-m-thodologie {
        width: 465px;
    }
    .notre-approche .element-convictions {
        width: 465px;
    }
    .notre-approche .element-convictions .bloc-convictions {
        width: 465px;
        height: 360px;
        margin-bottom: 10px;
    }
    .notre-approche .CTA-arrow {
        margin-left: 340px;
    }
    .notre-approche .une-m-thodologie {
        padding-top: 10px;
        margin-bottom: 10px;
    }
    .notre-approche .text-wrapper-14 {
        font: 16px "Quicksand", sans-serif;
    }
    .notre-approche .text-wrapper-14 b {
        font: 16px "Quicksand-bold", sans-serif;
    }
    .notre-approche .element-convictions .element-convictions-pour {
        font: 16px "Quicksand-bold", sans-serif;
        margin-bottom: 10px;
    }
    .notre-approche .element-convictions .p-2 {
        font: 16px "Quicksand-bold", sans-serif;
    }
    .notre-approche .element-convictions .p-3 {
        font: 16px "Quicksand", sans-serif;
    }
    .notre-approche .partie-4 {
        width: 437px;
        margin-left: 95px;
    }
    .notre-approche .bloc-indispensables {
        width: 550px;
        margin-left: 55px;
    }
    .notre-approche .bloc-2 {
        width: 550px;
    }
    .notre-approche .bloc-additionnels {
        width: 340px;
    }
    .notre-approche .div-6 {
        width: 233px;
        height: 300px;
    }
    .notre-approche .line-5 {
        height: 300px;
    }
    .notre-approche .text-wrapper-17 {
        font-size: 22px;
    }
    .notre-approche .titre-2 {
        font: 22px "Quicksand-bold", sans-serif;
    }
    .notre-approche .overlap-2 {
        margin-top: 65px;
    }
    .notre-approche .cas-clients {
        width: 1024px;
        margin-left: 3px;
    }
    .notre-approche .overlap-group-4 {
        width: 1024px;
        margin-left: 90px;
    }
    .notre-approche .card-clients {
        width: 1024px;
    }
    .notre-approche .CTA-arrow-2 {
        margin-left: 820px;
        margin-top: -230px;
    }
    .notre-approche .exemple-2 {
        width: 484px;
        margin-left: 765px;
    }
    .footer {
        width: 1024px;
        padding: 0;
        padding-top: 20px;
    }
    .footer .logo-wrapper {
        padding-left: 35px;
    }
    .footer .footer-baseline {
        width: 575px;
    }
    .footer .adresse {
        width: 1024px;
    }
    .footer .sous-titre {
        width: 1024px;
    }
    .footer .newsletters {
        width: 975px;
        margin-left: 25px;
    }
    .footer .rs {
        margin-bottom: 20px;
    }
    .modal-xl{
        width: 1000px;
    }
    .inner-pilotageanalyse .baseline{
        width: 1024px;
    }
    .inner-pilotageanalyse .baseline-indicateurs{
        width: 925px;
        margin-left: 50px;
    }
    .ariane {
        padding-left: 50px;
        padding-top: 25px;
    }
    .inner-bddrcu {
        background-size: 100%;
    }
    .inner-moteurfidelite {
        background-size: 100%;
    }
    .inner-pilotageanalyse {
        background-size: 100%;
    }
    .inner-pilotageanalyse {
        background-size: 100%;
    }
    .inner-animationmarketing {
        background-size: 100%;
    }
    .inner-page .titre {
        font: 34px "Quicksand-semibold", sans-serif;
        margin-top: 10px;
    }
    .inner-page .sous-titre {
        margin-top: 5px;
    }
    .inner-page .description {
        font: 18px "Quicksand", sans-serif;
        width: 975px;
    }
    .inner-moteurfidelite .description {
        margin-left: 100px;
    }
    .inner-moteurfidelite .ul-moteurfidelite {
        width: 420px;
    }
    .inner-moteurfidelite .inner-titre {
        margin-top: 95px;
        padding-left: 50px;
    }
    .inner-moteurfidelite .step1 {
        margin-left: 45px;
    }
    .inner-moteurfidelite .step2 {
        margin-left: 45px;
    }
    .inner-moteurfidelite .step3 {
        margin-left: 45px;
    }
    .inner-moteurfidelite .step4 {
        padding-left: 150px;
        background-image: url("../images/background-moteurfidelite-semi-4.jpg");
        padding-top: 20px;
    }
    .inner-moteurfidelite .step .bloc {
        width: 370px;
    }
    .inner-moteurfidelite .step .minibloc {
        width: 240px;
        margin-bottom: 15px;
    }
    .inner-moteurfidelite .bloc-special1 {
        width: 230px;
    }
    .inner-moteurfidelite .bloc-special2 {
        width: 520px;
    }
    .inner-moteurfidelite .bloc-special2 .bloc-special2-inner1 {
        width: 150px;
    }
    .inner-moteurfidelite .bloc-special2 .bloc-special2-inner2 {
        width: 350px;
    }
    .inner-page .description b {
        font: 18px 'Quicksand-bold', sans-serif;
    }
    .inner-bddrcu .inner-titre {
        padding-left: 50px;
        margin-top: 120px;
    }
    .inner-bddrcu .bloc-left {
        margin-left: 50px;
    }
    .inner-bddrcu .bloc {
        width: 465px;
    }
    .inner-bddrcu .bloc3 {
        margin-top: 315px;
    }
    .inner-bddrcu .plus-fonctions {
        margin-top: 50px;
    }
    .inner-pilotageanalyse .inner-titre {
        margin-top: 200px;
        padding-left: 50px;
    }
    .inner-pilotageanalyse .baseline {
        margin-left: 50px;
        width: 945px;
    }
    .inner-pilotageanalyse .bloc {
        width: 420px;
    }
    .inner-pilotageanalyse .bloc-left img {
        width: 450px;
        margin-top: 110px;
    }
    .inner-pilotageanalyse .inner-bloc {
        width: 360px;
        padding-bottom: 10px;
    }
    .inner-pilotageanalyse .bloc-indicateurs {
        margin-left: 50px;
    }
    .inner-animationmarketing .inner-titre {
        margin-top: 115px;
        padding-left: 50px;
    }
    .inner-animationmarketing .bloc-campagne {
        padding-left: 50px;
    }
    .inner-animationmarketing .bloc-campagne-wraper {
        height: auto;
    }
    .inner-animationmarketing .bloc-campagne-rubrique {
        width: 450px;
        height: auto;
    }
    .inner-animationmarketing .bloc-campagne-inner-right {
        width: 370px;
    }
    .inner-animationmarketing .CTA-arrow {
        margin-left: 320px;
        padding-top: 20px;
    }
    .inner-animationmarketing .bloc-campagne-image img {
        width: 500px;
        margin-top: 40px;
    }
    .inner-animationmarketing .plus-fonctions {
        margin-top: 30px;
    }
}

/* MOBILE */

@media (max-width: 1023px) {
    .desktop-hide{
        display: block !important;
    }
    .mobile-hide{
        display: none !important;
    }
    .semi-desktop-hide{
        display: block !important;
    }
    .home {
        width: 375px;
    }
    .header {
        display: none;
    }
    .header-mobile {
        display: block;
    }
    .header-mobile .menu{
        border-bottom: 2px solid #5BC5F2;
    }
    .header-mobile .container-fluid:first-child{
        padding-right: 0;
    }
    .header-mobile .navbar-brand{
        margin-left: 30px;
    }
    #btn-menu-mobile{
        background-color: #5BC5F2;
        color: #000000;
        padding: 30px 42px 30px 42px;
        cursor: pointer;
    }
    #menu-mobile{
        display: none;
        background-color: #ffffff;
        position: absolute;
        top: 86px;
        left: 0;
        width: 100%;
        z-index: 1000;
    }
    .header-mobile .accordion-button{
        background-color: #ffffff !important;
        border: 0 !important;
        box-shadow: none !important;
        font: 16px 'Quicksand-bold', sans-serif;
        color: #000000 !important;
        text-decoration: none;
    }
    .header-mobile .accordion-body{

    }
    .header-mobile .menu-mobile{
        display: block;
        padding: 26px;
        background-color: #ffffff;
        font: 16px 'Quicksand-bold', sans-serif;
        color: #000000;
        text-decoration: none;
        text-align: center;
    }
    .header-mobile .menu-mobile-demo{
        color: #ffffff;
        background-color: #5BC5F2;
        margin-left: 15px;
        margin-right: 15px;
    }
    .header-mobile .accordion-body{
        padding: 0;
    }
    .header-mobile .accordion-item{
        border: 0;
    }
    .header-mobile .accordion-body ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .header-mobile .accordion-body ul li a {
        display: block;
        text-align: center;
        font: 16px 'Quicksand', sans-serif;
        color: #000000;
        padding: 10px;
        border-bottom: 1px solid #dddddd;
    }
    .header-mobile .accordion-body ul li a.no-border {
        border-bottom: 0;
    }
    #acb-1{
        padding-left: 80px;
        padding-right: 65px;
        padding-top: 26px;
        padding-bottom: 26px;
    }
    #acb-2{
        padding-left: 83px;
        padding-right: 66px;
        padding-top: 26px;
        padding-bottom: 26px;
    }
    .header1 {
        padding: 0;
    }
    .header2 {
        width: 100%;
    }
    .menu {
        width: 100%;
    }
    .pourquoi .intro{
        width: 100%;
        height: 633px;
        background-image: url("../images/background-intro-mobile.jpg");
        background-repeat: no-repeat;
        font: 38px 'Quicksand', sans-serif;
        color: #47267F;
        text-align: center;
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 60px;
    }
    .pourquoi .intro b{
        font: 38px 'Quicksand-bold', sans-serif;
    }
    .pourquoi .intro .baseline{
        margin-top: 10px;
        letter-spacing: 6px;
        font: 18px 'Quicksand', sans-serif;
        text-transform: uppercase;
        color: #232323;
    }
    .pourquoi .blocs{
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
    .pourquoi .bloc{
        float: left;
        width: 100%;
        text-align: center;
        box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
        font: 18px 'Quicksand', sans-serif;
        color: #47267F;
        padding-left: 5px;
        padding-right: 5px;
        padding-top: 10px;
        padding-bottom: 15px;
        border-radius: 8px;
        margin-bottom: 15px;
        margin-right: 0;
        height: auto;
    }
    .pourquoi .btn-demo {
        margin-top: 20px;
    }
    .pourquoi .btn-demo a {
        font: 18px 'Quicksand-bold', sans-serif;
        margin-top: 10px;
    }
    .pourquoi .pourquoi-beone{
        max-width: 100%;
    }
    .pourquoi .pourquoi-beone-description {
        width: 370px;
    }
    .pourquoi .pourquoi-beone-blocs {
        margin-left: 0;
    }
    .pourquoi .pourquoi-beone-bloc {
        float: none;
        width: 350px;
        padding-left: 10px;
        padding-right: 10px;
        text-align: left;
        margin-right: 0px;
    }
    .pourquoi .pourquoi-beone-text img {
        max-width: 350px;
        height: 130px;
    }
    #fct{
        display: none;
    }
    #fct-mobile{
        width: 100%;
        height: auto;
    }
    #fct-rcu-mobile{
        width: 100%;
        height: 810px;
        background-image: url("../images/background-fonctionnalites1-mobile.png");
        background-repeat: no-repeat;
    }
    #fct-fid-mobile{
        width: 100%;
        height: 550px;
        background-image: url("../images/background-fonctionnalites2-mobile-small.png");
        background-repeat: no-repeat;
    }
    #fct-anim-mobile{
        width: 100%;
        height: 590px;
        background-image: url("../images/background-fonctionnalites3-mobile-small.png");
        background-repeat: no-repeat;
    }
    #fct-pilot-mobile{
        width: 100%;
        height: 570px;
        background-image: url("../images/background-fonctionnalites4-mobile-small.png");
        background-repeat: no-repeat;
    }
    .fonctionnalites-mobile .titre{
        color: #000000;
        text-align: center;
        font: 700 32px 'Quicksand-bold', sans-serif;
        position: relative;
    }
    .fonctionnalites-mobile h2{
        color: #000000;
        text-align: center;
        font: 700 36px 'Quicksand-bold', sans-serif;
        position: relative;
        padding-top: 20px;
    }
    .fonctionnalites-mobile h3{
        color: #232323;
        text-align: center;
        font: 400 24px 'Quicksand', sans-serif;
        position: relative;
        margin-top: 10px;
    }
    .fonctionnalites-mobile .rubrique{
        margin-left: 15px;
        margin-right: 15px;
        height: auto;
        box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.16);
        background: #ffffff;
        margin-top: 30px;
        padding-bottom: 25px;
    }
    .fonctionnalites-mobile .active{
        padding-top: 25px;
        padding-bottom: 15px;
        padding-left: 15px;
        padding-right: 15px;
        width: 100%;
    }
    .fonctionnalites-mobile .active a{
        color: #000000;
        text-align: center;
        text-decoration: none;
        font: 700 20px 'Quicksand-bold', sans-serif;
        width: 100%;
        display: block;
    }
    #fct-rcu-mobile .active a{
        background: #f5d678;
        padding: 4px 12px 4px 12px;
    }
    .fonctionnalites-mobile .img img{
        max-width: 315px;
        margin-left: 15px;
    }
    .fonctionnalites-mobile .une-connaissance-unifi-e-du-consommateur{
        color: #232323;
        font: 24px 'Quicksand-bold', sans-serif;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .fonctionnalites-mobile .txt{
        color: #232323;
        font: 18px 'Quicksand', sans-serif;
        padding-right: 15px;
        padding-left: 15px;
        padding-bottom: 20px;
    }
    .fonctionnalites-mobile .txt b{
        color: #232323;
        font: 18px 'Quicksand-bold', sans-serif;
    }
    .fonctionnalites-mobile .cta1 {
        background: #f5d678;
    }
    .fonctionnalites-mobile .cta2 {
        background: #d580cc;
    }
    .fonctionnalites-mobile .cta3 {
        background: #8bc7ae;
    }
    .fonctionnalites-mobile .cta4 {
        background: #6a8fc1;
    }
    .fonctionnalites-mobile .cta {
        padding: 16px 24px 16px 24px;
        display: flex;
        flex-direction: row;
        gap: 12px;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        position: relative;
        overflow: hidden;
        color: #232323;
        font: 400 16px 'Quicksand-bold', sans-serif;
        text-decoration: none;
        margin-left: 15px;
        margin-right: 15px;
    }
    .fonctionnalites-mobile .icon {
        font-size: 24px;
    }
    .fonctionnalites-mobile .ellipse-5 {
        background: #232323;
        border-radius: 50%;
        width: 24px;
        height: 24px;
        position: absolute;
        left: 176px;
        top: 16px;
    }
    .fonctionnalites-mobile .arrow {
        position: absolute;
        left: 180px;
        top: 20px;
        overflow: visible;
    }
    .fonctionnalites-mobile{
        display: block;
    }
    #fct-anim-mobile, #fct-pilot-mobile, #fct-fid-mobile{
        /*display: none;*/
    }
    .ecosysteme {
        width: 100%;
        height: auto;
        left: 0;
    }
    .ecosysteme .overlap-3 {
        width: 100%;
        height: auto;
        position: relative;
        background-image: url("../images/background-environnement-mobile.png");
        background-repeat: no-repeat;
        background-color: #fff;
        min-height: 2720px
    }
    .ecosysteme .overlap-4 {
        height: auto;
        position: relative;
        top: 55px;
        left: 15px;
        width: 360px;
    }
    .ecosysteme .ellipse-6, .ecosysteme .ellipse-7, .ecosysteme .BE-ONE-rubrique {
        display: none;
    }
    .ecosysteme .titre-5 {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        width: 100%;
        display: flex;
        position: absolute;
        top: 0;
        left: 0;
    }
    .ecosysteme .partie-7 {
        top: 178px;
        left: 0;
    }
    .ecosysteme .les-outils {
        top: 225px;
        left: 0;
        width: 100%;
    }
    .ecosysteme .lco-systme {
        position: absolute !important;
        top: 311px !important;
        left: 0 !important;
        max-width: 350px;
    }
    .ecosysteme .l-co-syst-me .CT-as{
        max-width: 375px;
        margin-left: -8px;
        gap: 5px;
    }
    .ecosysteme .l-co-syst-me .CT-as .onglet-line{

    }
    .ecosysteme .l-co-syst-me .elle-est-compos-e-de {
        width: 100%;
    }
    .ecosysteme .l-co-syst-me .rubrique {
        width: 345px;
    }
    .ecosysteme .l-co-syst-me .rubrique {
        padding: 15px;
    }
    .ecosysteme .l-co-syst-me .bloc-txt {
        width: 317px;
    }
    .ecosysteme .l-co-syst-me .property-1-pilote, .ecosysteme .l-co-syst-me .property-1-collecter, .ecosysteme .l-co-syst-me .property-1-animer {
        width: 315px;
        padding-left: 0;
    }
    .ecosysteme .l-co-syst-me .overlap-group-wrapper {
        width: 345px;
        min-width: 345px;
        height: 88px;
    }
    .ecosysteme .l-co-syst-me .overlap-group {
        width: 345px;
        height: 104px;
        position: relative;
        top: -6px;
        left: 2px;
    }
    .ecosysteme .l-co-syst-me .logo-5 {
        width: 160px;
        height: 104px;
        position: absolute;
        top: 0;
        left: 152px;
    }
    .ecosysteme .l-co-syst-me .logo-8 {
        width: 160px;
        height: 104px;
        position: absolute;
        top: 0;
        left: 0;
    }
    .ecosysteme .les-technologies {
        top: 1850px;
        left: 15px;
        width: 345px;
    }
    .ecosysteme .partie-8 {
        left: 15px;
        top: 1780px;
    }
    .ecosysteme .cards {
        top: 1900px;
        left: 15px;
        width: 345px;
        display: block;
    }
    .ecosysteme .card-2 {
        float: left;
        display: block;
        width: 345px;
        margin-bottom: 20px;
        height: 185px;
        padding: 15px 16px;
        text-align: center;
    }
    .ecosysteme .card-double {
        height: 215px;
    }
    .ecosysteme .CTA {
        margin-top: 20px;
        margin-left: 56px;
    }
    #bloc-ecouter .bloc-txt {
        width: 317px;
    }
    #bloc-piloter .bloc-txt {
        width: 317px;
    }
    #bloc-piloter .property-1-piloter, .logo-piloter {
        width: 317px;
        height: 88px;
    }
    .ecosysteme .bloc-ecouter-logos, .ecosysteme .bloc-ecouter-logos2 {
        margin-left: 25px;
    }
    .ecosysteme .l-co-syst-me .overlap-group-wrapper-mobile {
        height: 170px;
    }
    .notre-approche {
        width: 375px;
        height: auto;
        background-color: #ffffff;
        background-image: url("../images/background-approche1-mobile.png");
        background-position: 0 0;
        background-repeat: no-repeat;
        margin-top: 35px;
    }
    .notre-approche .titre-4 {
        margin-left: 0;
        padding-top: 38px;
        padding-bottom: 50px;
    }
    .notre-approche .partie-4 {
        width: 360px;
        float: none;
        margin-left: 15px;
    }
    .notre-approche .une-m-thodologie {
        width: 350px;
    }
    .notre-approche .element-convictions {
        width: 350px;
    }
    .notre-approche .element-convictions .bloc-convictions {
        width: 350px;
    }
    .notre-approche .CTA-arrow {
        padding-left: 120px;
        background-color: #D8F1FC;
        background-image: url("../images/background-approche2-mobile.png");
        background-position: 0 0;
        background-repeat: no-repeat;
        margin-left: -15px;
        width: 375px;
        height: 75px;
        margin-top: 143px;
        padding-right: 20px;
        padding-top: 35px;
    }
    .notre-approche .overlap-2 {
        margin-top: 0;
        background-color: #D8F1FC;
        padding-top: 40px;
        padding-bottom: 5px;
    }
    .notre-approche .onglets {
        display: block;
    }
    .notre-approche .onglet {
        width: 100%;
        display: block;
        position: relative;
        padding: 10px;
        font: 700 20px 'Quicksand', sans-serif;
    }
    .notre-approche .ellipse-5 {
        min-width: 4px;
        width: 4px;
        height: 4px;
        margin-left: 115px;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    .notre-approche .bloc-indispensables {
        width: 345px;
        display: block;
        float: none;
        margin-left: 15px;
        background-color: #D8F1FC;
        margin-bottom: 15px;
    }
    .notre-approche .bloc-2 {
        width: 345px;
    }
    .notre-approche .div-6 {
        width: 310px;
        float: none;
        height: 185px;
    }
    .notre-approche .div-6-first-mobile {
        height: 255px;
    }
    .notre-approche .div-6-bis-mobile {
        width: 310px;
        float: none;
        height: 225px;
    }
    .notre-approche .line-5 {
        display: none;
    }
    .notre-approche .bloc-additionnels {
        width: 345px;
        display: block;
        float: none;
        margin-left: 15px;
        background-color: #D8F1FC;
        margin-bottom: 15px;
    }
    .notre-approche .titre-3 {
        height: 75px;
    }
    .notre-approche .cas-clients {
        width: 375px;
        height: 290px;
        margin-left: 0;
        margin-top: 0;
        background-color: #D8F1FC;
    }
    .notre-approche .line-3 {
        min-width: 30px;
        width: 30px;
    }
    .notre-approche .sous-titre-2 {
        gap: 10px;
        margin-left: 28px;
    }
    .notre-approche .eux-aussi-ont-choisi {
        font-size: 18px;
        margin-top: 15px;
    }
    .notre-approche .overlap-group-4 {
        width: 375px;
        height: 240px;
    }
    .notre-approche .card-clients {
        width: 100%;
        display: block;
        padding-top: 20px;
        overflow: hidden;
        height: 250px;
    }
    .notre-approche .card {
        float: none;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 20px;
    }
    .notre-approche .CTA-arrow-2 {
        justify-content: flex-end;
        align-items: center;
        gap: 12px;
        width: -moz-fit-content;
        width: fit-content;
        display: flex;
        margin-left: 265px;
        margin-top: -250px;
    }
    .formulaire {
        padding-left: 15px;
        padding-right: 15px;
        text-align: center;
        margin-top: 50px;
        background-image: url("../images/background-formulaire-mobile.png");
        background-repeat: no-repeat;
        background-position: 0 193px;
        padding-bottom: 40px;
    }
    .formulaire .overlap-group-3 {
        width: 360px;
        margin-left: auto;
        margin-right: auto;
        text-align: left;
        margin-top: 40px;
    }
    .formulaire .form-control{
        margin-left: 20px;
        margin-bottom: 15px !important;
    }
    #form-message{
        width: 312px;
    }
    .formulaire .CTA-wrapper {
        width: 345px;
        text-align: center;
    }
    .formulaire .CTA {
        margin-top: 0;
    }
    .footer {
        width: 375px;
        padding: 15px;
        display: block;
    }
    .footer .logo-wrapper {
        width: 345px;
        text-align: center;
        float: none;
        border-right: 0;
    }
    .footer .adresse {
        width: 360px;
    }
    .footer .villes {
        margin-left: 27px;
    }
    .footer .t-l-phone {
        margin-left: 90px;
    }
    .footer .ville-last {
        padding-right: 0;
    }
    .footer .footer-baseline {
        float: none;
    }
    .footer .hr-blue{
        width: 345px;
        color: #5BC5F2;
    }
    .footer .footer-baseline {
        margin-left: 0;
    }
    .footer .footer-baseline {
        width: 345px;
    }
    .footer .footer-baseline-titre {
        margin-top: 10px;
        font: 24px "Quicksand-bold", sans-serif;
        color: #47267F;
        width: 345px;
        text-align: center;
    }
    .footer .footer-baseline-description {
        width: 345px;
        text-align: center;
    }
    .footer .footer-baseline-cta {
        margin-top: 25px;
        margin-left: 20px;
        margin-bottom: 15px;
    }
    .footer .newsletters {
        padding: 15px;
        padding-top: 20px;
        display: block;
        width: 345px;
    }
    .footer .champs-e-mail {
        display: block;
    }
    .footer .learn-more {
        color: #000000;
        text-align: left;
        font: 700 16px "Quicksand", sans-serif;
        position: relative;
        width: 315px;
        margin-bottom: 15px;
        text-align: center;
    }
    .footer .input {
        width: 315px;
    }
    .footer .email-newsletter {
        margin-top: 10px;
    }
    .footer .sous-titre {
        display: flex;
        flex-direction: row;
        gap: 10px;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 345px;
        position: relative;
        margin-top: 20px;
    }
    .footer .mentions-l-gales {
        display: block;
    }
    .footer .text4 {
        text-align: center;
        margin-bottom: 20px;
    }
    .footer .rs {
        display: block;
        text-align: center;
    }
    .footer .rs a{
        margin-right: 10px;
    }
    .footer .rs a:last-child{
        margin-right: 0;
    }
    .ariane {
        padding-left: 20px;
        padding-top: 35px;
    }
    .inner-bddrcu {
        background-image: url("../images/background-bddrcu-mobile.jpg");
        background-repeat: no-repeat;
    }
    .inner-moteurfidelite {
        background-image: url("../images/background-moteur-mobile.jpg");
        background-repeat: no-repeat;
    }
    .inner-animationmarketing {
        background-image: url("../images/background-animation-mobile.jpg");
        background-repeat: no-repeat;
    }
    .inner-pilotageanalyse {
        background-image: url("../images/background-pilot-mobile.jpg");
        background-repeat: no-repeat;
    }
    .inner-page .titre {
        margin-top: 70px;
    }
    .inner-page .description {
        width: 375px;
        padding-left: 15px;
        padding-right: 15px;
        margin-top: 10px;
        font: 18px "Quicksand", sans-serif;
    }
    .inner-page .description b {
        font: 18px "Quicksand-bold", sans-serif;
    }
    .inner-bddrcu .inner-titre {
        margin-top: 300px;
        padding-left: 15px;
    }
    .inner-bddrcu .bloc-left {
        float: none;
        margin-left: 15px;
    }
    .inner-bddrcu .bloc-right {
        float: none;
        margin-left: 15px;
    }
    .inner-bddrcu .bloc3 {
        margin-top: 0;
    }
    .inner-bddrcu .bloc3 {
        height: auto;
    }
    .inner-bddrcu .plus-fonctions {
        margin-top: 50px;
    }
    .inner-bddrcu .inner-bloc {
        float: left;
        width: 300px;
    }
    .inner-bddrcu .bloc {
        width: 360px;
    }
    .inner-bddrcu .bloc1, .inner-bddrcu .bloc2, .inner-bddrcu .bloc3 {
        height: auto;
    }
    .inner-bddrcu .bloc2, .inner-bddrcu .bloc3 {
        margin-top: 15px;
    }
    .inner-page .plus-titre {
        padding-top: 15px;
    }
    .inner-page .plus-btn {
        width: 345px;
        display: block;
        margin-left: 15px;
        margin-bottom: 20px;
    }
    .inner-page .plus-fonctions {
        height: auto;
        padding-bottom: 5px;
    }
    .inner-moteurfidelite .ul-moteurfidelite {
        width: 345px;
    }
    .inner-moteurfidelite .inner-titre {
        padding-left: 15px;
        padding-right: 15px;
    }
    .inner-moteurfidelite .step1, .inner-moteurfidelite .step2, .inner-moteurfidelite .step3, .inner-moteurfidelite .step4 {
        height: auto;
        margin-left: 0;
        padding-left: 15px;
        padding-right: 15px;
        background-image: none;
    }
    .inner-moteurfidelite .step .bloc {
        width: 345px;
        margin-bottom: 15px;
    }
    .inner-moteurfidelite .step .picto {
        margin-bottom: 10px;
    }
    .inner-moteurfidelite .bloc-special1 {
        height: 110px;
        padding-top: 25px;
        margin-bottom: 15px;
    }
    .inner-moteurfidelite .bloc-special2 {
        width: 345px;
        height: auto;
        padding-bottom: 15px;
        margin-bottom: 50px;
    }
    .inner-moteurfidelite .bloc-special2 .bloc-special2-inner1 {
        width: 160px;
    }
    .inner-moteurfidelite .bloc-special2 .bloc-special2-inner2 {
        width: 160px;
    }
    .inner-animationmarketing .titre {
        margin-top: 80px;
        padding-left: 20px;
        padding-right: 20px;
    }
    .inner-animationmarketing .sous-titre {
        margin-top: 20px;
    }
    .inner-animationmarketing .description {
        margin-top: 25px;
    }
    .inner-animationmarketing .inner-titre {
        margin-top: 70px;
        margin-bottom: 20px;
        padding-left: 15px;
    }
    .inner-animationmarketing .bloc-campagne {
        padding-left: 15px;
    }
    .inner-animationmarketing .bloc-campagne-rubrique {
        width: 345px;
        height: auto;
    }
    .inner-animationmarketing .bloc-campagne-inner-right {
        width: 285px;
    }
    .inner-animationmarketing .visuel-mobile {
        width: 340px;
        margin-top: 10px;
    }
    .inner-animationmarketing .bloc-campagne-wraper {
        height: auto;
    }
    .inner-animationmarketing .CTA-arrow {
        margin-left: 245px;
        margin-top: 20px;
        margin-bottom: 45px;
    }
    .inner-animationmarketing .bloc-campagne-inner {
        margin-bottom: 15px;
    }
    .inner-pilotageanalyse .inner-titre {
        margin-top: 110px;
        padding-left: 15px;
    }
    .inner-pilotageanalyse .baseline {
        margin-left: 15px;
        margin-right: 15px;
        width: 345px;
    }
    .inner-pilotageanalyse .bloc-left img {
        margin-left: 15px;
        margin-right: 15px;
        width: 345px;
    }
    .inner-pilotageanalyse .bloc-right {
        margin-left: 15px;
        margin-right: 15px;
        width: 345px;
    }
    .inner-pilotageanalyse .bloc {
        width: 345px;
        margin-left: 0;
    }
    .inner-pilotageanalyse .inner-bloc {
        width: 285px;
    }
    .inner-pilotageanalyse .indicateurs {
        margin-top: 40px;
        padding-top: 20px;
        padding-bottom: 20px;
        background-image: none;
    }
    .inner-pilotageanalyse .baseline-indicateurs {
        margin-left: 15px;
        margin-right: 15px;
        width: 340px;
    }
    .bloc-indicateurs {
        margin-left: 15px;
        margin-right: 15px;
    }
    .inner-pilotageanalyse .bloc:first-child {
        margin-top: 40px;
    }
    #ecosystemeInfrastructureModal .main-image, #ecosystemeFluxModal .main-image {
        max-width: 100%;
    }
    .modal-xl {
        max-width: 100%;
        width: 375px;
    }
    #ecosystemeEquipesModal .main-image {
        max-width: 100%;
        margin-left: 0 !important;
    }
    #ecosystemeEquipesModal .modal-content {
        background-image: none;
    }
    #ecosystemeProcessModal .bloc-processes {
        margin-left: 0;
        margin-top: 0;
    }
    .bloc-process.bloc-process-bas {
        height: auto;
    }
    .bloc-process {
        width: 340px;
        height: auto;
        font: 14px 'Quicksand', sans-serif;
        margin-bottom: 10px;
        padding-top: 0px;
    }
    .bloc-process .bloc-process-nombre {
        font: 32px 'Quicksand', sans-serif;
    }
    .bloc-process .bloc-process-titre {
        font: 18px 'Quicksand-bold', sans-serif;
    }
}


/* PRW */

#Bandeau-PRW{
    display: block;
}
#Bandeau-PRW img{
    max-width: 100%;
}
#Bandeau-PRW-mobile{
    display: none;
}
@media (max-width: 1023px) {
    #Bandeau-PRW{
        display: none;
    }
    #Bandeau-PRW-mobile{
        display: block;
    }
}