.App{font-family:sans-serif;display:flex;flex-direction:column;width:100%;height:100%;background-color:#666;align-items:center}.title{color:#fff;text-align:center}.function{width:800px;flex-direction:column}.function,.sequencer{display:flex;align-self:center}.sequencer{height:100%;text-align:center;margin:30px}.key-column{display:flex;flex-direction:column}.row-key,.row-key-onMode{height:40px;width:40px;color:#fff;margin:4px;line-height:40px}.note-wrapper{height:100%;display:flex}.note-column{display:flex;flex-direction:column}.note-column--active{background:#282}.note{height:40px;width:40px;color:#858585;background:#858585;border:2px solid #ccc;border-radius:2px;margin:4px;cursor:pointer}.note--active{color:#fff;background:#ef8a8c}.note:active{background:#d3d3d3}.function-buttons{display:flex;flex-direction:row;justify-content:space-between}.action-button{padding:.5rem 1.5rem;border:2px solid #ef8a8c;border-radius:4px;cursor:pointer}.function-sliders{margin-top:35px;display:flex;flex-wrap:wrap;justify-content:space-evenly}.slider-wraper{display:flex;flex-direction:row;color:#fff;line-height:20px;margin-right:20px}.slider-wraper:last-of-type{margin-right:0}.slider{-webkit-appearance:none;width:250px;height:20px;background:#d3d3d3;outline:none;opacity:.7;transition:opacity .2s;margin-right:10px}.slider:hover{opacity:1}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25px;height:25px;background:#04aa6d;cursor:pointer}.slider::-moz-range-thumb{width:25px;height:25px;background:#04aa6d;cursor:pointer}.slider-label{align-self:center}.description-container{color:#fff}.discription-row,.selector{flex-direction:row}.selector{display:flex;margin-right:18px}.selector-label{color:#fff;font-size:20px;align-self:center;margin-right:12px}.selector-input{padding:.5rem 1.5rem;text-transform:uppercase;border:2px solid #ef8a8c;border-radius:4px;cursor:pointer}
/*# sourceMappingURL=main.738b053f.chunk.css.map */