@import url(https://fonts.googleapis.com/css?family=Montserrat: 400, 500);.montserrat-medium-dawn-pink-18px{color:hsla(34,49%,91%,.902);color:var(--dawn-pink);font-family:Montserrat;font-family:var(--font-family-montserrat);font-size:var(--font-size=xxl);font-style:normal;font-weight:500}.h1text-lg{@extend .valign-text-middle;@extend .montserrat-medium-dawn-pink-18px}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}.valign-text-middle{display:flex;flex-direction:column;justify-content:center}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.hitext-lg{align-items:flex-start;display:flex;padding:0 1.96px .23px 0;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.div-stemplayer2{background:linear-gradient(180deg,#3c3c3c 14.22%,#1a1a1a 190%);background-color:#fff;border:1px;justify-content:center;min-height:1600.68px;min-width:1068.02px;padding:19px 0;width:100%}.div-stemplayer2,.page{align-items:flex-start;display:flex;gap:10px;position:relative}.page{padding:50px 62px}.divw-full,.main,.page{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.divw-full,.main{border:1px solid;border-color:var(--black);border-radius:12px;flex-direction:column;gap:35px}.divflex,.divw-full,.main{align-items:center;display:flex;position:relative}.divflex{width:944px}.divflex,.divflex-3{justify-content:space-between}.divflex-3{align-items:flex-start;display:flex;flex-direction:column;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.divflex-1{background-color:#101010;border:3px solid;border-color:var(--black);border-radius:12px;box-shadow:inset 5px 5px 14px 10px #0000003b,.8px .8px 0 #ffffff1a;flex:1 1;height:100px;overflow:hidden;position:relative}.divw-full-1{align-items:center;display:flex;gap:15.99px;left:0;padding:0 0 0 8px;position:absolute;width:753px}.stemrow{align-items:center;box-shadow:0 4px 4px #00000040;flex-wrap:wrap;gap:31.99px;padding:0 24px 0 0}.frame-1,.stemrow{display:flex;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.frame-1{align-items:flex-end;bottom:15px;gap:244px}.frame-1-1{align-items:flex-start;flex-direction:row;gap:40px;position:relative}.frame-1-1,.frame-1-1-1{display:flex;justify-content:space-evenly;width:100%}.frame-1-1-1{align-items:center}.h1text-lg-1{align-items:flex-start;display:flex;padding:0 3.17px .23px 0;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}@media screen and (max-width:1100px){.div-stemplayer2{min-height:1000px;padding:0;width:100%}.divw-full,.main{width:100%}}@media screen and (max-width:900px){.div-stemplayer2{justify-content:flex-start;min-height:1000px;padding:10px 0}.divw-full,.main{width:100%}.frame-1,.frame-1-1{flex-direction:column}.page{padding:50px 20px}.divbg-black,.divflex{flex-direction:row;gap:0;width:100%}.divflex-3{gap:15px}.divw-full-1{flex-wrap:wrap;position:static;width:100%}.hitext-lg{width:100%}}@media only screen and (max-width:768px){.main{display:flex;flex-direction:column;min-width:100%}.divbg-black .divflex-3,.divflex{width:100%}}.waveform{border:1px solid;border-color:var(--black);min-width:696.99px}.divbg-black{align-items:flex-start;background-color:var(--black);border:5px solid;border-radius:16px;display:flex;overflow:hidden;padding:5.88px 0 5.88px 5.88px;position:relative;width:944px}.divflex-2{background:linear-gradient(180deg,#5f7585 14.22%,#1a1a1a);border:4px solid var(--black);border-radius:30px;box-shadow:inset 2px 2px 0 #ffffff0a,inset -2px -2px 0 #0000001a,0 4px 34px #00000059;height:100px;margin-right:-.8px;min-width:96.8px}.divflex-2,.icon{position:relative}.icon{align-items:center;height:20px;min-width:20px}@media screen and (max-width:900px){.divbg-black{flex-direction:row;gap:0;width:100%}}@media (max-width:768px){.waveform{max-width:100%;min-width:100%}.divbg-black{width:100%}}.button-group{display:flex;margin-top:8px}.big-button,.button{background-color:initial;border:1px solid #fff;border-radius:4px;color:#fff;cursor:pointer;font-size:8px;padding:2px 4px;transition:background-color .3s ease}button:active{background-color:#ccc;-webkit-transform:translateY(2px);transform:translateY(2px)}.big-button:hover,.button:hover{background-color:rgba(241,196,15,.7);color:#000}.outer-left{border-radius:6px 0 0 6px}.outer-right{border-radius:0 6px 6px 0}.volume-slider{background-color:initial;border:1px solid #fff;border-radius:4px;cursor:pointer;padding:2px 4px}.stem{flex-direction:row;left:15px;min-width:274px}.stem,.stem-label{align-items:center;display:flex;position:relative}.stem-label{background:linear-gradient(180deg,#5f7585 14.22%,#1a1a1a);border-radius:6px;box-shadow:inset 2px 2px 0 #ffffff0a,inset -2px -2px 0 #0000001a,0 4px 34px #00000059;height:116px;justify-content:space-between;padding-left:6px;padding-right:6px;width:290px}.stem-label-row{flex-direction:column;margin-right:16px}.stem-label-row,.subheading-row{align-items:center;display:flex}.big-button{font-size:12px;padding:6px 12px}.subheading{font-size:12px;margin:0 8px}.stem-controls-row{align-items:center;display:flex;gap:8px;justify-content:center}.stem-controls{align-items:center;display:flex;flex-direction:column}.stem-controls input[type=range]{margin:10px auto 0;width:80%}.active{background-color:#f1c40f;color:#fff}.stem-icon-container{margin-right:16px}.stem-icon{align-items:center;display:flex;height:31.99px;min-width:31.99px;position:relative}.vector{height:13px;margin-top:1.19px;width:13px}.waveform{background-position:50% 50%;background-size:cover;height:100px;margin-right:-.15px;min-width:570.99px;position:relative}audio::-webkit-media-controls-play-button{background-image:url(/static/media/play.cb7155040e055cc6a205.svg);background-size:cover;height:40px;width:40px}.change-track{height:39px;width:75px}@media only screen and (max-width:600px){.stem{align-items:flex-start;flex-direction:column;left:0;margin-bottom:0;min-width:100%}.stem-label-row{align-items:center;display:flex;justify-content:space-between;min-width:100%}.stem-name{margin-left:0;margin-top:8px}.stem-label{height:50%}.stem-label,.waveform{min-width:100%}audio::-webkit-media-controls-play-button{height:30px;width:30px}.change-track{margin-left:0;margin-top:12px;width:100%}}.key-label,.montserrat-medium-dawn-pink-12px{font-weight:500}.h1text-m,.key-label,.montserrat-medium-dawn-pink-12px,.montserrat-normal-dawn-pink-12px{color:hsla(34,49%,91%,.902);color:var(--dawn-pink);font-family:Montserrat;font-family:var(--font-family-montserrat);font-size:12px;font-size:var(--font-size-m);font-style:normal}.h1text-m,.montserrat-normal-dawn-pink-12px{font-weight:400}.h1text-lg,.key-label,.valign-text-middle{display:flex;flex-direction:column;justify-content:center}.h1text-m{border:1px solid #fff;border-left:transparent;border-right:transparent;color:#fff;cursor:pointer;padding:6.5px 4px;transition:background-color .3s ease}.h1text-m,.key-label{background-color:initial}.key-label{height:20px;letter-spacing:.4px;line-height:19.9px;min-width:10px;text-align:center;white-space:nowrap}.key-label-top{margin-left:15px;margin-top:-2px}.key-label-bottom{margin-bottom:1.92px;margin-left:7px;margin-right:25px}.chosen-key{align-items:flex-start;background-color:#121113;border:2px solid #81032f;border-color:var(--siren);border-radius:8px;display:flex;padding:14.04px 19.11px 13 .96px;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}@media only screen and (max-width:767px){.h1text-lg{flex-wrap:wrap;justify-content:center}.key-label-top{margin-left:0}.key-label-bottom{margin-left:0;margin-right:0}.chosen-key{margin-left:0;padding:10px}}.montserrat-normal-dawn-pink-12px,.toggle-button-label{color:hsla(34,49%,91%,.902);color:var(--dawn-pink);font-family:Montserrat;font-family:var(--font-family-montserrat);font-size:12px;font-size:var(--font-size-m);font-style:normal;font-weight:400}.h1text-lg,.toggle-button-label,.valign-text-middle{display:flex;flex-direction:column;justify-content:center}.toggle-button-container{align-items:center;display:flex;height:37px;justify-content:space-evenly;position:relative;width:179px}.toggle-button-label{height:20px;letter-spacing:.4px;line-height:19.9px;margin-bottom:2.78px;min-width:38px;position:absolute;text-align:center;white-space:nowrap}.toggle-button-label.minor{left:10px}.toggle-button-label.major{right:10px}.toggle-button-switch.minor{left:2px;-webkit-transform:translateX(0);transform:translateX(0)}.toggle-button-switch.major{right:2px;-webkit-transform:translateX(100%);transform:translateX(100%)}.span-mui-switch-root{align-items:center;align-self:flex-end;display:flex;height:36px;margin-bottom:-1px;margin-left:4px;padding:0 9px;width:58px}.span-container,.toggle-button-row{height:20px;position:relative;width:37px}.spanjss522,.toggle-button{background-color:#fff;border-radius:7px;height:12px;left:3px;opacity:.3;position:absolute;top:4px;width:34px}.span-mui-switch-thumb,.toggle-button-switch{background-color:#edba0a;border-radius:10px;box-shadow:1px 3px Ox rgba(0,0,0,.122),0 1px 1px rgba(0,0,0,.141),0 2px 0 rgba(0,0,0,.2);height:20px;left:0;position:absolute;top:0;width:20px}.minor-1{height:20px;letter-spacing:.4px;line-height:19.9px;margin-bottom:3px;margin-left:11px;min-width:37px;white-space:nowrap}@media (max-width:767px){.toggle-button-container{margin:0 auto;max-width:320px;width:100%}.toggle-button-label.minor{left:5%}.toggle-button-label.major{right:5%}.span-mui-switch-root{height:28px;margin-bottom:0;margin-left:0;padding:0;width:46px}.span-container,.toggle-button-row{height:12px;width:24px}.spanjss522,.toggle-button{height:8px;left:2px;top:2px;width:20px}.span-mui-switch-thumb,.toggle-button-switch{height:12px;width:12px}}.svgh2d-c8c9c4aa{height:35px;left:14px;position:absolute;top:42px;width:343px}.divjss519{align-items:center;display:flex;flex-direction:column;padding:0 20px;position:relative;width:50%}.key-set{height:121px;min-width:342.82px;position:relative}.bottomKeys{align-items:center;left:0;top:71px}.bottomKeys,.topKeys{display:flex;height:48px;min-width:326px;position:absolute}.topKeys{align-items:flex-start;justify-content:flex-end;left:21px;padding:13px 4.9px;top:0}@media only screen and (max-width:767px){.svgh2d-c8c9c4aa{height:25px;left:10px;top:20px;width:100%}.divjss519{padding:0 10px;width:150px}.key-set{height:80px;min-width:100%}.bottomKeys{top:45px}.topKeys{height:30px;justify-content:center;left:0;padding:10px 0;top:0;width:100%}}:root{--black:#000;--siren:#81032f;--dawn-pink:hsla(34,49%,91%,.902);--dawn-pink-2:#f3e9dc;--font-size-s:11.9px;--font-size-m:12px;--font-size-1:14px;--font-size-xl:16px;--font-size-xxl:18px;--font-size-xxxl:20px;--font-family-montserrat:"Montserrat"}.montserrat-medium-dawn-pink-12px{font-weight:500}.montserrat-medium-dawn-pink-12px,.montserrat-normal-dawn-pink-12px{color:hsla(34,49%,91%,.902);color:var(--dawn-pink);font-family:Montserrat;font-family:var(--font-family-montserrat);font-size:12px;font-size:var(--font-size-m);font-style:normal}.montserrat-normal-dawn-pink-12px{font-weight:400}.montserrat-medium-dawn-pink-16px{font-size:16px;font-size:var(--font-size-xl)}.h1text-lg,.montserrat-medium-dawn-pink-16px,.montserrat-medium-dawn-pink-18px{color:hsla(34,49%,91%,.902);color:var(--dawn-pink);font-family:Montserrat;font-family:var(--font-family-montserrat);font-style:normal;font-weight:500}.h1text-lg,.montserrat-medium-dawn-pink-18px{font-size:var(--font-size=xxl)}.h1text-lg{align-items:flex-start;display:flex;padding:0 3.17px .23px 0;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}@media (max-width:768px){:root{--font-size-s:10px;--font-size-m:10.5px;--font-size-1:12px;--font-size-xl:14px;--font-size-xxl:16px;--font-size-xxxl:18px}}.h1text-lg,.valign-text-middle{display:flex;flex-direction:column;justify-content:center}.bpm{color:#f3e9dc;color:var(--dawn-pink-2);font-family:Montserrat;font-family:var(--font-family-montserrat);font-size:11.9px;font-size:var(--font-size-s);font-weight:400;letter-spacing:.25px;line-height:20.1px;margin-top:-1px;position:relative;white-space:nowrap;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.bpm-input{background-color:#1d1e22;border:1px solid #f3e9dc;border-color:var(--dawn-pink-2);border-radius:4px;margin-bottom:10px;text-align:center;top:1px;width:106px}.bpm-input,.div-mui-grid-root{align-items:flex-start;display:flex;height:40px;position:relative}.div-mui-grid-root{gap:26.09px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.span-mui-slider-thumb-color-primary{background-color:#81032f;background-color:var(--siren);border-radius:10px;height:20px;left:-10px;position:absolute;top:85px;width:20px}.speed-section{padding:0 0 7.09px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.speed-grid-root,.speed-section{align-items:center;display:flex;flex-direction:column;position:relative}.speed-grid-root{justify-content:center}.bpm-input-arrows{display:flex;flex-direction:column;height:100%;justify-content:space-between;position:absolute;right:0;top:0}.bpm-input-arrow{cursor:pointer;display:block;height:10px;width:10px}.bpm-input-arrow.up{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.bpm-input-arrow.down{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.bpm-input-label,.bpm-label{align-items:center;display:flex;flex-direction:column}.bpm-input-label{gap:10px}.tickmarks{display:flex;flex-direction:row;justify-content:space-between}.tick-options{margin-left:45px;margin-right:45px}@media only screen and (max-width:768px){.speed-section{align-items:center;gap:16px}}@media only screen and (max-width:576px){.speed-section{align-items:center;gap:8px}.bpm-input{width:80px}}
/*# sourceMappingURL=main.f6909c70.css.map*/