/* LOGOS / PARTENAIRES */
.section-logos {
  display: flex;
  flex-direction: column;
  flex: 1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.section-logos .section-content {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}

.section-logos .section-content h2 {
  margin-bottom: 0px;
}

.section-logos .section-content .section-contenus {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}

.section-logos .section-content .section-contenus h2,
.section-logos .section-content .section-contenus h3,
.section-logos .section-content .section-contenus h4,
.section-logos .section-content .section-contenus h5,
.section-logos .section-content .section-contenus p {
  margin-bottom: 0px;
}

.section-logos .logos {
  row-gap: 40px;
  display: flex;
  flex-direction: column;
}

.section-logos .liste-logos {
  flex-wrap: wrap;
  column-gap: 3%;
  width: 100%;
  row-gap: 30px;
  display: flex;
}

/* Options de largeurs */
.section-logos .colonne-33 .logo {
  width: 31.33%;
}

.section-logos .colonne-25 .logo {
  width: 22.75%;
}

.section-logos .colonne-20 .logo {
  width: 17.6%;
}

.section-logos .colonne-16 .logo {
  width: 14.1%;
}

/* --------------- RESPONSIVE --------------- */

@media screen and (max-width: 1270px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 960px) {
  .section-logos .liste-logos {
    column-gap: 4%;
  }

  .section-logos .colonne-33 .logo {
    width: 48%;
  }

  .section-logos .colonne-25 .logo {
    width: 30.5%;
  }

  .section-logos .colonne-20 .logo {
    width: 22%;
  }

  .section-logos .colonne-16 .logo {
    width: 16.8%;
  }
}

@media screen and (max-width: 820px) {}

@media screen and (max-width: 768px) {
  .section-logos .colonne-25 .logo {
    width: 35%;
  }

  .section-logos .colonne-20 .logo {
    width: 30.5%;
  }

  .section-logos .colonne-16 .logo {
    width: 22%;
  }
}

@media screen and (max-width: 600px) {
  .section-logos .colonne-33 .logo {
    width: 75%;
  }

  .section-logos .colonne-25 .logo {
    width: 48%;
  }

  .section-logos .colonne-20 .logo {
    width: 35%;
  }

  .section-logos .colonne-16 .logo {
    width: 30%;
  }
}

@media screen and (max-width: 450px) {
  .section-logos .colonne-33 .logo {
    width: 100%;
  }

  .section-logos .colonne-25 .logo {
    width: 75%;
  }

  .section-logos .colonne-20 .logo {
    width: 48%;
  }

  .section-logos .colonne-16 .logo {
    width: 35%;
  }
}