html {font-size: 10px;font-family: "SuperMario";background: url("../images/mario-1557240.jpg") bottom center;background-size: cover;}body,html {margin: 0;padding: 0;}.container {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-flex: 1;-ms-flex: 1;flex: 1;min-height: 100vh;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-ms-flex-wrap: wrap;flex-wrap: wrap;width: 80%;margin: auto;}.player {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.key {border: .4rem solid black;border-radius: .5rem;margin: 1rem;font-size: 1.5rem;padding: 1rem .5rem;-webkit-transition: all .07s ease;transition: all .07s ease;width: 10rem;text-align: center;color: white;background: rgba(0,0,0,0.4);text-shadow: 0 0 .5rem black;height: 9rem;}.playing {-webkit-transform: scale(1.1);transform: scale(1.1);border-color: #ffc600;-webkit-box-shadow: 0 0 1rem #ffc600;box-shadow: 0 0 1rem #ffc600;}kbd {display: block;font-size: 4rem;}.song {height: 15rem;width: 13rem;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.container {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 100%;-webkit-box-align: space-around;-ms-flex-align: space-around;align-items: space-around;}.sound {font-size: 1.2rem;text-transform: uppercase;letter-spacing: .1rem;color: #ffc600;border: none;}.player {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.keys {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}.title {width: 40rem;margin-top: 5rem;}@font-face {font-family:"SuperMario";src:url("../fonts/tlpsmb.ttf");}