.App{display:flex;flex-flow:column;justify-content:space-around;margin:0;min-height:85vh;padding:1rem}.power_container{display:flex;justify-content:flex-end}.name_display_container{display:flex;justify-content:center;min-height:3rem}.name_display_container span{font-size:2rem}.switch{display:inline-block;height:34px;position:relative;width:60px}.switch input{height:0;opacity:0;width:0}.slider{background-color:#ccc;bottom:0;cursor:pointer;left:0;right:0;top:0}.slider,.slider:before{position:absolute;transition:.4s}.slider:before{background-color:#fff;bottom:4px;content:"";height:26px;left:4px;width:26px}input:checked+.slider{background-color:#2196f3}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(26px);transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.drums_container{grid-gap:5rem 1rem;align-content:center;align-items:center;display:grid;gap:5rem 1rem;grid-template-areas:". ." ". .";grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;justify-content:space-around;justify-items:center}.drums_container__button{align-items:center;background:#add8e6;border:#ffdead;cursor:pointer;display:flex;flex-flow:column;font-size:1.5rem;justify-content:center;margin:0;min-height:8rem;min-width:8rem;padding:0}.drums_container__button:disabled{cursor:not-allowed}.drums_container__button--letter{font-size:medium}.volume__container{position:relative}.volume_container__display{font-size:1.5rem;position:absolute;right:0;top:-2rem}.volume_range{-webkit-appearance:none;background:#d3d3d3;height:25px;opacity:.7;outline:none;transition:opacity .2s;width:100%}.volume_range:hover{opacity:1}.volume_range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#04aa6d;cursor:pointer;height:25px;width:25px}.volume_range::-moz-range-thumb{background:#04aa6d;cursor:pointer;height:25px;width:25px}.volume_range:disabled{cursor:not-allowed}.volume_range:disabled:hover{background-color:#d3d3d3}.bank_container{align-items:center;cursor:pointer;display:flex;font-size:2rem;justify-content:space-around}.bank_container .bank{border:1px solid #2196f3;flex-basis:25%;padding:1rem;text-align:center}.bank_container .bank.disabled{background:#ccc;border:none;cursor:not-allowed}.bank_container .bank.selected{background:#2196f3;border:none;cursor:not-allowed}
/*# sourceMappingURL=main.285611f1.css.map*/