div#filtri {
  position: absolute;
  z-index:50;
  width: 15%;
  margin-top:2%;
}

nav#filtri li a {text-decoration : none; color : #2d2f31;}
nav#filtri li{ font-size: 10px; }

nav#filtri {
  width : 100%;
  background-color: transparent;
  border-radius: 15px;
  margin-bottom: 1%;
}

nav#filtri span {
  padding : 5px;
  background-color: #FF5000;
  color : #FFF;
  font-size : 1em;
  font-variant : small-caps;
  cursor : pointer;
  display: block;
  border-radius: 15px;
}

@media (max-width: 375px){
  nav#filtri span {
    padding : 5px;
    background-color: #FF5000;
    color : #FFF;
    font-size : 0.6em;
    font-variant : small-caps;
    cursor : pointer;
    display: block;
    border-radius: 15px;
  }

}


@media (max-width: 320px){
  nav#filtri span {
    padding : 5px;
    background-color: #FF5000;
    color : #FFF;
    font-size : 0.6em;
    font-variant : small-caps;
    cursor : pointer;
    display: block;
    border-radius: 15px;
  }

}

nav#filtri .slide span {
  padding : 5px;
  background-color: #FFF;
  color : grey;
  font-size : 0.8em;
  font-variant : small-caps;
  cursor : pointer;
  display: block;
  border-radius: 15px;
  border: 1px solid grey;
  margin-bottom:1%;
}

nav#filtri .slide span::after {
  float: right;
  content: "+";
}

nav#filtri .slide span#touch81::after {
  float: right;
  content: "";
}

nav label {
  width:100%;
}

nav .slide2 label, nav .slide3 label, nav .slide4 label, nav .slide5 label, nav .slide6 label, nav .slide7 label {
  width: 85%;
  float: left;
  line-height: 1.5;
}

nav .slide2 input, nav .slide3 input, nav .slide4 input, nav .slide5 input, nav .slide6 input, nav .slide7 input { line-height: 1.5;}
nav#filtri .slide, nav#filtri .slide2, nav#filtri .slide3, nav#filtri .slide4, nav#filtri .slide5, nav#filtri .slide6, nav#filtri .slide7, nav#filtri .slide8  {

  height:0px;
  overflow: hidden;
  text-align: center;
  transition: height .4s ease;
  background-color: #FFF;
}

ul.slide span{

}

nav#filtri li { list-style-type: none;}

nav#filtri ul {padding: 0px;}

nav#filtri .slide li {padding : 3%}

nav#filtri .slide2 li {padding : 3%;}

nav#filtri input[type="text"]{
  width:100%;
  font-size:1em;
  margin-top: 2%;
}

nav#filtri input[type="submit"]{
  width: 50%;
  margin-left:25%;
  font-size: 1em;
  margin-top: 1%;
}

nav#filtri #touch, nav#filtri #touch2, nav#filtri #touch3, nav#filtri #touch4, nav#filtri #touch5, nav#filtri #touch6, nav#filtri #touch7, nav#filtri #touch8{position: absolute; opacity: 0; height: 0px;}

nav#filtri #touch:checked + .slide {height: 2000px; background-color: transparent;}

 nav#filtri #touch2:checked + .slide2 {
   height: 12%;
   font-size: 0.8em;
   text-align: right;

 }

 nav#filtri #touch3:checked + .slide3 {
   height: 10%;
   font-size: 0.8em;
   text-align: right;
   scroll-x: visible;
 }

 nav#filtri #touch4:checked + .slide4 {
   height: 42%;
   font-size: 0.8em;
   text-align: right;
   scroll-x: visible;
  }

nav#filtri #touch5:checked + .slide5 {
  height: 79%;
  font-size: 0.8em;
  text-align: right;
  scroll-x: visible;
 }

 nav#filtri #touch6:checked + .slide6 {
   height: 10%;
   font-size: 0.8em;
   text-align: right;
   scroll-x: visible;
   }

   nav#filtri #touch7:checked + .slide7{
     height: 10%;
     font-size: 0.8em;
     text-align: right;
   }