#texte::after {
  content: '|';
  animation: blink 1s infinite;
  margin-left: 5px;
  color: black;
}

@keyframes blink {
  0%   { opacity: 1; }
  50%  { opacity: 0; }
  100% { opacity: 1; }
}

.img-home-osteo{
    width: 300px;
}

section {
  padding: 0px 0 !important;
}

.img-flecheo-osteo{
  width: 75px;
}

.navigation{
    color:black;
}

.l_osteo_header{
  color: #FFAE9D !important;
}

.fond_osteo{
    width: 100%;
    height: 100%;
    background: url("https://osteodispo.fr/assets/img/commercial/entreprise/FOND_OSTEODISPO_SANS_LOGO.png") no-repeat center center;
    background-size: cover; /* Ajustez selon vos besoins */
    z-index: -1;
}

.bandeau-marquee {
  background-color: rgba(252, 247, 249, 0.5);
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
  position: relative;
  height: 90px;
  display: flex;
  align-items: center;
}

.bandeau-marquee_2 {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  padding: 20px 0;
  margin-top: -25px;
}

.bandeau-marquee_2 .marquee-content {
  display: inline-block;
  animation: scroll 30s linear infinite;
}

.bandeau-marquee_2 .marquee-item {
  display: inline-block;
  width: 300px;
  margin: 0 10px;
  transition: transform 0.3s ease;
}

@keyframes scroll {
  0% {
      transform: translateX(0);
  }
  100% {
      transform: translateX(-50%);
  }
}

/* Style des cartes */
.card_anim {
  transition: all 0.3s ease;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.card_anim:hover {
  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
}

.img_anim {
  max-height: 260px;
  object-fit: cover;
  border-radius: 20px 20px 0 0;
  width: 200px;
  height: 260px;
  padding-top: 20px;
}

.h3_texte {
  font-size: 1.1rem;
  margin-top: 15px;
  font-weight: 600;
}




.bandeau-marquee .marquee-content {
  display: inline-block;
  padding-left: 100%;
  animation: scroll-left 400s linear infinite;
  white-space: nowrap;
  font-size: 40px;
  font-family: 'SharpSansDisplayNo1';
  padding-left: 24px;
  padding-right: 28px;
}

.bandeau-marquee .marquee-item {
  display: inline-block;
  margin: 0 50px;
  font-weight: 500;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.bandeau-marquee:hover .marquee-content {
  animation-play-state: paused;
}




.container1{
    width: 100%; 
    background-color: rgba(255, 255, 255, 0.3); 
    padding-top: 20px; 
    padding-bottom: 20px;
}

.container2{
    width: 100%; 
    background-color: rgba(252, 247, 249, 0.5); 
    padding-top: 20px; 
    padding-bottom: 20px;
}

.container3{
    width: 100%; 
    background-color: #FAF0F5; 
    padding-top: 20px; 
    padding-bottom: 20px;
}

.container4{
  width: 100%; 
  background-color: rgb(255, 255, 255); 
  padding-top: 20px; 
  padding-bottom: 20px;
}

.img-calendier-osteo{
    width: 400px;
}

.img-velo-osteo{
  width: 373px;
  border-radius: 20px;
}

.img-mascotte-osteo{
    width: 350px;
}

.img-check-osteo{
    width: 50px;
}

.transparent-border{
    width:25%;
    margin-top: 30px;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: black; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }
  
  .transparent-border:hover {
    background-color: #FFAE9D; /* Couleur de fond au survol */
    color: white; /* Couleur du texte au survol */
  }

  .transparent-border15{
    width:25%;
    margin-top: 15px;
    margin-left: 40px;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: black; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }
  
  .transparent-border15:hover {
    background-color: #FFAE9D; /* Couleur de fond au survol */
    color: white; /* Couleur du texte au survol */
  }

  .transparent-border2{
    width:50%;
    margin-top: 30px;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: black; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }
  
  .transparent-border2:hover {
    background-color: #FFAE9D; /* Couleur de fond au survol */
    color: white; /* Couleur du texte au survol */
  }

  .transparent-border3{
    width:100%;
    margin-left: -25px;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: black; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }

  .transparent-border3:hover {
    background-color: white; /* Couleur de fond au survol */
    color: #CCECE9; /* Couleur du texte au survol */
  }

  .transparent-border4{
    width:25%;
    margin-left: 500px;
    margin-top: -30px;
    background-color: #FAF0F5;
    padding: 10px 20px;
    border: 2px solid #385591; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: black; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }
  
  .transparent-border4:hover {
    background-color: #385591; /* Couleur de fond au survol */
    color: white; /* Couleur du texte au survol */
  }

  .transparent-border5{
    width: 30%;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #385591; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: #385591; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }
  
  .transparent-border5:hover {
    background-color: #385591; /* Couleur de fond au survol */
    color: white; /* Couleur du texte au survol */
  }

  .transparent-border6{
    background-color: #9ADAD5;
    padding: 10px 20px;
    border: 2px solid #9ADAD5; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: white; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }
  
  .transparent-border6:hover {
    background-color: #9ADAD5; /* Couleur de fond au survol */
    color: #9ADAD5; /* Couleur du texte au survol */
  }

  .transparent-border7{
    width:25%;
    margin-left: 95px;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: white; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }

  .transparent-border12 {
    width: 30%;
    margin-left: 8px;
    background-color: #CCECE9;
    margin-right: 30px;
    padding: 10px 20px;
    border: 2px solid #CCECE9; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: white; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }

  .transparent-border7:hover {
    background-color: white; /* Couleur de fond au survol */
    color: #CCECE9; /* Couleur du texte au survol */
  }

  .transparent-border12:hover {
    background-color: white; /* Couleur de fond au survol */
    color: #CCECE9; /* Couleur du texte au survol */
  }

  .transparent-border8{
    background-color: #d5e8fc;
    font-size: 22px;
    color: #8493c4; /* Couleur du texte */
  }

  .transparent-border8:hover {
    background-color: #d5e8fc; /* Couleur de fond au survol */
    color: #385591; /* Couleur du texte au survol */
  }

  .transparent-border9{
    border: 2px solid black; /* Couleur de contour */
    color: black; 
    font-size: 20px; 
    border-radius: 17px;
    background-color: transparent;
  }

  .transparent-border10{
    width: 100px;
    margin-left: -25px;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9; /* Couleur de contour */
    border-radius: 20px; /* Coins arrondis */
    color: white; /* Couleur du texte */
    font-size: 1.2em; /* Taille de la police */
    cursor: pointer; /* Change le curseur en main lors du survol */
    transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
  }

  .transparent-border10:hover {
    background-color: white; /* Couleur de fond au survol */
    color: #CCECE9; /* Couleur du texte au survol */
  }

  .frame-container {
    perspective: 1000px;
  }
  
  .video-frame {
    width: 580px; /* Ajuste la largeur de ton cadre */
    height: 335px; /* Ajuste la hauteur de ton cadre */
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333; /* Épaisseur du bord du cadre */
    position: relative;
    overflow: hidden;
  }
  
  .video-frame video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .frame-shadow {
    width: 520px; /* Légèrement plus large que le cadre */
    height: 20px; /* Hauteur de l'ombre/reflet */
    background: rgba(0, 0, 0, 0.1);
    margin-top: -5px; /* Ajuste la proximité de l'ombre au cadre */
    filter: blur(5px); /* Flou de l'ombre/reflet */
    transform: translateY(10px) rotateX(-45deg); /* Angle et distance de l'ombre/reflet */
    opacity: 0.2; /* Transparence de l'ombre/reflet */
  }

  .ecran-cache {
    position: fixed; /* Fixe par rapport à la fenêtre du navigateur */
    top: 0;
    right: -100%; /* Commence caché hors de la vue */
    width: 100%;
    height: 100%;
    background-color: white; /* Ou toute autre couleur */
    z-index: 1000; /* S'assure qu'il est au-dessus des autres contenus */
    transition: right 0.5s; /* Anime le mouvement de glissement */
  }

  .fond_right{
    width: 100%;
    height: 100%;
    background-color: white; /* Ou toute autre couleur */
    background: url("https://osteodispo.fr/assets/img/commercial/entreprise/FOND_OSTEODISPO_SANS_LOGO.png") no-repeat center center;
    background-size: cover; /* Ajustez selon vos besoins */
    overflow-y: scroll;
  }
  
  .ecran-visible {
    right: 0; /* Glisse pour être entièrement visible */
  }

  .carousel {
    position: relative;
    background: #f9f0f7; /* Couleur de fond à ajuster */
    border-radius: 20px; /* Arrondissement des coins */
    padding: 20px;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1); /* Ombre pour un effet 3D */
    width: 94%; /* À ajuster selon vos besoins */
    margin: auto; /* Centrer le carrousel */
  }

  .carousel2 {
    position: relative;
    border-radius: 20px; /* Arrondissement des coins */
    padding: 20px;
    margin: auto; /* Centrer le carrousel */
  }
  
  .feature-item {
    border-radius: 15px;
    margin: 10px 0;
    padding: 10px;
    padding-left: 60px;
  }
  
  .feature-number {
    background-color: #ffae9d;
    color: #fff;
    border-radius: 50%;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-right: 10px;
    font-weight: bold;
  }

  .feature-number2 {
    background-color: #ffae9d;
    color: #fff;
    border-radius: 50%;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-right: 10px;
    font-weight: bold;
  }
  
  .feature-text {
    color: #385591;
    font-weight: bold;
  }
  
  .carousel-control-prev-icon,
  .carousel-control-next-icon {
    background-color: #385591;
    border-radius: 50%;
    padding-bottom: 20px;
    width: 30px;
    height: 30px;
  }
  
  /* Autres styles pour le contrôleur peuvent être ajoutés ici */
  
  .sr-only {
    display: none; /* Cache le texte pour les lecteurs d'écran */
  }

  .frame-container2 {
    perspective: 1000px;
  }
  
  .video-frame2 {
    margin: auto;
    width: 520px; /* Ajuste la largeur de ton cadre */
    height: 290px; /* Ajuste la hauteur de ton cadre */
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333; /* Épaisseur du bord du cadre */
    position: relative;
    overflow: hidden;
  }
  
  .video-frame2 video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .frame-shadow2 {
    width: 520px; /* Légèrement plus large que le cadre */
    height: 20px; /* Hauteur de l'ombre/reflet */
    background: rgba(0, 0, 0, 0.1);
    margin-top: -5px; /* Ajuste la proximité de l'ombre au cadre */
    filter: blur(5px); /* Flou de l'ombre/reflet */
    transform: translateY(10px) rotateX(-45deg); /* Angle et distance de l'ombre/reflet */
    opacity: 0.2; /* Transparence de l'ombre/reflet */
  }

  .img-avantage-osteo{
    width: 200px;
}

.border-table{
    text-align: center; 
    border-left: 2.5px solid #385591; 
    border-right: 2.5px solid #385591;
    align-items: center;
}
  
.img-telephone-osteo{
    width: 150px;
}

.img-siege-osteo{
    width: 550px;
}

.img-bandeau-osteo{
    width: 95px;
}

.logo_osteo{
  margin-top: 25px;
  width: 200px;
}

.accueil_osteo{
  font-size: 40px;
  padding-left: 20px;
}

.ninja_osteo{
  width:650px;
}

.h2_def{
  font-size: 30px;
}

.p_def{
  font-size: 23px;
}

.video_osteo{
  width: 560px; 
  height: 315px;
}

.li_frame_osteo{
  background-color: rgba(252, 247, 249, 0.6); 
  border-radius: 20px; 
  margin-left:-40px;
}

.li_avant{
  background-color: transparent; 
  border: 3px solid #FFAE9D; 
  border-radius: 20px; 
  margin-left:-70px;
}

.statistique{
  width: 60%;
}

.container_ensemble{
  width: 20%; 
  margin-top: 20px;
}

.img-chiffre-osteo{
  width: 40px;
}

.img-chiffre2-osteo{
  width: 45px;
}

.img-barre-osteo{
  width: 41px;
}

.tel{
  display: none;
}

@media screen and (min-width: 1800px) and (max-width: 2099px){
    .texte1{
        margin-bottom: 55px;
    }

    .texte2{
        margin-bottom: 55px;
    }
  }

  

  @media only screen and (max-width: 600px) {
    .ninja_osteo{
      width:400px;
      margin-left: -30px;
    }

    .btn_accueil_osteo{
      width:80%; 
      font-size: 1.2em; 
      background-color:#9ADAD5; 
      border-radius: 15px; 
      margin-left:-30px;
    }

    .h1_titre_osteo{
      font-size: 35px;
    }

    .img-calendier-osteo{
      width: 300px;
      margin-bottom: 20px;
    }

    .img-velo-osteo{
      width: 300px;
      margin-left:-10px;
      margin-bottom: 40px;
    }

    .transparent-border{
      width:35%;
      margin-top: 30px;
      background-color: transparent;
      padding: 10px 20px;
      border: 2px solid #FFAE9D; /* Couleur de contour */
      border-radius: 20px; /* Coins arrondis */
      color: black; /* Couleur du texte */
      font-size: 1.2em; /* Taille de la police */
      cursor: pointer; /* Change le curseur en main lors du survol */
      transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
      margin-bottom: 30px;
    }
    
    .transparent-border:hover {
      background-color: #FFAE9D; /* Couleur de fond au survol */
      color: white; /* Couleur du texte au survol */
    }

    .h2_def{
      font-size: 22px;
    }

    .p_def{
      font-size: 17px;
      margin-bottom: 20px;
      margin-top: -25px;
      color: #385591;
      font-weight: 400;
    }

    .transparent-border2{
      width:80%;
      margin-top: 0px;
      background-color: transparent;
      padding: 10px 20px;
      border: 2px solid #FFAE9D; /* Couleur de contour */
      border-radius: 20px; /* Coins arrondis */
      color: black; /* Couleur du texte */
      font-size: 1.2em; /* Taille de la police */
      cursor: pointer; /* Change le curseur en main lors du survol */
      transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
      margin-bottom: 30px;
    }
    
    .transparent-border2:hover {
      background-color: #FFAE9D; /* Couleur de fond au survol */
      color: white; /* Couleur du texte au survol */
    }

    .video_osteo{
      width: 320px; 
      height: 215px;
      margin-left:-1px;
    }

    .frame-container {
      perspective: 500px;
    }
    
    .video-frame {
      margin-left: -25px;
      width: 320px; /* Ajuste la largeur de ton cadre */
      height: 215px; /* Ajuste la hauteur de ton cadre */
      background: #000;
      border-radius: 20px;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
      border: 10px solid #333; /* Épaisseur du bord du cadre */
      position: relative;
      overflow: hidden;
    }
    
    .video-frame video {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .frame-shadow {
      width: 520px; /* Légèrement plus large que le cadre */
      height: 20px; /* Hauteur de l'ombre/reflet */
      background: rgba(0, 0, 0, 0.1);
      margin-top: -5px; /* Ajuste la proximité de l'ombre au cadre */
      filter: blur(5px); /* Flou de l'ombre/reflet */
      transform: translateY(10px) rotateX(-45deg); /* Angle et distance de l'ombre/reflet */
      opacity: 0.2; /* Transparence de l'ombre/reflet */
    }

    .li_frame_osteo{
      background-color: rgba(252, 247, 249, 0.6); 
      border-radius: 20px; 
      margin-left:-25px;
      margin-top: 20px;
    }

    .transparent-border3{
      width:100%;
      margin-left: -25px;
      margin-top: 30px;
      background-color: #CCECE9;
      padding: 10px 20px;
      border: 2px solid #CCECE9; /* Couleur de contour */
      border-radius: 20px; /* Coins arrondis */
      color: white; /* Couleur du texte */
      font-size: 1.2em; /* Taille de la police */
      cursor: pointer; /* Change le curseur en main lors du survol */
      transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
    }
  
    .transparent-border3:hover {
      background-color: white; /* Couleur de fond au survol */
      color: #CCECE9; /* Couleur du texte au survol */
    }

    .li_avant{
      background-color: transparent; 
      border: 3px solid #FFAE9D; 
      border-radius: 20px; 
      margin-left: -25px;
    }

    .transparent-border4{
      width:30%;
      margin-left: 75px;
      margin-top: -20px;
      background-color: #FAF0F5;
      padding: 10px 20px;
      border: 2px solid #385591; /* Couleur de contour */
      border-radius: 20px; /* Coins arrondis */
      color: black; /* Couleur du texte */
      font-size: 1.2em; /* Taille de la police */
      cursor: pointer; /* Change le curseur en main lors du survol */
      transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
    }
    
    .transparent-border4:hover {
      background-color: #385591; /* Couleur de fond au survol */
      color: white; /* Couleur du texte au survol */
    }

    .img-avantage-osteo{
      width: 200px;
      margin-left: 110px;
    }

    .statistique{
      width: 100%;
    }

    .feature-item {
      border-radius: 15px;
      margin: 10px 0;
      padding: 10px;
      padding-left: 60px;
    }
  
    .feature-number2 {
      background-color: #ffae9d;
      color: #fff;
      border-radius: 50%;
      padding-right: 13.5px; 
      padding-left: 13.5px; 
      padding-top: 12.5px; 
      padding-bottom: 12.5px;
      margin-right: 10px;
      margin-bottom:20px;
      font-weight: bold;
    }

    .container_ensemble{
      width: 80%; 
      margin-top: 20px;
      display: none;
    }

    .img-telephone-osteo{
      width: 150px;
      margin-left: 70px;
    }

    .h1_obtenir{
      text-align: center;
      font-size: 30px;
    }

    .img-siege-osteo{
      width: 450px;
      margin-left: -80px;
      margin-top: -30px;
      display: none;
    }

    .img-chiffre-osteo{
      width: 35px;
      margin-left: 120px;
      margin-top: 30px;
      margin-bottom: -10px;
    }

    .img-barre-osteo{
      display: none;
    }

    .img-chiffre2-osteo{
      width: 45px;
      margin-left: 120px;
      margin-top: 30px;
      margin-bottom: 30px;
    }

    .h3_osteo{
      text-align:center;
    }

    .transparent-border7{
      width:50%;
      margin-top: 30px;
      margin-left: 50px;
      background-color: #CCECE9;
      padding: 10px 20px;
      border: 2px solid #CCECE9; /* Couleur de contour */
      border-radius: 20px; /* Coins arrondis */
      color: white; /* Couleur du texte */
      font-size: 1.2em; /* Taille de la police */
      cursor: pointer; /* Change le curseur en main lors du survol */
      transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
    }
  
    .transparent-border7:hover {
      background-color: white; /* Couleur de fond au survol */
      color: #CCECE9; /* Couleur du texte au survol */
    }

    .transparent-border15{
      width:50%;
      margin-top: 15px;
      margin-left: 50px;
      background-color: transparent;
      padding: 10px 20px;
      border: 2px solid #FFAE9D; /* Couleur de contour */
      border-radius: 20px; /* Coins arrondis */
      color: black; /* Couleur du texte */
      font-size: 1.2em; /* Taille de la police */
      cursor: pointer; /* Change le curseur en main lors du survol */
      transition: background-color 0.3s, color 0.3s; /* Animation de transition pour le survol */
    }
    
    .transparent-border15:hover {
      background-color: #FFAE9D; /* Couleur de fond au survol */
      color: white; /* Couleur du texte au survol */
    }

    .lest{
      margin-top:-42px;
    }

    .bandeau_texte{
      padding-top:-25px;
      padding-bottom: 25px;
    }

    .efface{
      display: none;
    }

    .title_chiffre{
      padding-top: 20px;
    }
    
  }

@media only screen and (max-width: 419px) {

  #rec673010886 .t396__artboard {
    height: 515px !important;
  }

  .ul_formule{
    margin-left: -25px;
  }

  .transparent-border12 {
    width: 42% !important;
    margin-left: 80px !important;
  }

  .p_securite{
    display: none;
  }

  #rec673004330{
    margin-top: 20px !important;
  }

  .h1_maitre{
    padding-top: 0px !important;
    padding-bottom: 10px;
    font-size: 24px;
  }

  .logo_osteo {
    margin-top: 10px !important;
    width: 165px !important;
    margin-bottom: 30px;
  }

  .t142__submit{
    background-color: white !important;
  }

  .img-securite{
    margin-left: 45px;
    width: 225px;
    margin-top: 0px;
  }

  .h4_fonction{
    display: none;
  }

  .tel{
    display: block !important;
  }

  .empty{
    display: none;
  }

  .feature-number{
    display: none;
  }

  .h3_header{
    text-align: left;
    margin-top: 20px;
    color: black;
    text-align: center;
    font-size: 24px;
  }

  .h4_header{
    text-align: left;
    margin-top: 10px;
    text-align: center;
    color: black;
    font-size: 15px;
    padding: 0px 22px;
  }

  .h3_fonction{
    font-size: 24px;
  }

  .btn-inscription{
    background-color: #798BFD;
    color: white;
    margin-top: 20px;
    margin-bottom: 25px;
    font-size: 15px;
    padding: 7px 22px;
    border-radius: 20px;
  }

  .video-frame {
    margin: 0 auto;
    width: 290px !important;
    height: 160px !important;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333;
    position: relative;
    overflow: hidden;
  }

  #rec674408945{
    display: none !important;
  }

  .container_texte {
    position: relative;
    background: url(https://osteodispo.fr/assets/img/commercial/LOGO_OD.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 345px;
    margin-top: 30px !important;
    background-size: 25%;
    z-index: 0;
    overflow: hidden;
    margin-top: -17px !important;
  }

  .scroll_texte1 {
    height: 220px;
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    overflow-y: scroll;
    font-size: 17px;
    color: #385591 !important;
  }

  .container-osteo{
    width: 345px;
  }

  .demo_button {
    font-size: 18px;
    color: #7c91f3;
    border: 1px solid #7c91f3;
    margin-top: 40px;
    border-radius: 20px;
    margin-bottom: 15px !important;
  }
  
  .transparent-border2 {
    width: 300px !important;
  }

  .container_marche{
    width: 345px;
    margin-bottom: 30px;
    display: none;
  }

  .container_marche h2{
    font-size: 22px !important;
  }

  .container_marche h3{
    font-size: 25px !important;
  }

  .container_fonction{
    width: 330px;
    max-width: 330px;
  }

  .sidebar {
    flex-direction: column;
    width: 335px;
    border-bottom: 2px solid #e0e0e0;
  }

  .sidebar button {
    background: none;
    border: 1px solid #d0d0ff;
    border-radius: 8px;
    padding: 15px 15px;
    font-size: 15px;
    text-align: left;
    margin-bottom: 15px;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    color: #798BFD;
    transition: 0.3s;
    margin-left: 4px;
  }

  .sidebar button.active {
    background-image: linear-gradient(90deg, #579ffa, #635cff) !important;
    color: white;
    font-size: 15px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 17px; 
    border-radius: 25px;
    display: none;
  }

  .content {
    flex: 1;
    display: none;
    margin-top: 20px;
  }

  .content h2 {
    color: #4a4acf;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .content p {
    font-size: 20px;
    color: black;
    font-weight: 400;
    line-height: 1.6;
  }

  .content li {
    color: black;
    font-weight: 400;
    font-size: 20px;
  }

  .container_question{
    width: 375px !important;
  }

  .content ul{
    width: 285px !important;
  }

  .table-columns-wrapper {
    display: flex;
    justify-content: center;
    gap: 55px;
    flex-wrap: wrap;
  }

  .container_parti{
    width: 315px;
    margin-bottom: 50px !important;
  }

  .header_osteopathe_fond{
    padding-top: 15px !important;
  }

  .transparent-border10 {
    margin-left: 0px !important;
  }

  .table-cell{
    height: 50px;
  }
  
  .table-column {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 15px;
    width: 320px;
    background-color: white;
  }

  .table-column_2 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
    display: none;
  }

  .table-column_3 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
    display: none;
  }
  
  .table-header {
    font-weight: bold;
    text-align: center;
    padding: 10px 0;
    border-bottom: 2px solid lightgray;
    margin-bottom: 10px;
  }

  .faq-container {
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 330px;
    margin: auto;
  }

  .faq-column {
      flex: 1;
      min-width: 300px;
  }

  .faq-item {
      border-bottom: 2px solid black;
      padding: 10px 15px;
      cursor: pointer;
  }

  .faq-answer {
      display: none;
      padding-top: 10px;
      color: #555;
  }

  .faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    gap: 20px;
  }

  .footer-columns .col-md-6{
    width: 345px !important;
  }

  .footer-columns {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    width: 375px;
  }

  .footer-columns {
    flex-direction: column-reverse;
  }
  
  .toggle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    background-color: #798BFD;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  
  

  .img-bon-osteo{
    display: none;
  }

  .btn_accueil_osteo {
    width: 80%;
    font-size: 1.2em;
    background-color: #9ADAD5;
    border-radius: 15px;
    margin-left: 0px !important;
  }

  .bandeau-marquee .marquee-content {
    font-size: 30px !important;
  }

  .ninja_osteo {
    width: 375px;
    margin-left: 0px !important; 
  }

  .nav_chez{
    margin-left: 0px !important;
  }

  .container1{
    width: 345px !important;
  }

  .accueil_osteo {
    font-size: 26px !important;
    padding-left: 0px !important;
  }

  .div_connectons{
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 20px;
    width: 325px !important;
    width: 300px !important;
    padding-left: 20px !important;
    margin-left: 19px !important;
  }

  .col_com {
    margin-left: 0px !important;
  }

  .container2{
    width: 345px !important;
  }

  .nav_def{
    margin-left: 0px !important;
  }

  .h1_titre_osteo {
    font-size: 24px;
    margin-top: 0px;
    margin-bottom: 0px !important;
  }

  .div_rejoigner{
    padding-bottom: 30px !important;
  }

  .video_osteo {
    width: 291px !important;
    height: 160px !important;
    margin-left: -1px;
  }

  .li_avant p{
    padding-left: 20px !important;
    padding-right: 20px !important;
    font-size: 17px !important;
  }

  .li_frame_osteo {
    background-color: rgba(252, 247, 249, 0.6);
    border-radius: 20px;
    margin-left: 0px !important;
    margin-top: 20px;
  }

  .nav_def{
    padding-left: 20px !important;
  }

  .nav_chez{
    width: 345px;
  }

  .transparent-border3 {
    width: 100%;
    margin-left: -22px !important;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .li_avant {
    background-color: transparent;
    border: 3px solid #FFAE9D;
    border-radius: 20px;
    margin-left: 0px !important;
    width: 309px;
  }

  .transparent-border4 {
    width: 30%;
    margin-left: 92.5px !important;
    margin-top: -20px;
    background-color: #FAF0F5;
    padding: 10px 20px;
    border: 2px solid #385591;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .containerTaille{
    width: 345px !important;
  }

  .uc-leaders-title .t-container {
    max-width: 335px !important;
  }

  .container_oste{
    width: 345px !important;
  }

  .img-avantage-osteo {
    width: 150px;
    margin-left: 100px;
    display: none;
  }

  .container_patients{
    width: 315px !important;
    margin-top: 30px !important;
  }

  .div_button_marche{
    margin-bottom: 20px !important;
  }

  .statistique {
    width: 345px;
  }

  .img_type{
    height: 200px;
    margin-top: 15px;
    margin-left: 80px;
  }

  .t-card__title p {
    font-size: 13px !important;
  }

  .img_type_2{
    height: 200px;
    margin-top: 15px;
    margin-left: 22px;
  }

  .img_type_3 {
    height: 200px;
    margin-top: 15px;
    margin-left: 27px;
  }

  .container_obtenir{
    width: 90% !important;
  }

  .img-chiffre-osteo {
    width: 35px;
    margin-left: 140px;
    margin-top: 30px;
    margin-bottom: -10px;
  }

  .img-chiffre2-osteo {
    width: 45px;
    margin-left: 135px !important;
    margin-top: 30px;
    margin-bottom: 30px;
  }

  .transparent-border7 {
    width: 85% !important;
    margin-top: 30px;
    margin-left: 0px !important;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .transparent-border15 {
    width: 85% !important;
    margin-top: 15px;
    margin-left: 0px !important;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }
  .container3 {
    margin-top: 30px;
    width: 345px;
    background-color: #FAF0F5;
    padding-top: 25px;
    padding-bottom: 20px;
  }

  .uc-features-slider .t923__wrapper {
    width: 273px !important;
    height: 505px !important;
    padding: 24px 17px 16px 17px;
    border-radius: 28px;
    margin-top: 35px;
    margin-bottom: 28px;
    gap: 20px;
    margin-left: -5px;
  }

  .uc-text-loop-1 .t1003__item .t1003__item-txt {
    margin-top: -25px;
    font-size: 30px !important;
    line-height: 48px;
    padding-left: 16px;
    padding-right: 14px;
  }

  .uc-features-slider .t-slds__container {
    width: 375px !important;
  }

  .uc-features-slider .t-slds__items-wrapper {
    height: 685px !important;
  }

  .div_container_profil{
    width: 93% !important;
    margin-left: -13.5px !important;
    margin-top: 20px !important;
  }

  .btn_rejoindre{
    width: 87% !important;
    font-size: 17px !important;
    margin-bottom: 10px !important;
  }

  .card_gratuit{
    margin-left: 25px;
    margin-right: 0px !important;
  }

  .card_formule{
    width: 300px !important;
  }

  .img-opportunite{
    display: none;  
  }

  .transparent-border9 {
    border: 2px solid black;
    color: black;
    font-size: 20px;
    border-radius: 17px;
    background-color: transparent;
    width: 220px !important;
  }

  .div_argent{
    width: 335px !important;
    margin-left: 20px !important;
    margin-bottom: 20px !important;
  }

  .container4{
    width: 345px;
  }
  .col_efface{
    display: none;
  }

  .col_bon{
    margin-top: 0px;
  }

  .col-9 h4{
    font-size: 20px;
  }

  .container_etape{
    width: 330px !important;
  }

  .col_com{
    width: 65% !important;
    margin-bottom: 20px;
  }

  .container_com{
    width: 315px !important;
    margin-top: 15px !important;
  }

  .t142__wraptwo {
    text-align: center !important;
  }

  #rec673004330 .t030__title{
    text-align: center;
  }

  .uc-leaders-title .t-col {
     padding-left: 0px !important;
    padding-right: 20px;
  }

  .a_header{
    color: #7c91f3;
  }

  #form-newsletter .row .col-md-8 .custom-input {
    font-size: 0.9em !important;
    height: 32px !important;
    width: 80% !important;
  }

  .col-md-4 .btn_abonne {
    font-size: 1em !important;
    padding: 10px 0px !important;
    margin-left: 0px;
    width: 100% !important;
    margin-top: 20px;
  }
  
  .col_osteodispo{
    text-align: center;
  }

  .navbar-brand img {
    width: 55px;
  }

  .nos_container{
    width: 345px !important;
  }

  .btn_marche{
    color: #798BFD;
    font-size: 22px;
    text-decoration: none;
    border: 1px solid #798BFD;
    padding: 10px 25px;
    border-radius: 30px;
  }

  .h2_titre_formule{
    margin-top: 15px !important;
  }

  .h1_reussir{
    margin-top: -10px !important;
    margin-bottom: 20px;
    font-size: 24px;
  }

  .h1_bon{
    font-size: 24px;
  }

  .div_bon{
    padding-top: 0px !important;
  }

  .transparent-border6 {
    width: 140px !important;
    margin-top: 10px;
    margin-left: 85px;
  }

  .transparent-border5 {
    width: 142px !important;
    margin-left: 83px;
  }

  .uc-calc .t712__descr-second {
    font-size: 20px !important;
  }

  .uc-calc form .t-input-title {
    font-size: 14px !important;
  }

  .conatiner_maitre{
    width: 345px !important;
    margin-top: 20px;
  }

  .video-frame2 {
    width: 325px !important;
    height: 175px !important;
  }

  .iframe_video_2{
    width: 326px !important;
    height: 175px !important;
  }

  .carousel_maitre{
    width: 305px !important;
  }

  .feature-number2{
    display: none;
  }

  .container_details_2{
    width: 345px !important;
  }

  .page-info__svg{
    width: 345px !important;
    height: 255px !important;
  }

  .container_produ {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
  }

  .card_propu {
      background: white;
      border-radius: 10px;
      padding: 20px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      text-align: left;
      transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      width: 300px;
      max-width: 100%;
  }

  .card_propu:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  }

  .card_propu h3 {
      font-size: 20px;
      color: #798BFD;
      margin-bottom: 10px;
  }

  .card_propu ul {
      list-style: none;
      padding: 0;
  }

  .card_propu ul li {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 17px;
      color: black;
      margin-bottom: 6px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 20px; 
    border-radius: 25px;
  }

  #carousel_672836226 {
    transform: matrix(1, 0, 0, 1, -281, 0);
  }
}

@media only screen and (min-width: 420px) and (max-width: 600px) {

  #rec673010886 .t396__artboard {
    height: 515px !important;
  }

  .ul_formule{
    margin-left: -25px;
  }

  .col_com {
    margin-left: 0px !important;
  }

  .footer-columns .col-md-6{
    width: 345px !important;
  }

  .footer-columns {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    width: 375px;
  }

  .footer-columns {
    flex-direction: column-reverse;
  }

  .row_connectons {
    margin-left: 0px !important;
    width: 387px;
}


  .container_produ {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
  }

  .card_propu {
      background: white;
      border-radius: 10px;
      padding: 20px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      text-align: left;
      transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      width: 300px;
      max-width: 100%;
  }

  .card_propu:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  }

  .card_propu h3 {
      font-size: 20px;
      color: #798BFD;
      margin-bottom: 10px;
  }

  .card_propu ul {
      list-style: none;
      padding: 0;
  }

  .card_propu ul li {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 17px;
      color: black;
      margin-bottom: 6px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 20px; 
    border-radius: 25px;
  }

  .page-info__svg{
    width: 345px !important;
    height: 255px !important;
  }

  .container_details_2{
    width: 345px !important;
  }

  .feature-number2{
    display: none;
  }

  .carousel_maitre{
    width: 305px !important;
  }

  .iframe_video_2{
    width: 326px !important;
    height: 175px !important;
  }

  .h1_maitre{
    padding-top: 20px !important;
    font-size: 26px;
  }

  .conatiner_maitre{
    width: 345px !important;
    margin-top: 20px;
  }

  .div_bon{
    padding-top: 10px !important;
  }

  .container_com{
    width: 315px !important;
    margin-top: 15px !important;
  }

  .h1_reussir{
    margin-top: 15px !important;
    margin-bottom: 20px;
    font-size: 30px;
  }

  .img-securite{
    margin-left: 65px;
    width: 225px;
    margin-top: 20px;
  }

  .h1_bon{
    font-size: 30px;
  }

  .div_button_marche{
    margin-bottom: 20px !important;
  }

  .h2_titre_formule{
    margin-top: 15px !important;
  }

  .h4_fonction{
    display: none;
  }

  .header_osteopathe_fond{
    padding-top: 15px !important;
  }

  .feature-number {
    display: none;
  }

  .h3_header{
    text-align: left;
    margin-top: 20px;
    color: black;
    text-align: center;
  }

  .h4_header{
    text-align: left;
    margin-top: 10px;
    text-align: center;
    color: black;
    font-size: 15px;
    padding: 0px 22px;
  }

  .tel{
    display: block !important;
  }

  .empty{
    display: none;
  }

  .btn-inscription{
    background-color: #798BFD;
    color: white;
    margin-top: 20px;
    margin-bottom: 25px;
    font-size: 15px;
    padding: 7px 30px;
    border-radius: 20px;
  }

  .video-frame {
    margin: 0 auto;
    width: 290px !important;
    height: 160px !important;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333;
    position: relative;
    overflow: hidden;
  }

  #rec674408945{
    display: none !important;
  }

  .container_texte {
    position: relative;
    background: url(https://osteodispo.fr/assets/img/commercial/LOGO_OD.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 345px;
    margin-top: 30px !important;
    background-size: 25%;
    z-index: 0;
    overflow: hidden;
  }

  .scroll_texte1 {
    height: 220px;
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    overflow-y: scroll;
    font-size: 17px;
  }

  .container-osteo{
    width: 345px;
  }

  .demo_button {
    font-size: 18px;
    color: #7c91f3;
    border: 1px solid #7c91f3;
    margin-top: 40px;
    border-radius: 20px;
  }

  .container_marche{
    width: 345px;
    margin-bottom: 30px;
    display: none;
  }

  .container_marche h2{
    font-size: 22px !important;
  }

  .container_marche h3{
    font-size: 25px !important;
  }

  .container_fonction{
    width: 330px;
    max-width: 330px;
  }

  .sidebar {
    flex-direction: column;
    width: 335px;
    border-bottom: 2px solid #e0e0e0;
  }

  .sidebar button {
    background: none;
    border: 1px solid #d0d0ff;
    border-radius: 8px;
    padding: 15px 15px;
    font-size: 15px;
    text-align: left;
    margin-bottom: 15px;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    color: #798BFD;
    transition: 0.3s;
    margin-left: 4px;
  }

  .sidebar button.active {
    background-image: linear-gradient(90deg, #579ffa, #635cff) !important;
    color: white;
    font-size: 15px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 17px; 
    border-radius: 25px;
    display: none;
  }

  .content {
    flex: 1;
    display: none;
    margin-top: 20px;
  }

  .content h2 {
    color: #4a4acf;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .content p {
    font-size: 20px;
    color: black;
    font-weight: 400;
    line-height: 1.6;
  }

  .content li {
    color: black;
    font-weight: 400;
    font-size: 20px;
  }

  .content ul{
    width: 285px !important;
  }

  .table-columns-wrapper {
    display: flex;
    justify-content: center;
    gap: 55px;
    flex-wrap: wrap;
  }

  .container_parti{
    width: 315px;
  }

  .transparent-border10 {
    margin-left: 0px !important;
  }

  .table-cell{
    height: 50px;
  }
  
  .table-column {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 320px;
    background-color: white;
  }

  .table-column_2 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
    display: none;
  }

  .table-column_3 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
    display: none;
  }
  
  .table-header {
    font-weight: bold;
    text-align: center;
    padding: 10px 0;
    border-bottom: 2px solid lightgray;
    margin-bottom: 10px;
  }

  .faq-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 330px;
    margin: auto;
  }

  .faq-column {
      flex: 1;
      min-width: 300px;
  }

  .faq-item {
      border-bottom: 2px solid black;
      padding: 10px 15px;
      cursor: pointer;
  }

  .faq-question {
      font-size: 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
  }

  .faq-answer {
      display: none;
      padding-top: 10px;
      color: #555;
  }

  .footer-columns {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    width: 375px;
  }

  .footer-columns {
    flex-direction: column-reverse;
  }
  
  .toggle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    background-color: #798BFD;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .btn_accueil_osteo {
    width: 80%;
    font-size: 1.2em;
    background-color: #9ADAD5;
    border-radius: 15px;
    margin-left: 0px !important;
  }

  .img-bon-osteo{
    display: none;
  }

  .ninja_osteo {
    width: 375px;
    margin-left: 0px !important; 
  }

  .nav_chez{
    margin-left: 0px !important;
  }

  .container1{
    width: 93% !important;
  }

  .accueil_osteo {
    font-size: 22px !important;
    padding-left: 0px;
  }

  .div_connectons{
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 20px;
    width: 315px !important;
    padding-left: 20px !important;
    margin-left: 19px !important;
  }

  .marquee-content{
    font-size: 35px !important;
  }

  .container2{
    width: 390px !important;
  }

  .h3_fonction{
    font-size: 23px;
  }

  .nav_def{
    margin-left: 0px !important;
    padding-left: 20px !important;
  }

  .h1_titre_osteo {
    font-size: 31px;
    margin-top: 0px;
  }

  .video_osteo {
    width: 312px !important;
    height: 160px !important;
    margin-left: -1px;
  }

  .video-frame {
    width: 310px !important;
    height: 160px !important;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
  }

  .li_frame_osteo {
    background-color: rgba(252, 247, 249, 0.6);
    border-radius: 20px;
    margin-left: 0px !important;
    margin-top: 20px;
  }

  .transparent-border3 {
    width: 100%;
    margin-left: -22px !important;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .li_avant {
    background-color: transparent;
    border: 3px solid #FFAE9D;
    border-radius: 20px;
    margin-left: 0px !important;
  }

  .video-frame2 {
    width: 325px !important;
    height: 175px !important;
  }

  .transparent-border4 {
    width: 30%;
    margin-left: 110px !important;
    margin-top: -20px;
    background-color: #FAF0F5;
    padding: 10px 20px;
    border: 2px solid #385591;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .btn_marche{
    color: #798BFD;
    font-size: 21px;
    text-decoration: none;
    border: 1px solid #798BFD;
    padding: 10px 25px;
    border-radius: 30px;
  }

  .containerTaille{
    width: 390px !important;
  }

  .uc-leaders-title .t-container {
    max-width: 335px !important;
  }

  .container_oste{
    width: 345px !important;
  }

  .img-avantage-osteo {
    width: 150px;
    margin-left: 100px;
    display: none;
  }

  .container_patients{
    width: 360px !important;
  }

  .statistique {
    width: 355px;
  }

  .img_type{
    height: 200px;
    margin-top: 15px;
    margin-left: 80px;
  }

  .t-card__title p {
    font-size: 13px !important;
  }

  .img_type_2{
    height: 200px;
    margin-top: 15px;
    margin-left: 22px;
  }

  .img_type_3 {
    height: 200px;
    margin-top: 15px;
    margin-left: 27px;
  }

  .container_obtenir{
    width: 90% !important;
  }

  .img-chiffre-osteo {
    width: 35px;
    margin-left: 140px;
    margin-top: 30px;
    margin-bottom: -10px;
  }

  .img-chiffre2-osteo {
    width: 45px;
    margin-left: 135px !important;
    margin-top: 30px;
    margin-bottom: 30px;
  }

  .transparent-border7 {
    width: 85% !important;
    margin-top: 30px;
    margin-left: 0px !important;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .transparent-border15 {
    width: 85% !important;
    margin-top: 15px;
    margin-left: 0px !important;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }
  .container3 {
    margin-top: 30px;
    width: 93%;
    background-color: #FAF0F5;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .uc-features-slider .t923__wrapper {
    width: 273px !important;
    height: 505px !important;
    padding: 24px 17px 16px 17px;
    border-radius: 28px;
    margin-top: 35px;
    margin-bottom: 28px;
    gap: 20px;
    margin-left: -5px;
  }

  .uc-text-loop-1 .t1003__item .t1003__item-txt {
    margin-top: -25px;
    font-size: 30px !important;
    line-height: 48px;
    padding-left: 16px;
    padding-right: 14px;
  }

  .uc-features-slider .t-slds__container {
    width: 375px !important;
  }

  .uc-features-slider .t-slds__items-wrapper {
    height: 680px !important;
  }

  .div_container_profil{
    width: 93% !important;
    margin-left: -13.5px !important;
    margin-top: 20px !important;
  }

  .btn_rejoindre{
    width: 87% !important;
    font-size: 17px !important;
  }

  .card_gratuit{
    margin-left: 25px;
    margin-right: 0px !important;
  }

  .card_formule{
    width: 300px !important;
  }

  .img-opportunite{
    display: none;  
  }

  .transparent-border9 {
    border: 2px solid black;
    color: black;
    font-size: 20px;
    border-radius: 17px;
    background-color: transparent;
    width: 220px !important;
  }

  .logo_osteo {
    width: 150px !important;
  }

  .div_argent{
    width: 335px !important;
    margin-left: 42px !important;
    margin-bottom: 20px !important;
  }

  .container4{
    width: 390px;
  }
  .col_efface{
    display: none;
  }

  .col_bon{
    margin-top: 0px;
  }

  .col-9 h4{
    font-size: 20px;
  }

  .container_etape{
    width: 330px !important;
  }

  .col_com{
    width: 65% !important;
    margin-bottom: 20px;
  }

  .container_com{
    width: 315px !important;
  }

  .t142__wraptwo {
    text-align: center !important;
  }

  #rec673004330 .t030__title{
    text-align: center;
  }

  .uc-leaders-title .t-col {
     padding-left: 0px !important;
    padding-right: 20px;
  }

  .a_header{
    color: #7c91f3;
  }

  #form-newsletter .row .col-md-8 .custom-input {
    font-size: 0.9em !important;
    height: 32px !important;
    width: 80% !important;
  }

  .col-md-4 .btn_abonne {
    font-size: 1em !important;
    padding: 10px 0px !important;
    margin-left: 0px;
    width: 100% !important;
    margin-top: 20px;
  }
  
  .col_osteodispo{
    text-align: center;
  }

  .navbar-brand img {
    width: 55px;
  }

  .nos_container{
    width: 390px !important;
  }
  .fluid-footer{
    width: 390px !important;
  }

  .row_connectons{
    margin-left: 8px;
  }

  #carousel_672836226 {
    transform: matrix(1, 0, 0, 1, -281, 0);
  }
}

@media only screen and (min-width: 601px) and (max-width: 767px)
{

  .container-osteo{
    width: 570px;
  }

  .container_marche{
    width: 570px;
  }

  .uc-income-title [field="title"] {
    font-size: 39px !important;
  }

  .sidebar {
    flex-direction: column;
    width: 525px;
    border-bottom: 2px solid #e0e0e0;
    padding-right: 15px;
  }

  .btn_marche{
    color: #798BFD;
    font-size: 21px;
    text-decoration: none;
    border: 1px solid #798BFD;
    padding: 10px 25px;
    border-radius: 30px;
  }

  .sidebar button {
    background: none;
    border: 1px solid #d0d0ff;
    border-radius: 8px;
    padding: 15px 26px;
    font-size: 15px;
    text-align: left;
    margin-bottom: 15px;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    color: #798BFD;
    transition: 0.3s;
    margin-left: 4px;
  }

  .img-avantage-osteo{
    display: none;
  }

  .container_ensemble {
    width: 330px !important;
    margin-top: 20px;
  }

  .sidebar button.active {
    background-image: linear-gradient(90deg, #579ffa, #635cff) !important;
    color: white;
    font-size: 15px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 17px; 
    border-radius: 25px;
    display: none;
  }

  .content {
    flex: 1;
    display: none;
    margin-top: 20px;
  }

  .content h2 {
    color: #4a4acf;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .content p {
    font-size: 20px;
    color: black;
    font-weight: 400;
    line-height: 1.6;
  }

  .content li {
    color: black;
    font-weight: 400;
    font-size: 20px;
  }

  .content ul{
    width: 500px !important;
  }

  .table-columns-wrapper {
    display: flex;
    justify-content: center;
    gap: 55px;
    flex-wrap: wrap;
  }

  .container_parti{
    width: 315px;
  }

  .transparent-border10 {
    margin-left: 0px !important;
  }

  .table-cell{
    height: 50px;
  }
  
  .table-column {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 320px;
    background-color: white;
  }

  .table-column_2 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
    display: none;
  }

  .table-column_3 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
    display: none;
  }
  
  .table-header {
    font-weight: bold;
    text-align: center;
    padding: 10px 0;
    border-bottom: 2px solid lightgray;
    margin-bottom: 10px;
  }

  .faq-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 330px;
    margin: auto;
  }

  .faq-column {
      flex: 1;
      min-width: 300px;
  }

  .faq-item {
      border-bottom: 2px solid black;
      padding: 10px 15px;
      cursor: pointer;
  }

  .faq-question {
      font-size: 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
  }

  .faq-answer {
      display: none;
      padding-top: 10px;
      color: #555;
  }

  .footer-columns {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    width: 375px;
  }

  .footer-columns {
    flex-direction: column-reverse;
  }
  
  .toggle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    background-color: #798BFD;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .btn-inscription{
    background-color: #798BFD;
    color: white;
    margin-top: 20px;
    margin-bottom: 25px;
    font-size: 15px;
    padding: 7px 30px;
    border-radius: 20px;
  }

  .img-bon-osteo{
    display: none;
  }

  .ul_formule{
    margin-left: -25px;
  }

  .col_com {
    margin-left: 0px !important;
  }

  .footer-columns .col-md-6{
    width: 345px !important;
  }

  .footer-columns {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    width: 375px;
  }

  .footer-columns {
    flex-direction: column-reverse;
  }

  .row_connectons {
    margin-left: 0px !important;
    width: 570px;
  }

  .container_produ {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
  }

  .card_propu {
      background: white;
      border-radius: 10px;
      padding: 20px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      text-align: left;
      transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      width: 300px;
      max-width: 100%;
  }

  .card_propu:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  }

  .card_propu h3 {
      font-size: 20px;
      color: #798BFD;
      margin-bottom: 10px;
  }

  .card_propu ul {
      list-style: none;
      padding: 0;
  }

  .card_propu ul li {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 17px;
      color: black;
      margin-bottom: 6px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 20px; 
    border-radius: 25px;
  }

  .page-info__svg{
    width: 345px !important;
    height: 255px !important;
  }

  .container_details_2{
    width: 345px !important;
  }

  .feature-number2{
    display: none;
  }

  .carousel_maitre{
    width: 530px !important;
  }

  .iframe_video_2 {
    width: 520px !important;
    height: 293px !important;
  }

  .transparent-border12 {
    margin-left: 50px !important;
  }

  .h1_maitre{
    padding-top: 20px !important;
    font-size: 27px;
    padding: 0px 20px;
  }

  .conatiner_maitre{
    width: 570px !important;
    margin-top: 20px;
  }

  .div_bon{
    padding-top: 10px !important;
  }

  .img-barre-osteo{
    display: none;
  }

  .img-siege-osteo {
    width: 505px !important;
  }

  .container_com{
    width: 315px !important;
    margin-top: 15px !important;
  }

  .h1_reussir{
    margin-top: 15px !important;
    margin-bottom: 20px;
    font-size: 30px;
  }

  .img-securite{
    margin-left: 155px;
    width: 225px;
    margin-top: 20px;
  }

  .img-opportunite{
    display: none;
  }

  .h1_bon{
    font-size: 30px;
  }

  .div_button_marche{
    margin-bottom: 20px !important;
  }

  .h2_titre_formule{
    margin-top: 15px !important;
  }

  .h4_fonction{
    display: none;
  }

  .header_osteopathe_fond{
    padding-top: 15px !important;
  }

  .feature-number {
    display: none;
  }

  .h3_header{
    text-align: left;
    margin-top: 20px;
    color: black;
    text-align: center;
  }

  .h4_header{
    text-align: left;
    margin-top: 10px;
    text-align: center;
    color: black;
    font-size: 15px;
    padding: 0px 22px;
  }

  .tel{
    display: block !important;
  }

  .empty{
    display: none;
  }

  .container_texte {
    position: relative;
    background: url(https://osteodispo.fr/assets/img/commercial/LOGO_OD.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 570px;
    margin-top: 65px !important;
    background-size: 25%;
    z-index: 0;
    overflow: hidden;
  }

  .scroll_texte1 {
    height: 380px;
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    overflow-y: scroll;
    font-size: 20px;
  }

  .demo_button {
    font-size: 18px;
    color: #7c91f3;
    border: 1px solid #7c91f3;
    margin-top: 40px;
    border-radius: 20px;
  }

  .btn_accueil_osteo {
    width: 80%;
    font-size: 1.2em;
    background-color: #9ADAD5;
    border-radius: 15px;
    margin-left: 0px !important;
  }

  .ninja_osteo {
    width: 375px;
    margin-left: 0px !important; 
  }

  .nav_chez{
    margin-left: 0px !important;
  }

  .accueil_osteo {
    font-size: 22px !important;
    padding-left: 20px;
  }

  .div_connectons{
    width: 475px !important;
    padding: 5px !important;
  }

  .col-perso-osto{
    flex: 0 0 100%;
  }

  .nav_def{
    margin-left: 0px !important;
  }

  .h1_titre_osteo {
    font-size: 31px;
    margin-top: 0px;
  }

  .img-velo-osteo {
    margin-bottom: 40px;
  }

  .transparent-border {
    margin-bottom: 30px;
  }

  .video_osteo {
    width: 451px !important;
    height: 255px !important;
    margin-left: -1px;
  }

  .video-frame {
    margin: 0 auto;
    width: 450px !important;
    height: 254px !important;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333;
    position: relative;
    overflow: hidden;
  }

  .li_frame_osteo {
    background-color: rgba(252, 247, 249, 0.6);
    border-radius: 20px;
    margin-left: 0px !important;
    margin-top: 20px;
  }

  .transparent-border3 {
    width: 100%;
    margin-left: -22px !important;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .li_avant {
    background-color: transparent;
    border: 3px solid #FFAE9D;
    border-radius: 20px;
    margin-left: 0px !important;
  }

  .transparent-border4 {
    width: 30%;
    margin-left: 153px !important;
    margin-top: -20px;
    background-color: #FAF0F5;
    padding: 10px 20px;
    border: 2px solid #385591;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .containerTaille{
    width: 570px !important;
  }

  .uc-leaders-title .t-container {
    max-width: 335px !important;
  }

  .container_oste{
    width: 345px !important;
  }

  .img-avantage-osteo {
    width: 150px;
    margin-left: 100px;
  }

  .container_patients{
    width: 500px !important;
  }

  .statistique {
    width: 345px;
  }

  .img_type{
    height: 200px;
    margin-top: 15px;
    margin-left: 80px;
  }

  .t-card__title p {
    font-size: 13px !important;
  }

  .img_type_2{
    height: 200px;
    margin-top: 15px;
    margin-left: 22px;
  }

  .img_type_3 {
    height: 200px;
    margin-top: 15px;
    margin-left: 27px;
  }

  .container_obtenir{
    width: 90% !important;
  }

  .img-chiffre-osteo {
    width: 35px;
    margin-left: 230px;
    margin-top: 30px;
    margin-bottom: -10px;
  }

  .img-chiffre2-osteo {
    width: 45px;
    margin-left: 135px !important;
    margin-top: 30px;
    margin-bottom: 30px;
  }

  .transparent-border7 {
    width: 85% !important;
    margin-top: 30px;
    margin-left: 0px !important;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .transparent-border15 {
    width: 85% !important;
    margin-top: 15px;
    margin-left: 0px !important;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }
  .container3 {
    margin-top: 30px;
    background-color: #FAF0F5;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .uc-features-slider .t923__wrapper {
    width: 375px !important;
    padding: 24px 17px 16px 17px;
    border-radius: 28px;
    margin-top: 35px;
    margin-bottom: 28px;
    gap: 20px;
    margin-left: -5px;
  }

  .uc-text-loop-1 .t1003__item .t1003__item-txt {
    margin-top: -25px;
    font-size: 30px !important;
    line-height: 48px;
    padding-left: 16px;
    padding-right: 14px;
  }

  .uc-features-slider .t-slds__container {
    width: 375px !important;
  }

  .uc-features-slider .t-slds__items-wrapper {
    height: 790px !important;
  }
  
  #carousel_672836226 {
    transform: matrix(1, 0, 0, 1, -410, 0);
  }
  

  .div_container_profil{
    width: 93% !important;
    margin-left: -13.5px !important;
    margin-top: 20px !important;
  }

  .btn_rejoindre{
    width: 87% !important;
    font-size: 17px !important;
  }

  .card_gratuit{
    margin-left: 25px;
    margin-right: 0px !important;
  }

  .card_formule{
    width: 300px !important;
  }

  .img-opportunite{
    width: 610px; 
  }

  #rec672877634{
    display: none;
  }

  .transparent-border9 {
    border: 2px solid black;
    color: black;
    font-size: 20px;
    border-radius: 17px;
    background-color: transparent;
    width: 220px !important;
  }

  .div_argent{
    width: 335px !important;
    margin-left: 20px !important;
    margin-bottom: 20px !important;
  }

  .container4{
    width: 390px;
  }
  .col_efface{
    display: none;
  }

  .col_bon{
    margin-top: 0px;
  }

  .col-9 h4{
    font-size: 20px;
  }

  .container_etape{
    width: 330px !important;
  }

  .col_com{
    width: 65% !important;
    margin-bottom: 20px;
  }

  .container_com{
    width: 315px !important;
  }

  .t142__wraptwo {
    text-align: center !important;
  }

  #rec673004330 .t030__title{
    text-align: center;
  }

  .uc-leaders-title .t-col {
     padding-left: 0px !important;
    padding-right: 20px;
  }

  .a_header{
    color: #7c91f3;
  }

  #form-newsletter .row .col-md-8 .custom-input {
    font-size: 0.9em !important;
    height: 32px !important;
    width: 80% !important;
  }

  .col-md-4 .btn_abonne {
    font-size: 1em !important;
    padding: 10px 0px !important;
    margin-left: 0px;
    width: 100% !important;
    margin-top: 20px;
  }
  
  .col_osteodispo{
    text-align: center;
  }

  .navbar-brand img {
    width: 55px;
  }

  .nos_container{
    width: 570px !important;
  }
  .fluid-footer{
    width: 390px !important;
  }

  .row_connectons{
    margin-left: 8px;
  }

  .container1 {
    width: 95% !important;
  }

  .container2 {
    width: 95% !important;
  }

  .container3 {
    width: 95% !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px)
{
  .img-opportunite{
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1280px)
{
  .content ul {
    width: 435px;
  }

  .sidebar {
    width: 240px !important;
  }
  .container {
    max-width: 780px;
  }

  .transparent-border4 {
    width: 30% !important;
    margin-left: 675px !important;
  }

  .li_avant {
    width: 815px;
  }

  .img-bon-osteo {
    width: 665px;
    border-radius: 15px;
    border: 2px solid #798BFD;
  }

  .h2_def{
    margin-bottom: 5px;
    font-size: 27px;
  }

  .p_def{
    font-size: 20px;
    margin-bottom: 25px;
  }
  
  .img-velo-osteo {
    width: 300px !important;
  }

  .img-calendier-osteo {
    width: 350px !important;
  }

  .col_cncentre_2{
    flex: 0 0 57% !important;
  }
  .nos_container{
    width: 950px;
    margin-bottom: 30px;
  }

  .img-securite{
    width: 180px;
  }

  .container_patients{
    width: 950px;
  }

  .img-opportunite{
    width: 980px;
  }

  .img_type{
    height: 310px;
    margin-top: 15px;
    margin-left: 80px;
  }

  .img_type_2{
    height: 303px;
    margin-top: 15px;
    margin-left: 22px;
  }

  .img_type_3 {
    height: 289px;
    margin-top: 15px;
    margin-left: 27px;
  }

  .col_bon{
    flex: 0 0 66% !important;
  }

  .col_com{
    flex: 0 0 23.5% !important;
  }

  .faq-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 915px;
    margin: auto;
  }

  .faq-column {
      flex: 1;
      min-width: 300px;
  }

  .faq-item {
      border-bottom: 2px solid black;
      padding: 10px 15px;
      cursor: pointer;
  }

  .faq-question {
      font-size: 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
  }

  .faq-answer {
      display: none;
      padding-top: 10px;
      color: #555;
  }

  .toggle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    background-color: #798BFD;
    width: 30px;
    text-align: center;
    border-radius: 15px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 19px;
    font-size: 18px;
    border-radius: 25px;
  }
}

@media only screen and (min-width: 1281px) and (max-width: 1600px) 
{
  .containerTaille {
    width: 1250px !important;
  }

  .tn-elem__6728776341701016550217{
    width: 1360px !important;
  }

  .img-opportunite{
    width: 1290px;
  }

  .col_bon{
    flex: 0 0 73% !important;
    max-width: 73% !important;
  }

  .nos_container{
    width: 1250px;
    margin-bottom: 30px;
  }

  .col-perso-osto{
    flex: 0 0 50%;
    max-width: 50%;
  }

  .btn_accueil_osteo {
    width: 60%;
    font-size: 1.2em;
    background-color: #9ADAD5;
    border-radius: 15px;
  }

  .img_type{
    height: 310px;
    margin-top: 15px;
    margin-left: 80px;
  }

  .img_type_2{
    height: 303px;
    margin-top: 15px;
    margin-left: 22px;
  }

  .img_type_3 {
    height: 289px;
    margin-top: 15px;
    margin-left: 27px;
  }

  .h1_titre_osteo{
    margin-top: 20px;
  }

  .container_etape{
    width: 70% !important;
  }

  .transparent-border10 {
    width: 100px;
    margin-left: -25px;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .transparent-border {
    width: 25%;
    margin-top: 30px;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
    margin-bottom: 20px;
  }

  .transparent-border4 {
    width: 25%;
    margin-left: 435px;
    margin-top: -30px;
    background-color: #FAF0F5;
    padding: 10px 20px;
    border: 2px solid #385591;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .video_osteo {
    width: 580px;
    height: 325px;
  }

  .video-frame {
    width: 580px;
    height: 325px;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333;
    position: relative;
    overflow: hidden;
  }

    .btn-inscription{
    background-color: #798BFD;
    color: white;
    margin-top: 20px;
    margin-bottom: 25px;
    font-size: 22px;
    padding: 7px 40px;
    border-radius: 20px;
  }

  .container_texte {
    position: relative;
    background: url(https://osteodispo.fr/assets/img/commercial/LOGO_OD.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 1134px;
    margin-top: 65px !important;
    background-size: 25%;
    z-index: 0;
    overflow: hidden;
  }

  .scroll_texte1 {
    height: 380px;
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    overflow-y: scroll;
    font-size: 20px;
  }

  .demo_button {
    font-size: 18px;
    color: #7c91f3;
    border: 1px solid #7c91f3;
    margin-top: 40px;
    border-radius: 20px;
  }

  .flex-container {
    display: flex;
    justify-content: space-between; /* Répartit les éléments sur la ligne */
    align-items: center; /* Centre les éléments verticalement */
    gap: 20px; /* Espacement entre les mots */
    flex-wrap: wrap; /* Permet le retour à la ligne si nécessaire */
    border: 2px solid lightgray;
    padding: 10px 7px;
    border-radius: 15px;
  }

  .flex-item {
      font-size: 18px;
      font-weight: bold;
      text-transform: uppercase; /* Met en majuscules */
  }

  .container-osteo{
    width: 1130px;
  }

  .container_marche{
    width: 820px;
    margin-bottom: 30px;
  }

  .container_fonction{
    width: 1134px;
  }

  .img-bon-osteo {
    width: 500px;
    border-radius: 15px;
    border: 2px solid #798BFD;
  }

  .container_patients{
    width: 1075px !important;
  }

  .li_avant {
    width: 600px !important;
  }

  .h2_def{
    margin-bottom: 5px;
  }

  .p_def{
    font-size: 23px;
    margin-bottom: 25px;
  }

  .faq-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 1175px;
    margin: auto;
  }

  .faq-column {
      flex: 1;
      min-width: 300px;
  }

  .faq-item {
      border-bottom: 2px solid black;
      padding: 10px 15px;
      cursor: pointer;
  }

  .faq-question {
      font-size: 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
  }

  .faq-answer {
      display: none;
      padding-top: 10px;
      color: #555;
  }

  .toggle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    background-color: #798BFD;
    width: 30px;
    text-align: center;
    border-radius: 15px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 20px; 
    border-radius: 25px;
  }
}

.scroll_texte1::-webkit-scrollbar-thumb {
  background-color: #7c91f3;
  border-radius: 5px;
}

.scroll_texte1::-webkit-scrollbar {
  width: 12px;
  height: 15px;
}

@media only screen and (min-width: 1601px) and (max-width: 1920px) 
{
  .img-opportunite{
    width: 1600px;
  }

  #carousel_672836226 {
    transform: matrix(1, 0, 0, 1, -940, 0);
  }

  .nos_container{
    width: 1465px;
    margin-bottom: 30px;
  }

  .div_connectons{
    width: 710px !important;
  }

  .btn-inscription{
    background-color: #798BFD;
    color: white;
    margin-top: 20px;
    margin-bottom: 25px;
    font-size: 22px;
    padding: 7px 40px;
    border-radius: 20px;
  }

  .container_texte {
    position: relative;
    background: url(https://osteodispo.fr/assets/img/commercial/LOGO_OD.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 1134px;
    margin-top: 65px !important;
    background-size: 25%;
    z-index: 0;
    overflow: hidden;
  }

  .scroll_texte1 {
    height: 380px;
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    overflow-y: scroll;
    font-size: 20px;
  }

  .demo_button {
    font-size: 18px;
    color: #7c91f3;
    border: 1px solid #7c91f3;
    margin-top: 40px;
    border-radius: 20px;
  }

  .flex-container {
    display: flex;
    justify-content: space-between; /* Répartit les éléments sur la ligne */
    align-items: center; /* Centre les éléments verticalement */
    gap: 20px; /* Espacement entre les mots */
    flex-wrap: wrap; /* Permet le retour à la ligne si nécessaire */
    border: 2px solid lightgray;
    padding: 10px 7px;
    border-radius: 15px;
  }

  .flex-item {
      font-size: 18px;
      font-weight: bold;
      text-transform: uppercase; /* Met en majuscules */
  }

  .container-osteo{
    width: 1130px;
  }

  .container_marche{
    width: 820px;
    margin-bottom: 30px;
  }

  .container_fonction{
    width: 1300px;
  }

  .container {
    max-width: 1300px !important;
  }

  .img-bon-osteo {
    width: 620px;
    border-radius: 15px;
    border: 2px solid #798BFD;
  }

  .h2_def{
    margin-bottom: 5px;
  }

  .p_def{
    font-size: 23px;
    margin-bottom: 25px;
  }

  .faq-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 1300px;
    margin: auto;
  }

  .faq-column {
      flex: 1;
      min-width: 300px;
  }

  .faq-item {
      border-bottom: 2px solid black;
      padding: 10px 15px;
      cursor: pointer;
  }

  .faq-question {
      font-size: 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
  }

  .faq-answer {
      display: none;
      padding-top: 10px;
      color: #555;
  }

  .toggle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    background-color: #798BFD;
    width: 30px;
    text-align: center;
    border-radius: 15px;
  }

  .container_patients{
    width: 1325px !important;
  }

  .h3_header{
    text-align: left;
    margin-top: 20px;
    color: #2C3454;
    text-align: center;
  }

  .h4_header{
    text-align: left;
    margin-top: 10px;
    text-align: center;
    color: #2C3454;
    font-size: 20px;
  }

  .col-perso-osto{
    flex: 0 0 50%;
    max-width: 50%;
  }

  .btn_accueil_osteo {
    width: 60%;
    font-size: 1.2em;
    background-color: #9ADAD5;
    border-radius: 15px;
  }

  .img_type{
    height: 310px;
    margin-top: 15px;
    margin-left: 80px;
  }

  .img_type_2{
    height: 303px;
    margin-top: 15px;
    margin-left: 22px;
  }

  .img_type_3 {
    height: 289px;
    margin-top: 15px;
    margin-left: 27px;
  }

  .h1_titre_osteo{
    margin-top: 20px;
  }

  .container_etape{
    width: 50% !important;
  }

  .transparent-border10 {
    width: 100px;
    margin-left: -25px;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .transparent-border {
    width: 25%;
    margin-top: 30px;
    background-color: transparent;
    padding: 10px 20px;
    border: 2px solid #FFAE9D;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
    margin-bottom: 20px;
  }

  .transparent-border4 {
    width: 25%;
    margin-left: 465px;
    margin-top: -30px;
    background-color: #FAF0F5;
    padding: 10px 20px;
    border: 2px solid #385591;
    border-radius: 20px;
    color: black;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .video_osteo {
    width: 580px;
    height: 325px;
  }

  .video-frame {
    width: 580px;
    height: 325px;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 20px; 
    border-radius: 25px;
  }

  .container_produ {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
  }

  .card_propu {
      background: white;
      border-radius: 10px;
      padding: 20px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      text-align: left;
      transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      width: 300px;
      max-width: 100%;
  }

  .card_propu:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  }

  .card_propu h3 {
      font-size: 20px;
      color: #798BFD;
      margin-bottom: 10px;
  }

  .card_propu ul {
      list-style: none;
      padding: 0;
  }

  .card_propu ul li {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 17px;
      color: black;
      margin-bottom: 6px;
  }

  .btn_marche{
    color: #798BFD;
    font-size: 35px;
    margin-bottom: 30px;
    text-decoration: none;
    border: 1px solid #798BFD;
    padding: 10px 25px;
    border-radius: 30px;
  }

  .table-columns-wrapper {
    display: flex;
    justify-content: center;
    gap: 55px;
    flex-wrap: wrap;
  }
  
  .table-column {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 425px;
    background-color: white;
  }

  .table-column_2 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
  }

  .table-column_3 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
  }
  
  .table-header {
    font-weight: bold;
    text-align: center;
    padding: 10px 0;
    border-bottom: 2px solid lightgray;
    margin-bottom: 10px;
  }
  
  .table-cell {
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    font-size: 16px;
  }
  
  .table-cell:last-child {
    border-bottom: none;
  }
  
  .red-cross {
    color: #FFAE9D;
  }
  
  .empty {
    height: 23px;
    background-color: transparent;
    border-bottom: 2px solid lightgray;
  }
  
  .container_fonction {
    display: flex;
  }
  /* Colonne gauche */
  .sidebar {
    display: flex;
    flex-direction: column;
    width: 315px;
    border-right: 2px solid #e0e0e0;
    padding-right: 15px;
  }

  .sidebar button {
    background: none;
    border: 1px solid #d0d0ff;
    border-radius: 8px;
    padding: 15px 15px;
    font-size: 18px;
    text-align: left;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    color: #798BFD;
    transition: 0.3s;
  }

  .sidebar button.active {
    background-image: linear-gradient(90deg, #579ffa, #635cff) !important;
    color: white;
    font-size: 18px;
  }

  /* Contenu principal */
  .content {
    flex: 1;
    padding-left: 20px;
    display: none;
  }

  .content h2 {
    color: #4a4acf;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .content p {
    font-size: 20px;
    color: black;
    font-weight: 400;
    line-height: 1.6;
    margin-left: 40px;
  }

  .content li {
    color: black;
    font-weight: 400;
    font-size: 20px;
  }

  .content ul {
    margin-left: 40px;
  }

  #rec673010886 .t396__artboard {
    height: 520px !important;
  }

}
  
@media only screen and (min-width: 1921px) {
  .containerTaille {
    width: 1890px !important;
  }

  #carousel_672836226 {
    transform: matrix(1, 0, 0, 1, -940, 0);
  }

  #rec673010886 .t396__artboard {
    height: 520px !important;
  }

  .p_securite{
    font-size: 23px;
    color: black;
    font-weight: 400;
  }

  .btn-inscription{
    background-color: #798BFD;
    color: white;
    margin-top: 20px;
    margin-bottom: 25px;
    font-size: 22px;
    padding: 7px 40px;
    border-radius: 20px;
  }

  .container_texte {
    position: relative;
    background: url(https://osteodispo.fr/assets/img/commercial/LOGO_OD.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 1450px;
    margin-top: 65px !important;
    background-size: 25%;
    z-index: 0;
    overflow: hidden;
  }

  .scroll_texte1 {
    height: 380px;
    position: relative;
    background: rgba(255, 255, 255, 0.8);
    overflow-y: scroll;
    font-size: 20px;
  }

  .demo_button {
    font-size: 18px;
    color: #7c91f3;
    border: 1px solid #7c91f3;
    margin-top: 40px;
    border-radius: 20px;
  }

  .flex-container {
    display: flex;
    justify-content: space-between; /* Répartit les éléments sur la ligne */
    align-items: center; /* Centre les éléments verticalement */
    gap: 20px; /* Espacement entre les mots */
    flex-wrap: wrap; /* Permet le retour à la ligne si nécessaire */
    border: 2px solid lightgray;
    padding: 10px 7px;
    border-radius: 15px;
  }

  .flex-item {
      font-size: 18px;
      font-weight: bold;
      text-transform: uppercase; /* Met en majuscules */
  }

  .container-osteo{
    width: 1130px;
  }

  .container_marche{
    width: 820px;
    margin-bottom: 30px;
  }

  .container_fonction{
    width: 1450px;
    max-width: 1450px;
  }

  .h3_header{
    text-align: left;
    margin-top: 20px;
    margin-left: 200px;
    color: black;
  }

  .h4_header{
    text-align: left;
    margin-top: 10px;
    margin-left: 200px;
    padding-right: 200px;
    color: black;
  }

  .video-frame2 {
    margin: auto;
    width: 700px !important;
    height: 400px !important;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333;
    position: relative;
    overflow: hidden;
  }

  .iframe_video_2{
    width: 701px !important;
    height: 401px !important;
  }

  .container_details_2{
    width: 1737px; 
    margin-top: 20px;
  }

  .container_produ {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
  }

  .card_propu {
      background: white;
      border-radius: 10px;
      padding: 20px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      text-align: left;
      transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      width: 300px;
      max-width: 100%;
  }

  .card_propu:hover {
      transform: translateY(-5px);
      box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  }

  .card_propu h3 {
      font-size: 20px;
      color: #798BFD;
      margin-bottom: 10px;
  }

  .card_propu ul {
      list-style: none;
      padding: 0;
  }

  .card_propu ul li {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 17px;
      color: black;
      margin-bottom: 6px;
  }

  .btn-test{
    background-color: #798BFD; 
    color: white;
    padding: 10px 45px; 
    font-size: 20px; 
    border-radius: 25px;
  }

  .fond_osteo .nos_container{
      width: 1650px;
      margin-bottom: 50px;
  }

  .img-opportunite{
    width: 1400px;
    margin-bottom: 30px;
  }

  section .nos_container{
    width: 1890px;
    margin-bottom: 50px;
  }

  .h2_def{
    margin-bottom: 5px;
  }

  .p_def{
    font-size: 23px;
    margin-bottom: 25px;
  }

  .faq-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    max-width: 1300px;
    margin: auto;
  }

  .faq-column {
      flex: 1;
      min-width: 300px;
  }

  .faq-item {
      border-bottom: 2px solid black;
      padding: 10px 15px;
      cursor: pointer;
  }

  .faq-question {
      font-size: 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: bold;
  }

  .faq-answer {
      display: none;
      padding-top: 10px;
      color: #555;
  }

  .toggle {
    font-size: 20px;
    font-weight: bold;
    color: white;
    background-color: #798BFD;
    width: 30px;
    text-align: center;
    border-radius: 15px;
  }

  .container_youtube{
    width: 1890px !important;
  }

  .video_osteo{
    width: 580px;
    height: 325px;
  }

  .video-frame {
    margin-left: -25px;
    width: 580px;
    height: 325px;
    background: #000;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border: 10px solid #333; /* Épaisseur du bord du cadre */
    position: relative;
    overflow: hidden;
    margin: 0 auto;
  }

  .img-bon-osteo {
    width: 680px;
    border-radius: 15px;
    border: 2px solid #798BFD;
  }

  .container_patients{
    width: 1400px !important;
  }

  .statistique {
    width: 1400px;
  }

  .transparent-border6 {
    background-color: #9ADAD5;
    padding: 10px 33px;
    border: 2px solid #9ADAD5;
    border-radius: 20px;
    color: #385591;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
    margin-top: 15px;
    margin-bottom: 40px;;
  }

  .col-perso-osto{
    flex: 0 0 48%;
    max-width: 48%;
  }

  .ninja_osteo {
    width: 650px;
    margin: 0 auto;
  }

  .btn_accueil_osteo{
    width:457px; 
    font-size: 1.2em; 
    background-color:#9ADAD5; 
    border-radius: 15px; 
  }

  .transparent-border10 {
    width: 100px;
    margin-top: 30px;
    background-color: #CCECE9;
    padding: 10px 20px;
    border: 2px solid #CCECE9;
    border-radius: 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .img_type{
    height: 310px;
    margin-top: 15px;
    margin-left: 80px;
  }

  .img_type_2{
    height: 303px;
    margin-top: 15px;
    margin-left: 22px;
  }

  .img_type_3 {
    height: 289px;
    margin-top: 15px;
    margin-left: 27px;
  }

  .container_obtenir{
    width: 1890px !important;
  }

  .img-chiffre2-osteo{
    width: 45px;
    margin-bottom: 20px;
  }

  .container_etape{
    width: 1400px !important;
  }

  .fluid-footer{
    width: 1890px !important;
  }

  .custom-col {
    flex: 0 0 20.5% !important;
    max-width: 22.5% !important;
  }

  .col_footer_osteo{
    flex: 0 0 61% !important;
  }

  .custom-input{
    width: 93% !important;
    height: 31px !important;
  }

  .carousel {
    position: relative;
    background: #f9f0f7;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
    width: 650px;
    margin: auto;
  }

  .container-fluid .transparent-border6{
    width: 94% !important;
  }

  .btn_marche{
    color: #798BFD;
    font-size: 35px;
    margin-bottom: 30px;
    text-decoration: none;
    border: 1px solid #798BFD;
    padding: 10px 25px;
    border-radius: 30px;
  }

  .table-columns-wrapper {
    display: flex;
    justify-content: center;
    gap: 55px;
    flex-wrap: wrap;
  }
  
  .table-column {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 425px;
    background-color: white;
  }

  .table-column_2 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
  }

  .table-column_3 {
    border: 1px solid lightgray;
    border-radius: 8px;
    padding: 10px 20px;
    width: 150px;
    background-color: white;
    text-align: center;
  }
  
  .table-header {
    font-weight: bold;
    text-align: center;
    padding: 10px 0;
    border-bottom: 2px solid lightgray;
    margin-bottom: 10px;
  }
  
  .table-cell {
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    font-size: 16px;
  }
  
  .table-cell:last-child {
    border-bottom: none;
  }
  
  .red-cross {
    color: #FFAE9D;
  }
  
  .empty {
    height: 23px;
    background-color: transparent;
    border-bottom: 2px solid lightgray;
  }

  .container_fonction {
    display: flex;
  }

  /* Colonne gauche */
  .sidebar {
    display: flex;
    flex-direction: column;
    width: 315px;
    border-right: 2px solid #e0e0e0;
    padding-right: 15px;
  }

  .sidebar button {
    background: none;
    border: 1px solid #d0d0ff;
    border-radius: 8px;
    padding: 15px 15px;
    font-size: 18px;
    text-align: left;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    color: #798BFD;
    transition: 0.3s;
  }

  .sidebar button.active {
    background-image: linear-gradient(90deg, #579ffa, #635cff) !important;
    color: white;
    font-size: 18px;
  }

  /* Contenu principal */
  .content {
    flex: 1;
    padding-left: 20px;
    display: none;
  }

  .content h2 {
    color: #4a4acf;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .content p {
    font-size: 20px;
    color: black;
    font-weight: 400;
    line-height: 1.6;
    margin-left: 40px;
  }

  .content li {
    color: black;
    font-weight: 400;
    font-size: 20px;
  }

  .content ul {
    margin-left: 40px;
  }
}

.transparent-border6:hover {
  background-color: white;
  border: 2px solid #9ADAD5;
}

.transparent-border9:hover{
  background-color: black; /* Couleur de contour */
  color: white; 
}

.btn-inscription:hover{
  background-color: white;
  border: 1px solid #798BFD;
  color: #798BFD;
}

.demo_button:hover{
  color: white;
  background-color: #7c91f3;
  transform: translateY(-5px);
  transition: 0.3s ease;
}

.container {
  background: white;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  padding: 20px;
  margin-top: 30px;
  margin-bottom: 30px;
}

.sidebar button:hover {
  background: #e0e0ff;
}

.sidebar button img {
  width: 20px;
  height: 20px;
}

.content.active {
  display: block;
}

.content ul li {
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.content ul li img {
  width: 18px;
  height: 18px;
}

/* Bouton CTA */
.cta {
  margin-top: 20px;
  text-align: center;
}

.cta a {
  text-decoration: none;
  border: 1px solid #4a4acf;
  color: #4a4acf;
  padding: 10px 15px;
  border-radius: 8px;
  font-size: 14px;
  transition: 0.3s;
}

.cta a:hover {
  background: #4a4acf;
  color: white;
}

.sidebar-footer {
  margin-top: auto;
  text-align: center;
  padding: 15px;
}

.btn-test:hover{
  border: 1px solid #798BFD;
  background-color: white; 
  color: #798BFD;
}

.fond_acces {
  width: 100%;
  height: 100%;
  background-color: white;
  background-color: #FAF0F5;
  background-size: cover;
  overflow-y: scroll;
}

.container_question {
  width: 100%;
  background-color: #ECEDEA;
  padding-top: 20px;
  padding-bottom: 150px;
}

.btn_marche:hover{
  color: white;
  background-color:#798BFD;
}