body{
 background-color:gray;
}


#div{
   float:left;
   position:absolute;
   margin-top:2px;
   margin-left:-320px;
   border-style:solid ;
   border-width:2px;
   width:290px;
   height:auto;
   background-color:dimgray;
   animation-duration: 2s;
   animation-fill-mode:forwards;
   box-shadow:3px 3px 3px white;
    

}




@keyframes mostra{
    from{margin-left:-320px;box-shadow:0px 0px 0px white;opacity:0;}
    to{margin-left:0px;box-shadow:5px 5px 3px white;opacity:1.0;}


}

@keyframes nascondi {
    from{margin-left:0px;box-shadow:3px 3px 3px white;opacity:1.0;}
    to{margin-left:-320px;box-shadow:0px 0px 0px white;opacity:0;}


}

#menu:hover {
    background-color: gray;
    color:white;
    
}
#menu:active {
  background-color: dimgray;
  color:white;
  
  box-shadow: 5px 5px #666;
  transform: translateY(4px);
}

#sie{
    opacity:0.2;
    animation-duration:2s;
    animation-fill-mode:forwards;
    
}

@keyframes opacita_in{
    from{opacity:0.2}
    to{opacity:1.0}
    
    
}