.keyboard-hero-game{box-sizing:border-box;background-color:#000;flex-direction:column;justify-content:center;align-items:center;height:100%;min-height:100%;margin:0;padding:1rem;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:500;display:flex;overflow:auto}.keyboard-hero-game .title{color:#f5fffa;text-transform:uppercase;letter-spacing:.3em;text-align:center;margin-top:1.5em;margin-bottom:1.5em;font-size:1em}.keyboard-hero-game #keyboard-hero-score{color:#f5fffa;letter-spacing:.15em;margin-bottom:.5em;font-size:1.1em}.keyboard-hero-game .keyboard{flex-direction:column;display:flex}.keyboard-hero-game .row{margin:0;padding:0;list-style:none;display:flex}.keyboard-hero-game li{color:#000000b3;letter-spacing:1px;text-align:center;border-radius:.4em;width:3em;height:3em;margin:.4em;font-size:1em;line-height:3em;transition:all .3s}.keyboard-hero-game #tab{width:5em}.keyboard-hero-game #caps{width:6em}.keyboard-hero-game #left-shift{width:8em}.keyboard-hero-game #enter{width:6em}.keyboard-hero-game #right-shift{width:8em}.keyboard-hero-game #back{width:5em}.keyboard-hero-game .pinky{background-color:#dc143c;border:2px solid #dc143c}.keyboard-hero-game .pinky.selected{color:#dc143c}.keyboard-hero-game .ring{background-color:coral;border:2px solid coral}.keyboard-hero-game .ring.selected{color:coral}.keyboard-hero-game .middle{background-color:#ff8c00;border:2px solid #ff8c00}.keyboard-hero-game .middle.selected{color:#ff8c00}.keyboard-hero-game .pointer1st{background-color:gold;border:2px solid gold}.keyboard-hero-game .pointer1st.selected{color:gold}.keyboard-hero-game .pointer2nd{background-color:khaki;border:2px solid khaki}.keyboard-hero-game .pointer2nd.selected{color:khaki}.keyboard-hero-game .fill-out-key{background-color:#708090;border:2px solid #708090}.keyboard-hero-game .selected{background-color:#0000;animation:.3s linear infinite both kh-vibrate-1}.keyboard-hero-game .hit{animation:.3s cubic-bezier(.39,.575,.565,1) both kh-hit}@keyframes kh-hit{0%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes kh-vibrate-1{0%{transform:translate(0)}20%{transform:translate(-2px,2px)}40%{transform:translate(-2px,-2px)}60%{transform:translate(2px,2px)}80%{transform:translate(2px,-2px)}to{transform:translate(0)}}@media (max-width:768px){.keyboard-hero-game li{width:2.2em;height:2.2em;margin:.2em;font-size:.75em;line-height:2.2em}.keyboard-hero-game #tab{width:3.5em}.keyboard-hero-game #caps{width:4.2em}.keyboard-hero-game #left-shift,.keyboard-hero-game #right-shift{width:5.5em}.keyboard-hero-game #enter{width:4.2em}.keyboard-hero-game #back{width:3.5em}.keyboard-hero-game .title{letter-spacing:.15em;font-size:.75em}}