@media all and (max-width: 1200px) {
  #wrapper-noel #content-noel #petites-attentions .produits > div {
    width: 23%;
    text-align: center;
    box-sizing: border-box;
  }
  #wrapper-noel #content-noel .produits, #wrapper-noel #content-noel .content-swiper-noel {
    padding: 0
  }
  #wrapper-noel #menu ul {
    justify-content: center;
    padding: 0
  }
  #wrapper-noel #content-noel #petites-attentions .dp-flex {
    row-gap: 20px;
    column-gap: 15px
  }
  #wrapper-noel .dp-mob2 {
    display: block!important
  }
  #wrapper-noel .dp-mob, #wrapper-noel .dp-desk2 {
    display: none
  }
  #wrapper-noel .swiper img {
    width: 100%;
    height: auto;
    display: block
  }
}
@media all and (max-width: 768px) {
  #wrapper-noel .dp-mob {
    display: flex !important
  }
  #wrapper-noel .dp-desk {
    display: none
  }
  #wrapper-noel .sticky {
    position: relative
  }
  #wrapper-noel nav ul li a:hover, #wrapper-noel nav .active {
    background-color: #fff;
    color: #1E294F
  }
  #wrapper-noel nav {
    padding-top: 0;
    border-bottom: none
  }
  #wrapper-noel #content-noel .fond {
    padding: 10px 0
  }
  #wrapper-noel h1 {
    margin: 20px 0;
    justify-content: center;
  }
  #wrapper-noel #content-noel h2 {
    font-size: 16px
  }
  #wrapper-noel #content-noel h2 + p {
    font-size: 12px
  }
  #wrapper-noel #content-noel #petites-attentions .produits > div {
    width: 48%;
  }
  #wrapper-noel #content-noel #petites-attentions, #wrapper-noel #content-noel #cherche {
    margin-bottom: 20px;
  }
  #wrapper-noel #content-noel .services > div > div {
    width: 50%;
  }
  #wrapper-noel #content-noel #panne .produits {
    row-gap: 20px;
    column-gap: 15px;
    margin-bottom: 20px
  }
  #wrapper-noel #content-noel #panne .produits > div {
    width: 48%;
  }
  #wrapper-noel #content-noel #panne .produits > div:first-child, #wrapper-noel #content-noel #panne .produits > div:last-child {
    width: 100%
  }
}
@media all and (max-width: 576px) {
  #wrapper-noel h1, #wrapper-noel #content-noel .services h2 {
    font-size: 20px
  }
  #wrapper-noel nav ul li a {
    font-size: 13px;
    width: 165px
  }
  #wrapper-noel #content-noel .services a .services-titre {
    font-size: 16px;
    line-height: 20px
  }
  #wrapper-noel #content-noel .services img {
    width: 40%;
    height: auto
  }
  #wrapper-noel #content-noel .produits a, #wrapper-noel #content-noel .content-swiper-noel a, #wrapper-noel #content-noel #cherche .dp-mob2 a, #wrapper-noel #content-noel .produits span, #wrapper-noel #content-noel .content-swiper-noel span, #wrapper-noel #content-noel #cherche .dp-mob2 span {
    font-size: 14px;
    line-height: 18px;
    bottom: 15px
  }
  #wrapper-noel #content-noel #panne .produits > div {
    width: 46%;
  }
}
@media all and (max-width: 480px) {
  #wrapper-noel #content-noel #petites-attentions .produits > div {
    width: 47%;
  }
  #wrapper-noel #content-noel .services a .services-img {
    height: 70px
  }
}