.biographie {
  padding: 3rem 10% 5rem 10%;
  min-height: 900px;
  background-color: #f2f2f2;
}

.biographie h1 {
  font-family: 'Gruppo', cursive;
  text-align: center;
  font-size: 70px;
}

.biographie h2 {
  font-family: 'Roboto', sans-serif;

}

.biographie p, .biographie li {
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  text-align: justify;
}

.biographie h2 {
  font-size: 30px;
  margin-top: 0;
}

body {
  min-width: 400px;
}

.image {
  float: left;
    padding:10px 60px 40px 0;
}

@media only screen and (min-width: 1385px) {
  .conteneur {
    display: flex;
    justify-content: space-between;
  
  }
}

@media only screen and (max-width: 1126px) {
  .image {
    text-align: center;
    float:none;
  }
}

.conteneur-article {
  display: flex;
  justify-content: space-between;
}

.conteneur-article img{
padding: 15px;
}

.biographie img {
	cursor: zoom-in;
}

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

  .conteneur-article {
    justify-content: space-around;
    flex-wrap: wrap;
  }
}

.biographie li {
  font-size: 21px;

}

.biographie li::before {
  content: "- ";
}

.biographie > h2 {
  border-top: 1px solid #9b9b9b;

}

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

  .biographie li, .biographie p{
    font-size: 15px;
  
  }
}

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

  .biographie li{
    font-size: 11px;
  
  }

   .biographie p{
    font-size: 13px;
  
  }

}


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

  .conteneur-article img:nth-child(2) {
    max-width: 296px;
    max-height: 125px;
  }

}