*{
    box-sizing: border-box;
}
body{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

#titolo{
    margin: 10px;
}
#sottotitolo{
    margin-bottom: 30px;
}

#contenitore{
    background-color: darkgray;
    display: flex;
    flex-wrap: wrap;
    width: 600px;
    height: 600px;
    
    
}
#pulsanti{
    margin: 30px;
    display: flex;
    gap: 30px;
   
    
}
.button1,.button2,.button3,.button4{
    height: 30px;
    width: 90px;
}
.button1{
    background-color: black;
    color: white;
}
.button2{
    background-color: white;
    color:black;
}
.button3{
    background: linear-gradient(to right,red, orange, yellow, green, blue, indigo, violet) ;
}
.button4{
    background-color: lightslategray;
    
}


.quadrato{
    background-color: white;
    border: 0.3px solid grey;
  

}
.quadrato:hover{
    background-color: grey;
    
}