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

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

@media screen and (max-width: 600px) {
  #menu {
    width: 100%;
  }
  #menu ul li {
    font-size: 5.5vw;
  }
  #menu #menu-bg {
    background-color: rgba(255, 255, 255, 0.6);
  }
  .header-desktop {
    display: none;
  }
  .header-mobile {
    display: block;
  }
  header h1 a {
    font-size: 16px;
    gap: 10px;
    justify-content: start !important;
  }
  header h1 a p.desktop {
    display: none;
  }
  header h1 a p.mobile {
    display: block;
  }
  header .separation::before {
    width: 32%;
  }
  header .separation::after {
    width: 32%;
  }
  header .separation img {
    width: 33%;
  }
  main h2 {
    font-size: 5vw;
  }
  main h2 span {
    width: 2vw;
  }
  .swiper {
    display: block !important;
  }
  .slider {
    display: none !important;
  }
  footer {
    flex-direction: column;
    height: fit-content;
  }
  footer .conditions {
    width: 100%;
  }
  footer .socialLinks {
    width: 100%;
  }
  .main-aPropos {
    flex-direction: column;
    gap: 20px;
  }
  .main-aPropos .section-aPropos {
    width: 100%;
    margin: 0 auto;
  }
  .main-aPropos .section-aPropos:last-of-type {
    border-left: none;
  }
  .main-demarcheArtistique h3 {
    padding: 0 5vw;
  }
  .section-demarcheArtistique {
    padding: 0 5vw;
  }
  main .section-galerie {
    grid-template-columns: 100%;
  }
  main .introGalerie {
    padding: 20px;
    text-align: center;
  }
  .main-expositions p {
    padding: 20px;
  }
  .main-expositions .section-expositions {
    flex-direction: column;
  }
  .main-expositions .section-expositions img {
    width: 80%;
  }
  .main-prix .section-prix img {
    width: 80%;
  }
}