body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.body{margin:0}.App{background-color:#1a1a1a;color:#fff;flex-direction:column;font-family:Urbanist,sans-serif;justify-content:center;min-height:calc(100vh - 64px);padding-top:100px}.App,.instruction-card{align-items:center;display:flex}.instruction-card{background-color:#2a2a2a;border-radius:5px;margin-bottom:2rem;max-width:600px;padding:1rem;position:relative;z-index:1}.instruction-icon{color:#40e0d0;font-size:14px;margin-right:.5rem}.instructions-card i{font-size:1.5rem;margin-bottom:.5rem}.instruction-text-large{color:#e8e8e8;font-size:14px;margin:0;text-align:center}.instruction-text-small{display:none}.drum-pads{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr)}.drum-pad-container{flex-direction:column}.drum-pad,.drum-pad-container{align-items:center;display:flex}.drum-pad{background-color:#151515;border-radius:5px;cursor:pointer;height:120px;justify-content:center;padding:1rem;-webkit-user-select:none;user-select:none;width:120px}.drum-pad p{font-size:1.5rem;margin:0}.waveform{height:120px;overflow:hidden;width:120px}.dropzone{align-items:center;background-color:#2c2c2c;border:2px dashed #4d4d4d;border-radius:5px;cursor:pointer;display:flex;height:40px;justify-content:center;margin-top:1rem;padding:1rem;-webkit-user-select:none;user-select:none;width:120px}.dropzone.active{background-color:#707070;border-color:#d2d0d0}.dropzone p{color:#e8e8e8;font-size:.8rem;margin:0}.dropzone-text-small{display:none}.instruction-text{color:#e8e8e8;font-size:14px;margin:0;text-align:center}.sample-loaded{background-color:#4a4a4a}.footer{background-color:#1a1a1a;padding:1rem}.footer-text{color:#e8e8e8;font-size:.9rem;margin:0;text-align:center}.twitter-link{color:#e8e8e8;text-decoration:none}.twitter-link:hover{color:#40e0d0;text-decoration:underline}@media (max-width:768px){.drum-pad{height:50px;width:50px}.waveform{display:none}.dropzone{height:20px;width:40px}.instruction-card{margin-top:50px;max-width:300px}.instruction-text-large{display:none}.instruction-text-small{color:#e8e8e8;display:block;font-size:12px;margin:0;text-align:center}.App{justify-content:flex-start;padding-top:5rem}.drum-pad:has(.waveform){background-color:#40e0d0}.dropzone p{font-size:.6rem;text-align:center}.dropzone-text-large{display:none}.dropzone-text-small{display:block}.footer{padding-top:140px}.footer-text{font-size:.6rem}}.faq{margin:2rem 0;max-width:700px;width:100%}.faq-title{color:#fff;margin-bottom:2rem;text-align:center}.faq-item{background-color:#2c2c2c;border-radius:5px;margin-bottom:1rem;overflow:hidden}.faq-question{align-items:center;color:#fff;cursor:pointer;display:flex;font-size:medium;font-weight:700;justify-content:space-between;padding:1rem}.faq-answer{background-color:#373737;color:#e8e8e8;font-size:small;padding:1rem}.faq i{transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease}@media (max-width:768px){.faq{display:none}}.navbar{background-color:#222;left:0;padding:1rem;position:fixed;top:0;width:100%;z-index:1000}.navbar-container{box-sizing:border-box;justify-content:space-between;margin:0 auto;max-width:1200px;width:100%}.logo-title-container,.navbar-container{align-items:center;display:flex}.navbar-logo{height:auto;margin-right:1rem;width:20px}.navbar-title{color:#fff;font-size:1.2rem;margin:0}.navbar-button{background-color:#3c3c3c;border:none;border-radius:2px;color:#fff;font-size:.8rem;margin:0 0 0 900px;padding:10px}.link-container{align-items:center;display:flex}.navbar-link{color:#fff;font-weight:medium;text-decoration:none}.navbar-link:hover{color:#40e0d0}.title-link{text-decoration:none}.title-link:hover .navbar-title{color:#40e0d0}@media (max-width:768px){.navbar-container{flex-wrap:wrap;justify-content:space-between;padding:0 1rem}.logo-title-container{flex-grow:1}.link-container{flex-grow:0}.navbar-link{margin-right:1.5rem}}
/*# sourceMappingURL=main.1bfc7228.css.map*/