/*
Pour petits écrans
*/
@viewport {
  width: device-width;
  zoom: 1.0;
  user-zoom: zoom;
}
@media screen and (max-width: 910px) {
  body {
    background: #ddd;
  }
  header {
    position: relative;
  }
  header h1 {
    font-size: 1.5em;
  }
  main {
    /* position: absolute; */
    background: inherit;
  }
  #content {
    background: inherit;
  }
  .zone-laterale {
    display: block;
    position: relative;
    width: 80%;
    margin: 2em auto 0 auto;
  }
}

@media screen and (max-width: 600px) {
  #content .contenu {
    text-align: left;
  }
  header h1 {
    display: inline-block
  }
  #searchform {
    position: relative;
    top: 0em;
    display: inline-block;
    margin: 0.5em 0 0 1em;
  }
  header h2 {
    display: inline-block
  }
}

@media screen and (max-width: 500px) {
  header h1 {
    position: relative;
    font-size: 1em;
    top: 0; right: 0; left: 0;
    margin-right: 1em;
  }
  header h2 {
    position: relative;    
    top: 0em; right: 0; left: 0;
  }
  main {
    top: 0em;
    padding: 2em 0;
  }
  main #content {
    width: 99%;
    float: none;
    margin: auto;
  }
  aside {
    float: none;
  }
  #searchform {
    top: 0em;
    width: 100%;
    z-index: 10;
  }
  aside {
    width: 90%;
  }
  #content .comments-depose h2 {
    font-size: 1em;
  }
  .encart-droit {
    float: none;
    width: 90%;
    margin-top: 1em;
  }
}


