@import url(https://fonts.googleapis.com/css2?family=Rubik+Moonrocks&display=swap);@import url(https://fonts.googleapis.com/css2?family=Amatic+SC&display=swap);@import url(https://fonts.googleapis.com/css2?family=Orbitron&display=swap);@import url(https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap);@import url(https://fonts.googleapis.com/css2?family=Kaushan+Script&family=Shadows+Into+Light&display=swap);@import url(http://fonts.cdnfonts.com/css/graffiti-font);@import url(http://fonts.cdnfonts.com/css/helter-skater);p[data-v-5b3fa0b6]{font-family:Shadows Into Light,cursive;font-size:100px;background:linear-gradient(#000,#f70000,#f89200,#f8f501,#038f00,#0168f8,#a200f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:600;margin-top:0;margin-left:25%}#keyboard[data-v-5b3fa0b6]{width:500px;height:500px;margin-left:5%;margin-top:-5%;margin-bottom:5%;margin-right:5%;float:left}#keys[data-v-5b3fa0b6]{display:grid;grid-template-columns:repeat(3,0fr);cursor:pointer;font-size:60px;font-weight:500}.white[data-v-5b3fa0b6]{width:120px;height:120px;margin:5px;line-height:120px;text-align:center;background:rgba(0,0,0,.0001);border-radius:10px;box-shadow:5px 10px 20px 0 #000}.white.active[data-v-5b3fa0b6]{transform:scale(.93);background-size:50% 200%}@-webkit-keyframes gradient-5b3fa0b6{0%{background-position:400% -40%;box-shadow:1px 10px 10px #000}}@keyframes gradient-5b3fa0b6{0%{background-position:400% -40%;box-shadow:1px 10px 10px #000}}#Y[data-v-5b3fa0b6]{color:red}#Y[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#Y.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:#f88;color:#000;box-shadow:2px 2px 40px 3px #f88}#G[data-v-5b3fa0b6]{color:#ff0}#G[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#G.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:#ff0;color:#000;box-shadow:2px 2px 40px 3px #ff0}#U[data-v-5b3fa0b6]{color:green}#U[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#U.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:green;color:#000;box-shadow:2px 2px 40px 3px green}#H[data-v-5b3fa0b6]{color:orange}#H[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#H.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:orange;color:#000;box-shadow:2px 2px 40px 3px orange}#J[data-v-5b3fa0b6]{color:violet}#J[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#J.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:violet;color:#000;box-shadow:5px 10px 20px 0 #000;box-shadow:2px 2px 40px 3px violet}#O[data-v-5b3fa0b6]{color:#00f}#O[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#O.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:#00f;color:#000;box-shadow:2px 2px 40px 3px #00f}#K[data-v-5b3fa0b6]{color:#00bfff}#K[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#K.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:#00bfff;color:#000;box-shadow:2px 2px 40px 3px #00bfff}#P[data-v-5b3fa0b6]{color:maroon}#P[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#P.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:maroon;color:#000;box-shadow:2px 2px 40px 3px maroon}#L[data-v-5b3fa0b6]{color:tan}#L[data-v-5b3fa0b6]:hover{background:rgba(0,0,0,.39)}#L.active[data-v-5b3fa0b6]{-webkit-animation:gradient-5b3fa0b6 50ms;animation:gradient-5b3fa0b6 50ms;background:tan;color:#000;box-shadow:2px 2px 40px 3px tan}@media screen and (max-width:1145px){#keyboard[data-v-5b3fa0b6]{width:auto;position:static;margin-left:0;display:grid;grid-auto-columns:repeat(3,1fr);justify-content:center}}#controls[data-v-466f3f6f]{float:right;align-content:center;position:static;top:10pc;right:5pc;botto:5pc;margin-bottom:1%;margin-right:20%;resize:both}#table[data-v-466f3f6f]{width:100% auto;height:100% auto;position:static;margin-top:10px;margin-bottom:1%;margin-right:1%;float:right;box-shadow:1px 0 5px 0 #000}.selectedCell[data-v-466f3f6f]{background:#fff}#playable[data-v-466f3f6f]{font-size:2;text-align:center;color:#db504a;position:static;display:block;border:1px solid #000;box-shadow:5px 10px 20px 0 #000}.column[data-v-466f3f6f]{display:inline-block;font-size:22px;border:1px 5px 10px 20px 0 solid #000;border-right:3px solid #db504a;border:.4px solid rgba(219,80,74,.01);box-shadow:1px 0 5px 0 #000;background:rgba(0,0,0,.0001);position:static;border-radius:4px}.column .notes[data-v-466f3f6f]{border:1px solid rgba(210,180,140,.355);border-radius:2px;box-shadow:1px 0 5px 0 #000}.row[data-v-466f3f6f]{border:1px solid rgba(210,180,140,.255);padding:0 .3vw;border-bottom:1px solid rgba(0,0,0,.2);border-radius:1px}.row[data-v-466f3f6f],button[data-v-466f3f6f]{cursor:pointer;box-shadow:5px 10px 20px 0 #000}button[data-v-466f3f6f]{color:#db504a;background:rgba(0,0,0,.1);margin:0 5px 15px 10px;border:none;font-size:33px;font-family:Amatic SC,cursive;font-weight:800;width:120px;height:60px;border-radius:10px}.notes[data-v-466f3f6f]:first-child{color:red}.notes[data-v-466f3f6f]:nth-child(2){color:#ff0}.notes[data-v-466f3f6f]:nth-child(3){color:green}.notes[data-v-466f3f6f]:nth-child(4){color:orange}.notes[data-v-466f3f6f]:nth-child(5){color:violet}.notes[data-v-466f3f6f]:nth-child(6){color:#00f}.notes[data-v-466f3f6f]:nth-child(7){color:#00bfff}.notes[data-v-466f3f6f]:nth-child(8){color:maroon}.notes[data-v-466f3f6f]:nth-child(9){color:tan}#reset[data-v-466f3f6f]:hover:enabled{color:#000;background:orange;box-shadow:4px 6px 25px 5px orange}#play[data-v-466f3f6f]{color:green}#reset[data-v-466f3f6f]{color:orange}#play[data-v-466f3f6f]:hover:enabled{color:#000;background:green;box-shadow:4px 6px 25px 5px green}#stop[data-v-466f3f6f]{color:#000}#stop[data-v-466f3f6f]:hover:enabled{transition:all .95s}#stop[data-v-466f3f6f]:hover:enabled,button[data-v-466f3f6f]:hover:enabled{color:#fff;transform:scale(1.01);background:#db504a;box-shadow:4px 6px 25px 5px #db504a}button[data-v-466f3f6f]:hover:enabled{transition:all .75s}label[data-v-466f3f6f]{width:220px;color:#db504a;display:block;border-radius:10px;font-size:20px;font-weight:550}input[type=number][data-v-466f3f6f]{text-align:center;width:200px;border:3px solid transparent;border-radius:10px;background:rgba(0,0,0,.7);font-family:Shadows Into Light,cursive;font-size:20px;color:#db504a;box-shadow:1px 0 5px 0 #000;border:.4px solid rgba(210,180,140,.223)}input[type=number][data-v-466f3f6f]:focus,input[type=number][data-v-466f3f6f]:hover{outline:none;transform:scale(1.09);transition:all .9s;color:#db504a;font-weight:800}input[data-v-466f3f6f]::-webkit-inner-spin-button,input[data-v-466f3f6f]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.notes[data-v-466f3f6f]{padding:0 7px;font-weight:500}.row>span[data-v-466f3f6f]{visibility:hidden}.select[data-v-466f3f6f]{background:rgba(219,80,74,.2)!important}#playable>div.col-3.column[data-v-466f3f6f],#playable>div.col-7.column[data-v-466f3f6f],#playable>div.col-11.column[data-v-466f3f6f],#playable>div.col-15.column[data-v-466f3f6f],#playable>div.col-19.column[data-v-466f3f6f],#playable>div.col-23.column[data-v-466f3f6f],#playable>div.col-27.column[data-v-466f3f6f]{border-right:4px solid #000}[data-v-466f3f6f]::-moz-placeholder{color:rgba(219,80,74,.2)}[data-v-466f3f6f]:-ms-input-placeholder{color:rgba(219,80,74,.2)}[data-v-466f3f6f]::placeholder{color:rgba(219,80,74,.2)}

/* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!STYLE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */.audioControls[data-v-25009dda]{display:inline-flex;left:45pc;position:absolute;top:12pc;background-color:rgba(0,0,0,.01);border-radius:10px;width:65px;height:60px;overflow:hidden;box-shadow:5px 10px 20px 0 #000}h1[data-v-25009dda]{font-family:Shadows Into Light,cursive;font-size:35px;background:linear-gradient(#000,#0168f8,#a200f7,#f70000,#f89200,#f8f501);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:-15px}.ar-icon[data-v-25009dda]{width:40px;height:40px;border-radius:10px;margin:14px}.recorder-start[data-v-25009dda]{background:rgba(0,0,0,.1)}.recorder-start-error[data-v-25009dda]{background:grey}.recorder-stop[data-v-25009dda]{background:red;display:inline-flex;margin-right:20px;box-shadow:0 0 0 0 #ff5252;-webkit-animation:pulse-25009dda 1.5s infinite;animation:pulse-25009dda 1.5s infinite}@-webkit-keyframes pulse-25009dda{0%{transform:scale(.95);box-shadow:0 0 0 0 rgba(255,82,82,.7)}70%{transform:scale(1);box-shadow:0 0 0 10px hsla(0,0%,100%,0)}to{transform:scale(.95);box-shadow:0 0 0 0 hsla(0,0%,100%,0)}}@keyframes pulse-25009dda{0%{transform:scale(.95);box-shadow:0 0 0 0 rgba(255,82,82,.7)}70%{transform:scale(1);box-shadow:0 0 0 10px hsla(0,0%,100%,0)}to{transform:scale(.95);box-shadow:0 0 0 0 hsla(0,0%,100%,0)}}.audioTimer[data-v-25009dda]{background:#000;padding:0 2px;color:tan;font-size:58px;font-weight:700;margin:1px 5px 0 3px}.deleteAudio[data-v-25009dda]{background-color:#8b0000;display:inline;margin-left:20px;color:#fff;padding:5px;border-radius:10px;width:60px;height:60px;border:none;font-weight:700;font-size:30px}.deleteAudio[data-v-25009dda]:disabled{background-color:#db7093}.pointer[data-v-25009dda]{cursor:pointer}html{font-family:Shadows Into Light,cursive}body{background:rgba(0,0,0,.95);display:grid;overflow:auto;margin:20px}