body{
              background-image: url(./images/piano.jpg);
}
h1{
              background: radial-gradient(yellow,violet);
              text-align: center;
              border: 3px solid;
              border-radius: 10px;
              margin: 0px;
              margin-bottom: 10px;
}

.set{
              background-image: url(./images/cloud.jpg);
              border: 3px solid ;
              border-radius: 10px;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
              padding-right: 40px;
              padding-left: 40px;
              padding-top: 10px;
              padding-bottom: 10px;

             
}
.key{
              margin: 5px;
              padding: 10px;
              height: 80px;
              text-align: center;
              font-size: large;
              border-radius: 10px;
             
}

.z{
              grid-column: span 5;
}

footer{
              background: radial-gradient(yellow,violet);
              margin-top: 10px;
              border: 3px solid;
              font-weight: bold;
              text-align: center;
              padding: 10px;
              margin-left: -8px;
              margin-right: -8px;
              margin-bottom: -8px;
}

.keyAnimation{
              box-shadow: 3px 3px 4px 3px rgb(255, 89, 89);
              background: radial-gradient( yellow, violet);     
}