style.css

*:focus {
  outline: none;
  box-shadow: 0 0 0 2px #99CCFF;
}

#lecteurSon {
  display: none;
}

#page{
     width: 100%;
     height: 100%;
     display: flex;
     flex-direction: column;
     align-items: center;
}

#buttonsContainer {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 90%;
     background-color: rgb(230,247,255);
     border-radius: 10px;
     height: 60px;
}

.buttons{
     padding: 10px;
     margin:10px;
     border-radius: 10px;
}
     
#pictureContainer {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 90%;
     background-color: rgb(255,242,230);
     border-radius: 10px;
     padding-top: 30px;
     padding-bottom: 30px;
     margin-top: 10px;
}

#picture {
  max-width: 100%;
  max-height: 564px; /* hauteur maximale souhaitée */
}

#pavContainer {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 90%;
     background-color: rgb(230,247,255);
     border-radius: 10px;
     margin-top: 10px;
     padding: 10px;
}


.keyPad{
     max-width: 80%;
     max-height: 80px; /* hauteur maximale souhaitée */
}

.keyPad:active{
     opacity: 0.5;
}