

.container_first{
  width: 95%;
  margin: 0 auto;
  display: flex;
  gap:4%;
  padding: 4% 2% 4% 2%;
  align-items: stretch;

}


.in_first{
  width: 50%;
  display: flex;
  flex-direction: column;
  flex: 1; 
}
.bot_left, .bot2_left{
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  min-height: 0;
}
.is_justify{
  text-align: justify;
  text-align-last: justify;
}


@media (max-width: 600px) { 
  .in_first{
    width: 100%;
  }
  #first1{
    flex-direction: column;
    height: auto;
  }
  .container_first{
    flex-direction: column;
    height: auto;
  }
  .bot2_left, .bot_left{
    height: 200px;
    width: 100%;
    margin: 0 auto;
    margin-top: 4%!important;
  }
  #first2{
    flex-direction: column-reverse;
  }
}
@media (max-width: 500px) { 
  .bot_left{
    height: 200px;
  }
  .beige_blanc{
    background-color: #f8f5ec;
  }
  .container_first{
    padding: 8% 2% 4% 2%;
    margin-top: 10%!important;
  }
}









/* */
.container_propos{
  padding: 2%;
  width: 96%;
  margin: 0 auto;
}
.text_propos{
  width: 80%;
  margin: 0 auto;
}
#last_propos{

  margin-top: 0;
}
.intro_propos{
  padding: 4%;
  padding-bottom: 3%;
  padding-top: 0;
}
.grid_testi{
  justify-content: start;
}
@media (max-width: 850px) { 
  .text_propos{
    width: 100%;
  }
}

@media (max-width: 500px) { 
  .intro_propos{
    padding: 2%;
  }
  .text_propos{
    width: 100%;
  }
}



































/* */
#under{
  width: 90%;
  margin: 0 auto;
  display: flex;
  margin-top: 10%;
  position: relative;
}
#chiffre{
  display: flex;
  width: 100%;
}
.chiffing{
  width: 33.33%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
}
@media (max-width: 900px) { 
  #under{
    margin-top: 5%!important;
  }
}





.container_about{
  width: 95%;
  margin:  0 auto;
  display: flex;
  height: clamp(500px, 75vh, 800px);
  gap:2%;
  padding: 2% 2% 2% 2%;
}
.left_about{
  width: 50%;
}
.right_about{
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.in_right_about{
  padding: 5% 2%;
  width: 100%;
}
.center_item{
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.in_about{
  width: 90%;
  height: 90%;
}
.bulle{
  position: absolute;
  width: auto;
  padding: 2% 5%;
  aspect-ratio:  2 / 1;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
#bulle1{
  top:0;
  left:0;
}
#bulle2{
  bottom:0;
  right:0;
}

#bulle3{
  top:20%;
  left:0;
}
#bulle4{
  top:60%;
  left:0;
}
#in_about_mid{
  padding: 0% 0% 0% 10%;
}


@media (max-width: 768px) { 
  .bot_left, .bot2_left {
    height: 60vh;
    min-height: 300px;
  }
}
@media (max-width: 600px) { 
  .container_about{
    flex-direction: column;
    height: auto;
    padding: 4% 2% 8% 2%;
  }
  .about_reverse{
    flex-direction: column-reverse;
  }
  .right_about{
    width: 100%;
  }
  .left_about{
    width: 100%;
    height: 200px;
    height: 60vh;
    min-height: 300px;
  }
  .in_about{
    width: 90%;
    margin: 0 auto;
    height: 100%;
  }
  #in_about_mid{
    padding: 0%;
  }
  .in_right_about{
    margin-top: 4%;
  }
}
@media (max-width: 500px) { 
  .in_right_about{
    padding: 0;
  }
}













