/*...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;
}
/*...LISTINO PREZZI...*/
h2{
    font-family: 'DM Serif Display', serif;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    font-size: 35px;
    }
div#contenitore-tabella-uno, div#contenitore-extra, div#contenitore-tabella-due, div#contenitore-tabella-tre, div#contenitore-tabella-quattro, div#contenitore-tabella-cinque,div#contenitore-tabella-sei,
div#contenitore-tabella-dodici, div#contenitore-tabella-sette, div#contenitore-tabella-otto, div#contenitore-tabella-nove, div#contenitore-tabella-dieci, div#contenitore-tabella-undici {
    display:flex;
    flex-direction:column;
    justify-content:space-evenly;
    padding:10px;
    margin-right:20px;
    font-family: 'DM Serif Display', serif;
    font-family: 'Montserrat', sans-serif;
} 
div#contenitore-extra,div#contenitore-tabella-sei {
  text-align: center;
  padding:10px;
  margin-right:20px;
  font-family: 'DM Serif Display', serif;
  font-family: 'Montserrat', sans-serif;
}
div#contenitore-tabella-uno, div#contenitore-extra, div#contenitore-tabella-tre, div#contenitore-tabella-cinque, div#contenitore-tabella-sette, div#contenitore-tabella-nove, div#contenitore-tabella-undici{
    background-color: #c0c0c0;
}
p.sei, p.free, p.due, p.nove, p.otto, p.sette, p.siete, p.quattro, p.tre, p.cuatro, p.four, p.gratis, p.cinque {
    display:flex;
    justify-content: center;
    font-family: 'DM Serif Display', serif;
    font-family: 'Montserrat', sans-serif;
    font-size: 25px;
    }
    p#ric{
     text-align: center;
    font-family: 'DM Serif Display', serif;
    font-family: 'Montserrat', sans-serif;
    font-size: 25px;
    }
p.dispari, p.pari{
    display:flex;
    justify-content: center;
    font-size:25px;
    font-weight: bold;
    font-family: 'DM Serif Display', serif;
    font-family: 'Montserrat', sans-serif;
}
/*...FOOTER...*/
div.contenitore{
    background-color:#0F201F;
    display:flex;
    flex-direction: column;
    align-items: center;
    }
    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:60px;
  }
  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;
      }
      h2{
        font-size: 25px;
      }
      div#contenitore-tabella-uno, div#contenitore-extra, div#contenitore-tabella-due, div#contenitore-tabella-tre, div#contenitore-tabella-quattro, div#contenitore-tabella-cinque,div#contenitore-tabella-sei,
div#contenitore-tabella-dodici, div#contenitore-tabella-sette, div#contenitore-tabella-otto, div#contenitore-tabella-nove, div#contenitore-tabella-dieci, div#contenitore-tabella-undici {
margin-left:-10px;
width:100%;
}
p.dispari, p.pari, p#ric{
  font-size: 15px;
}
}