html{
    background-attachment: fixed;
    z-index: -1;
  }
  
  *{
    padding: 0;
    margin: 0;
    text-decoration: none;
    z-index: -1;
  }
  
  #navbar{
    z-index: 1;
    background: #EEEEEE;
    position: fixed;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
  }
  
  #logo{
    height: 100%;
    margin-left: 10px;
  }
  
  #sezioni{
    font-family: 'Comfortaa', cursive;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 2%;
    font-size: 2em;
  }
  
  .sezione{
    width: 180px;
    height: 40%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #b3535f;
  }
  
  .sezione:hover{
    color:#769293;
  }
  
  #iconmenu{
    width: 30px;
    cursor: pointer;
    margin-right: 10px;
    display: none;
  }
  
  #galleria{
      width: 30%;
      margin: 0 auto;
  }
  
  .immagine{
      display: inline-block;
      width: 14%;
      margin: 4%;
  }
  
  #icon{
    width: 10%;
    margin: 8% 4%;
  }
  
  .galleria{
    width: 40%;
    margin: 0 auto;
  }
  
  @media only screen and (max-width: 960px){
  
    html{
      background-attachment: fixed;
      height: 100%;
    }
  
    #iconmenu{
      height: 40%;
      display: block;
      margin: 0;
    }
  
    .sezione{
      display: none;
    }
  
    #testo_footer{
      margin: 0 auto;
      text-align: center;
      width: 50%;
      font-size: 12px;
    }
  
    header{
      margin: 0%;
      padding: 0%;
      text-align: center;
      height: 100%;
      width: 100%;
      z-index: -1;
    }
  
    .galleria{
      width: 60%;
      margin: 0 auto;
    }
  
    .mobile_navbar{
      z-index: 0;
      width: 0%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: all 0.5s ease-in-out;
      background-color: #EEEEEE;
    }
  
    #logo_menu{
      margin: 6% auto 0 auto;
      text-align: center;
      width: 50%;
      display: block;
    }
  
    #footer{
      background: #EEEEEE;
      margin-top: 3%;
      padding: 0px;
    }
  
    #logocompleto{
      padding-top: 5%;
      display: table-cell;
       align-items: center;
      justify-content: center;
      width: 50%;
      margin: 5% auto;
      text-align: center;
    }
  
  
    #testo_footer{
      margin: 5% auto 5% auto;
      text-align: center;
      width: 60%;
      padding-bottom: 3%;
    }
    }
  
    #social_footer{
      width: 16%;
      margin: 2%;
    }
  
  #logo{
    height: 50%;
    margin-left: 2%;
  }
  
  .mobile_navbar{
    position: fixed;
    z-index: 0;
    width: 0%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    background-color: #EEEEEE;
  }
  
  #sezioni_mobile{
    font-family: 'Comfortaa', cursive;
    background-color: #EEEEEE;
    /* display:block= un div sotto l'altro ---- display:flex= uno affianco all'altro */
    display: block;
    font-size: 22px;
    justify-content: center;
    margin-top: 16%;
    margin-bottom: 2%;
    align-items: center;
    overflow: hidden;
  }
  
  .sezione_mobile{
    z-index: 999;
    width: 200px;
    height: 100px;
    display: flex;
    margin: 0 auto;
    text-align: center;
    justify-content: center;
    align-items: center;
    color: #b3535f;
  }
  
  .sezione_mobile:hover{
    margin-top: auto;
    background-color: #d2d7ce;
  }
  
  #corrente_mobile{
    box-shadow: 0 6px 0 #22799a;
    background-color: #efeae4;
    border-radius: 8px;
  }
  
  
  /* footer */
  #footer{
    background: #EEEEEE;
      margin-top: 3%;
      padding: 0px;
  }


 #logocompleto{
      padding-top: 5%;
      display: table-cell;
       align-items: center;
      justify-content: center;
      width: 50%;
      margin: 5% auto;
      text-align: center;
    }
  
  
    #testo_footer{
      margin: 5% auto 5% auto;
      text-align: center;
      width: 60%;
      padding-bottom: 3%;
    }