/* MOBILE*/
#myNav {
  height: 0;
  width: 100%;
  position: fixed; 
  z-index: 10; 
  top: 0; 
  left: 0;
  background-color: #111; 
  overflow-x: hidden;
  transition: 0.5s; 
}
#myNav a {
  padding: 0;
  margin: 0.5em;
  width: 100%;
  text-decoration: none;
  text-align: center;
  color: #818181;
  display: block;
  /*border: 1px solid white;*/
  transition: 0.3s;
}
#myNav a:hover {
  color: #f1f1f1;
}
#myNav .closebtn {
  width: 95%;
  margin-top: 0em;
  text-align: right;
  font-size: 2em;
}
#navbtn {
  float: right;
  top: 0.5em;
  right: 0.5em;
  color: white;
  font-size: 2em; 
}
/* DESKTOP */
@media screen and (orientation: landscape) {
/* schermo orizzontale */
  #navbtn, #myNav .closebtn {
    display: none;
  }
  #myNav {
    height: auto;
    width: 100%; 
    position: static;
    padding: 0 0.5em;
    color: white;
    background-color: royalblue;
    border-top: 2px solid white; 
    border-bottom: 2px solid royalblue; 
  }
  #myNav a {
    display: inline-block;
    color: white;
    background-color: royalblue;
    width: auto;
    padding: 0 0.3em 0 0.3em;
    margin: 0.2em;
    border-right: 2px solid white;
  }
  #myNav a:hover {
    font-weight: bold;
    color: oldlace;
    background-color: royalblue;
  }
}/* schermo orizzontale */