@media screen and (max-width: 800px) {
  section.collection {
    grid-template-columns: repeat(3,1fr);
  }

  section.commande form.adresse div.champs {
    width:100%;
  }


}

@media screen and (max-width: 640px) {
  section.collection {
    grid-template-columns: repeat(2,1fr);
  }

  section.commande form.adresse div.champs {
    width:100%;
  }


}

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

    h1.coupe span{
      font-size:1.2rem;
    }

    nav.principal ul{
      display:block;
    }

    .header_mobile{
      background-color:#f2f2ee;
      padding:2rem;
      display:grid;
      grid-template-columns: 2.5rem auto 2.5rem;
      grid-gap:1.5rem;
    }

    .header_mobile a {
      display:block;
    }

    .header_mobile .burger {
      display:block;
      opacity:0.3;

    }

    .header_mobile img{
      display:block;
      width:100%;
      height:auto;
      cursor:pointer;
    }

    header.haut{
      position: fixed;
      z-index: 1000;
      width: 100vw;
      height: 100vh;
      margin-left:-100vw;
      transition: margin 0.4s;
      overflow-y: auto;
    }

    body.open{
      height:100vh;
      overflow:hidden;
    }

    header.haut div.close{
      display:block;
      height:2rem;
      margin-top:2rem;
      text-align: right;
    }

    header.haut div.close img{
      display:inline-block;
      width:auto;
      height:100%;
      cursor:pointer;
    }

    body.open header.haut{
      margin-left:0;
    }

    header.haut nav.haut {
      justify-content: center;
      flex-wrap: wrap;
    }

    header.haut nav.haut a{
      justify-content: center;
      flex-wrap: wrap;
      margin-bottom:0.5rem;
    }

    nav.principal ul li a {
      width:100%;
    }

    nav.menu_collections ul {
      grid-template-columns:1fr 1fr;
    }


    nav.menu_collections ul li a figure figcaption span{
      font-size:0.85rem;
      padding:0.6rem 0.9rem;
    }


    nav.menu_collections_liste ul{
      width:100%;
    }

    article.papier header{
      flex-wrap: wrap;
    }

    article.papier header div.description{
      width:100%;
      padding-bottom:1rem;
    }

    article.papier header div.bouton{
      width:100%;
      margin-bottom:1rem;
    }

    section.colonne_3 {
      grid-template-columns: 1fr;
    }

    footer.pied>div {
      grid-template-columns: 1fr;
    }

    section.collection {
      grid-template-columns: repeat(2,1fr);
    }

    section.commande article.produit {
      display: grid;
      grid-template-columns: 5rem 1fr 5rem ;
    }

    section.commande article.produit .infos{
      grid-area: 2 / 2 / 3 / 3;
    }

    section.commande article.produit .prix{
      grid-area: 3 / 2 / 4 / 3;
    }

    section.commande div.adresses{
      grid-template-columns:1fr;
    }

    section.connexion {
      grid-template-columns: 1fr;
    }

}

@media screen and (max-width: 500px) {
  div.collection_display {
    grid-template-columns: 7rem 1fr;
  }

  section.collection {
    grid-template-columns: repeat(1,1fr);
  }

}

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

  nav.menu_collections ul {
    grid-template-columns:1fr ;
  }

}