body{width:1246px;margin:20px auto}h2.Title{font-style:italic;display:inline-block;cursor:pointer;margin:0}h2.Title button{background:inherit;border:0;color:inherit;padding:0}h1.Title.untitled span,h2.Title.untitled{color:#ccc}h2.Title input{color:#000}.title-ui{margin-right:3rem}section{margin:20px auto}#status{display:inline-block;text-align:right;font:30px monospace;font-style:italic}#status.recording i{-webkit-animation:record-pulse 1s infinite;animation:record-pulse 1s infinite}@-webkit-keyframes record-pulse{0%{color:#fff}50%{color:#900}to{color:#fff}}@keyframes record-pulse{0%{color:#fff}50%{color:#900}to{color:#fff}}.progress-bar{transition:none}#chord{width:7em;font-size:inherit}.urls td input{width:100%;border:0;background:transparent}button .progress{display:inline-block;vertical-align:text-bottom;margin:0;border-radius:0;box-shadow:none;position:relative;top:-1px}#preview .progress{width:1.8em;height:1em}#big-play .progress{width:.8em;height:1em}.piano-2col{display:flex;align-items:flex-end;min-height:4.5em;margin-top:10px}.piano-2col>div:first-child{flex:1 1}.med-btn{font-size:1.5em;margin-right:.3em}#big-play,.med-btn{vertical-align:baseline}#big-play{font-size:3rem;margin-right:20px}.nav-tabs li:first-child{margin-left:15px}.Keyboard{width:1246px;margin:0 auto}.Keyboard *{box-sizing:border-box}.piano{position:relative;background:#444;border-bottom:1px solid #ccc;border-top:1px solid #ccc}.piano [data-note]{text-align:center;text-decoration:none}.piano.noinput span{cursor:default}.stepRow{position:relative;background:#fff;border-bottom:1px solid #fff}.white{z-index:1;padding-left:10px;overflow:auto}.white span{float:left;margin-left:2px;width:32px;height:160px;border-radius:2px 2px 5px 5px;background:#fff;color:#000;font-weight:700;padding-top:120px;cursor:pointer}.stepRow .white span{background:#555;border:0;border-radius:0;height:30px;margin-left:1px;padding-top:0;width:33px}.black{left:0}.black,.black span{position:absolute;top:0}.black span{width:16px;height:100px;border:2px solid #000;border-radius:0 0 5px 5px;background:#000;color:#fff;padding-top:58px;font-size:10px;cursor:pointer}.stepRow .black span{background:#555;border:0;border-left:1px solid #fff;border-right:1px solid #fff;border-radius:0;height:30px;padding-top:0}.piano .black>span.active,.piano .white>span.active{background:#74c674}.stepRow.active .black>span,.stepRow.active .white>span{background:#999}.stepRow .black>span.active,.stepRow .white>span.active{background:#33baf8}
/*# sourceMappingURL=main.ce444ff5.chunk.css.map */