*{margin:0;padding:0}body{background-color:bisque}h1,h2{display:flex;justify-self:center}.keysContainer{width:840px;height:auto;left:50%;transform:translate(-50%);margin-top:10px;display:flex;flex-direction:row;justify-content:center;align-items:center;position:relative}.whiteKeys button{padding-top:100px}.blackKeys{position:absolute;top:0;left:0}.blackKeys button{height:100px;color:azure}.blackKeys>button:nth-child(1){margin-left:20.5px}.blackKeys>button:nth-child(3){margin-left:40px}.blackKeys>button:nth-child(6){margin-left:40px}.blackKeys>button:nth-child(8){margin-left:40px}.blackKeys>button:nth-child(11){margin-left:40px}.blackKeys>button:nth-child(13){margin-left:40px}.key{width:40px;height:150px;background-color:#fff;border:1px solid rgb(222,225,226);border-radius:10px;font-weight:600}.key:hover{border:3px solid purple}