*{font-size:16px;box-sizing:border-box;padding:0;margin:0}body,html{font-family:Arial,Helvetica,sans-serif;font-size:16px;font-weight:400;line-height:1.4em;height:100vh;width:100%;background-color:#f5f5f5}.app,body,html{display:flex;flex-direction:column;justify-content:center}.app{position:relative;font-family:sans-serif;text-align:center;margin:0 auto;height:400px;width:650px;border:5px solid #000;background-color:#bf896c}.app #my-container{display:flex;justify-content:space-around;align-items:center;height:80%;width:90%;margin:0 auto}.app #my-container #drum-pad{display:flex;flex-flow:row wrap;justify-content:space-between;height:100%;width:45%}.app #my-container #drum-pad .drum{height:33.3333333333%;width:33.3333333333%;margin:0;padding:0;cursor:pointer;border:1px solid #000;background-color:#fff}.app #my-container #drum-pad .drum .inner-drum{width:100%}.app #my-container #control-pad,.app #my-container #drum-pad .drum .inner-drum{display:flex;flex-direction:column;justify-content:center;height:100%;background-color:#fff}.app #my-container #control-pad{width:45%;border:1px solid #000}.app #my-container #control-pad .my-switch{height:30%;width:100%;margin:0 auto}.app #my-container #control-pad .my-switch .switch{position:relative;display:inline-block;height:30%;width:60px}.app #my-container #control-pad .my-switch .switch .my-input{opacity:0;height:0;width:0}.app #my-container #control-pad .my-switch .switch .slider{position:absolute;cursor:pointer;height:100%;width:100%;top:0;left:0;bottom:0;right:0;background-color:#dec3b5}.app #my-container #control-pad .my-switch .switch .slider:before{position:absolute;content:"";height:100%;width:50%;left:0;bottom:0;transition:.5s;background-color:#2d2019}.app #my-container #control-pad .my-switch .switch input:checked+.slider:before{-webkit-transform:translateX(100%);transform:translateX(100%)}.app #my-container #control-pad #display{width:100px;margin:0 auto;background-color:#fff;border:1px solid #000}.app #signature{position:absolute;left:0;right:0;bottom:0;margin:5px auto}@media(max-width:700px){.app{height:80vh;width:80%;padding:40px}.app #my-container{display:flex;flex-direction:column-reverse;justify-content:space-around;width:100%;height:100%}.app #my-container #control-pad,.app #my-container #drum-pad{height:45%;width:100%}}
/*# sourceMappingURL=main.c87a2318.chunk.css.map */