.keyboard{display:flex;box-sizing:border-box;width:100%;padding:10px 20px;flex:1}.keyboard .mused-button-grid{outline:0}.keyboard .mused-button-row{margin:0 -2px;justify-content:space-between}.keyboard .mused-button{height:25px;border-radius:4px;cursor:default;flex-direction:column;margin:2px}.keyboard .mused-button.note-button{transition:background-color .08s;width:20px;background:#eae1e2;flex:1}.mused-button.note-button div{pointer-events:none}.mused-button .note-name{font-size:10px;font-weight:700;height:10px}.mused-button .key-name{font-size:10px;color:#fff;text-transform:uppercase}.keyboard .mused-button.transpose-button{background:#eeeeef;font-size:20px;flex:2}.keyboard .mused-button.disabled{background-color:#eeeeef}.keyboard .mused-button.triggered{background-color:#5151af;color:#fff}.keyboard .mused-button.triggered .key-name{color:hsla(0,0%,100%,.2)}.mused-button-grid{position:relative;display:flex;flex-direction:column;width:100%;height:100%}.mused-button-grid .mused-button-row{display:flex;flex:1}.mused-button-grid .mused-button-overlay{position:absolute;width:100%;height:100%;display:flex;background:rgba(0,0,0,.5);color:#fff;align-items:center;justify-content:center;cursor:default}.mused-button-grid .mused-button-overlay.hidden{display:none}.mused-button-grid .mused-button{display:flex;align-items:center;justify-content:center;cursor:default}.pitch-label .accidental.sharp{margin-left:-.1em;letter-spacing:-.1em;font-size:80%}.pitch-label .accidental.flat{margin-left:-.25em;letter-spacing:-.2em;font-size:85%}