Ethica-vitrine/user/themes/ethica/css/media-queries.css

@media only screen and (max-width: 955px) {
    body {
         overflow-y: auto;
    }
    #header{
      width: 100%;
      height: auto;
      padding-top: 0.5rem;
    }
    #logo{
      padding-bottom: 5px;
    }
    .app{
      position: fixed;
      width: 100%;
      height: 30px;
      left: 0;
      bottom: 0;
      background: white;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }
    .app a{
      padding-left: 30px;
      margin: auto 0;
    }
    .fr-en{
      margin-top: 5px;
    }
    .navigation{
      display: none;
    }
    .menu-ui{
      display: block;
      margin-right: 15px;
    }
    #navbar{
      margin-bottom: 5px;
    }
    h1{
      font-size: 1.5rem;
      margin: 0 auto;
    }
    #header .separation{
      position: relative;
      top:0;
      left: 1px;
      width: 100%;
      height: 1px;
    }
    #header .separation::before {
      position: absolute;
      margin: -1.5px 0 0 -2.5px;
    }
    .mCSB_container{
      padding-bottom: 0;
    }
    section .content{
      display: block;
    }
    section{
      left: 0;
      top: 65px;
    }
    section .content > div:not(#recherche-artistique){
      min-width: 100vw;
      -webkit-filter: blur(0);
              filter: blur(0);
      color: black;
      padding: 0 30px;
    }
    section #recherche-artistique{
      display: block;
      min-width: 100vw;
    }
    section #recherche-artistique > div{
      -webkit-filter: blur(0);
              filter: blur(0);
      color: black;
      min-width: 100vw;
      padding: 0 30px;
    }
    section .content img{
      width: 100%;
    }
    video{
      width:100%;
    }
    #lequipe img{
      width: 100%!important;
    }
    #gallery img{
      max-width: 95%;
    }
    #gallery .button{
      right: 2rem;
    }
    .bx-wrapper .bx-controls-direction a{
      top: 0;
      width: 20%;
      height: 100%;
      margin-top: 0;
    }
    .bx-wrapper .bx-prev,
    .bx-wrapper .bx-prev:hover,
    .bx-wrapper .bx-prev:focus{
      left: 5px;
      background-position: left;
    }
    .bx-wrapper .bx-next,
    .bx-wrapper .bx-next:hover,
    .bx-wrapper .bx-next:focus{
      right: 5px;
      background-position:right;
    }
}

@media only screen and (min-width: 955px) {
  .navigation{
    display: block!important;
  }
}