/*...BACKGROUND...*/
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Montserrat&display=swap');

/*...HEADER...*/
#sopra-nav {
    display:flex;
    flex-direction: row;
    justify-content: center;
     position:sticky;
     margin-top: -10px;
     margin-bottom:-20px;
     align-items: flex-end;
     
   }
img#logo {
    border-radius:50%;
    width:60px;
    padding: 30px;
margin-right: 10px; 
margin-left:-30px;
margin-bottom:10px;   
}

h1#titolo-principale {
  margin-left:-20px;
  font-size:40px;
  padding:20px;
  font-family: 'DM Serif Display', serif;
  font-family: 'Montserrat', sans-serif;
  color:#69CDF2;
  text-shadow: -1px 1px 0 #000, 
                1px 1px 0 #000, 
                1px -1px 0 #000, 
               -1px -1px 0 #000; 
}


img.simboli{
width:20px;
height:20px;
padding:20px;
margin-bottom:10px;
}
p.varie {
    padding:10px;
    font-family: 'DM Serif Display', serif;
font-family: 'Montserrat', sans-serif;
align-items: baseline;
}
/*...NAVBAR...*/

div#contenitore-navbar{
margin-top:30px;
display:flex;
flex-direction: row;
justify-content: space-evenly;
background-color: rgb(21, 33, 33);
padding:30px;
}
a.item{
  text-decoration: solid;
  color:white;
  font-family: 'DM Serif Display', serif;
font-family: 'Montserrat', sans-serif;

}
a:hover{
  color:cadetblue;
}

img.social{
  width: 20px;
  border:1px solid white;
  margin-right: 10px;
  margin-top:-25px;

}
/*...SFONDO...*/
div#sfondo{
  background-color: #b5b7b9f7;
 
}
img#tenda{
  width:100%;
  height:600px;
  
  
 }

 /*...FOOTER...*/
 div.contenitore{
background-color:#0F201F;
display:flex;
flex-direction: column;
align-items: center;
margin-top:-5px;
}
p#indirizzo, p#numero, p#dove, p#mail, p#piva{
  color:white;
  font-size:13px;
  font-weight: bold;
  font-family: 'DM Serif Display', serif;
  font-family: 'Montserrat', sans-serif;
  margin:4px;
}

p#mail{
  margin-bottom:10px;
}
p#copy{
  color:white;
  font-size: 10px;
  text-align: end;
}
/*...MEDIA QUERIES...*/
@media screen and (max-width: 768px) {
  header#sopra-nav{
    display:flex;
    flex-direction: column;
    }
  img#logo{
    width:150px;
    margin-right:3.75em;
  }
  h1#titolo-principale{
    font-size: 20px;
    text-align: center;
    margin-right:10px;
    margin-top:-20px;
  }
  img.simboli{
    margin-right:140px;
    margin-bottom:-40px;
   }
   p#ora{
    margin-right:70px;
    margin-bottom:-20px;
   }
   p#number{
    margin-right:110px;
    margin-bottom:-20px;
   }
   p#primo{
    margin-right:130px;
    margin-bottom:-20px;
   }
   p#trenta{
    margin-right:108px;
   }
   div#contenitore-navbar{
    display:flex;
    flex-direction: column;
 
   }
   a.item{
    margin-left:90px;
    font-size: 15px;
    padding:5px;
   
   }
   div#simb-social{
      margin-left:110px;
      margin-top:20px;
      
    }
}