*{box-sizing:border-box;height:inherit;list-style:none;margin:0;padding:0;text-decoration:none;-moz-user-select:none;-webkit-user-select:none;user-select:none;width:inherit}:active,:focus{outline:none}:disabled{cursor:default;text-shadow:none}::-webkit-slider-runnable-track,::-webkit-slider-thumb,button,input,label{-webkit-appearance:none;background:none;border:none;box-shadow:none;cursor:pointer;text-transform:uppercase}button,input{color:inherit}button{font-weight:600;text-align:center}html{font-size:62.5%;overflow:hidden}body,html{height:100%;width:100%}.ctrls,.ctrls--playing{background-color:#2e3148;background-image:linear-gradient(rgba(46,49,72,0) 65%,rgba(29,31,48,.5));display:flex;flex:0 0 90px;padding:5px 0 15px}.ctrl--btn--play,.ctrl--btn--play--playing,.ctrl--num,.ctrl--slider{display:flex;flex:0 0 36%;position:relative;z-index:1}.ctrl--num,.ctrl--slider{display:flex;flex:0 1 100%;flex-direction:row;flex-wrap:wrap;justify-content:flex-end}.ctrl--btn{flex:0 0 90px}.ctrl--btn,.ctrl--btn--play,.ctrl--btn--play--playing{-webkit-background-clip:text;background-clip:text;background-color:#ff540a;color:rgba(233,73,87,.25);display:block;font:600 45px/80px Roboto,sans-serif;letter-spacing:2px;text-shadow:0 -1px 0 rgba(192,198,242,.35),0 1px 0 rgba(22,23,29,.5)}.ctrl--btn--play--playing:disabled,.ctrl--btn--play:disabled,.ctrl--btn:disabled{background-color:#2e3148;color:rgba(233,73,87,.15);text-shadow:none}.ctrl--btn--play--playing:hover,.ctrl--btn--play:hover,.ctrl--btn:hover{color:rgba(233,73,87,.35);text-shadow:0 1px 3px rgba(33,34,44,.5),0 -1px 1px rgba(108,121,224,.5)}.ctrl--btn--play--playing:hover:disabled,.ctrl--btn--play:hover:disabled,.ctrl--btn:hover:disabled{color:rgba(233,73,87,.15);text-shadow:none}.ctrl__label{background-color:#2e3148;border-bottom-left-radius:5em .25em;border-bottom-right-radius:5em .25em;box-shadow:0 2px 0 0 rgba(25,28,52,.5),0 15px 12px -12px rgba(33,34,44,.35);color:#6c7193;flex:1 0 100%;font:600 10px/30px Roboto,sans-serif;height:30px;letter-spacing:1px;padding:0 1.2em;position:relative;text-shadow:0 2px 1px rgba(29,31,48,.35)}.ctrl__input,.ctrl__slider{background-color:#d6815c;border-bottom:2px solid rgba(251,132,81,.35);border-bottom-left-radius:5em .25em;border-bottom-right-radius:5em .25em;box-shadow:inset 0 -3px 3px -3px rgba(255,94,26,.25),0 2px 0 0 rgba(63,28,13,.25);color:hsla(0,0%,100%,.85);flex:0 1 100%;font-size:15px;font-weight:600;height:40px;letter-spacing:.5px;padding:0 42px 0 0;text-align:right}.ctrl__input:hover,.ctrl__slider:hover{color:#fff}.ctrl__slider::-webkit-slider-thumb{background-color:transparent;height:40px;width:10px}.ctrl__unit{align-self:flex-end;bottom:11px;color:rgba(239,240,245,.75);height:auto;letter-spacing:1px;padding-right:18px;position:absolute;text-align:right;text-transform:none}.part__list,.part__list--playing{background-color:#11163b;background-image:linear-gradient(to top left,rgba(19,236,211,0) 80%,#00e6cb),linear-gradient(12deg,rgba(85,104,246,0),#5568f6 75%,#3c4fdd 0);border-radius:1px;box-shadow:inset 0 -2px 3px 0 rgba(41,47,86,.15),inset 0 0 6px 0 rgba(41,47,86,.25);cursor:pointer;display:flex;flex:0 1 100%;height:auto;justify-content:space-around;padding:40px 10px 50px;position:relative;z-index:1}.part__list__item,.part__list__item--sel,.part__list__item--sel-off-1,.part__list__item--sel-off-2,.part__list__item--sel-off-3{background-clip:padding-box;border-bottom:2px solid rgba(169,174,214,.25);border-bottom-left-radius:4em 1em;border-bottom-right-radius:4em 1em;border-left:3px solid rgba(29,31,48,.15);border-right:3px solid rgba(29,31,48,.15);border-top-left-radius:1em 2em;border-top-right-radius:1em 2em;box-shadow:inset 0 -1px 2px 0 hsla(0,0%,100%,.5),0 1px 0 0 hsla(0,0%,100%,.5),0 6px 0 0 rgba(76,79,103,.1),0 32px 0 0 hsla(0,0%,100%,.35),0 36px 0 0 rgba(211,212,222,.35);flex:1 1 auto;height:auto;margin:0 .5%;position:relative;transition:flex-grow .5s;width:auto}.part__list__item--sel-off-1:before,.part__list__item--sel-off-2:before,.part__list__item--sel-off-3:before,.part__list__item--sel:before,.part__list__item:before{background-clip:content-box;background-color:rgba(239,240,245,.15);border-bottom:3px solid rgba(207,209,226,.35);border-bottom-width:4px;border-radius:50%;box-shadow:inset 0 0 1px 0 rgba(239,240,245,.75),0 -1px 6px -2px rgba(233,230,99,.95);content:"";height:4px;left:0;margin:0 auto;position:absolute;right:0;top:-3px;width:67%;z-index:0}.part__list__item--sel-off-1:after,.part__list__item--sel-off-2:after,.part__list__item--sel-off-3:after,.part__list__item--sel:after,.part__list__item:after{background-clip:padding-box;background-color:rgba(175,179,207,.05);border:3px solid rgba(112,116,149,.25);border-bottom-width:3px;border-radius:2px/3px;border-top-color:rgba(143,149,188,.25);border-bottom-color:rgba(45,55,134,.15);box-shadow:0 3px 6px -3px rgba(255,255,230,.5);content:"";height:3px;left:-3px;position:absolute;top:6px;width:100%;z-index:9}.part__list__item__id{-webkit-background-clip:text;background-clip:text;background-color:#1b9889;bottom:-42px;color:rgba(64,79,191,.5);font-size:12px;letter-spacing:0;left:0;line-height:36px;margin:0 auto;right:0;position:absolute;text-align:center;text-shadow:0 1px 0 rgba(196,212,210,.5),0 -1px 0 rgba(54,73,71,.5);width:inherit;z-index:1}.part__list--playing{background-color:#fffd70;background-image:linear-gradient(to top right,rgba(19,236,211,0) 50%,#00e6cb),linear-gradient(12deg,rgba(85,104,246,0),#5568f6 75%,#3c4fdd 0);box-shadow:inset 0 2px 3px 0 rgba(204,210,255,.95);cursor:default}.part__list--playing .part__list__item,.part__list--playing .part__list__item--sel,.part__list--playing .part__list__item--sel-off-1,.part__list--playing .part__list__item--sel-off-2,.part__list--playing .part__list__item--sel-off-3{box-shadow:inset 0 -1px 2px 0 hsla(0,0%,100%,.5),0 1px 0 0 hsla(0,0%,100%,.5),0 6px 0 0 rgba(76,79,103,.1),0 12px 0 0 hsla(0,0%,100%,.2),0 14px 0 0 rgba(76,79,103,.0435),0 32px 0 0 hsla(0,0%,100%,.65),0 36px 0 0 hsla(230,5%,75%,.5),0 36px 0 -1px rgba(45,64,210,.75)}.part__list--playing .part__list__item__id{background-color:#fffd70;color:transparent;text-shadow:0 -1px 0 rgba(9,170,151,.5),0 1px 1px rgba(179,230,224,.5)}.ctrls--playing{background-color:#1b9889;background-image:linear-gradient(rgba(27,152,137,0) 65%,rgba(38,115,106,.65))}.ctrls--playing .ctrl--num,.ctrls--playing .ctrl--slider{border-bottom-left-radius:5em .25em;border-bottom-right-radius:5em .25em}.ctrls--playing .ctrl--btn,.ctrls--playing .ctrl--btn--play--playing{-webkit-background-clip:text;background-clip:text;background-color:rgba(103,228,214,.75);color:rgba(27,152,137,.35);display:block;font:600 45px/80px Roboto,sans-serif;letter-spacing:2px;text-shadow:0 -1px 0 rgba(240,244,244,.5),0 1px 3px rgba(87,117,114,.5)}.ctrls--playing .ctrl--btn--play--playing:disabled,.ctrls--playing .ctrl--btn:disabled{text-shadow:none}.ctrls--playing .ctrl--btn--play--playing:hover,.ctrls--playing .ctrl--btn:hover{color:transparent}.ctrls--playing .ctrl--btn--play--playing:hover:disabled,.ctrls--playing .ctrl--btn:hover:disabled{color:rgba(27,152,137,.35);text-shadow:none}.ctrls--playing .ctrl__label{background-color:#1b9889;border-bottom-left-radius:5em .25em;border-bottom-right-radius:5em .25em;box-shadow:0 2px 0 0 rgba(41,86,81,.25),0 9px 18px -12px rgba(33,44,43,.5);color:#fff;text-shadow:0 1px 1px rgba(31,122,112,.35)}.ctrls--playing .ctrl__input,.ctrls--playing .ctrl__slider{background-color:#1b7e78;border-bottom:2px solid rgba(27,152,143,.75);border-bottom-left-radius:5em .25em;border-bottom-right-radius:5em .25em;box-shadow:inset 0 -3px 6px -3px rgba(99,233,217,.1),inset 0 0 3px 0 rgba(10,67,60,.65),0 2px 1px -1px rgba(33,69,65,.15)}.ctrls--playing .ctrl__unit{color:rgba(182,201,199,.75)}.part__list__item--sel{flex-grow:8;flex-shrink:0;transition:flex-grow .4s ease-out}.part__list__item--sel-off-1{flex-grow:5;flex-shrink:0;transition:flex-grow .25s ease-out}.part__list__item--sel-off-2{flex-grow:3;flex-shrink:0;transition:flex-grow .15s ease-out}.part__list__item--sel-off-3{flex-grow:2;flex-shrink:0;transition:flex-grow .1s ease-out}body{font:600 1em/1.5 Roboto,sans-serif}.synth__title{background-image:linear-gradient(hsla(0,0%,100%,.35) 75%,hsla(0,0%,100%,.45));box-shadow:0 1px 3px 0 rgba(46,49,72,.15);color:#fff;font-size:1.2em;height:auto;letter-spacing:.1em;line-height:2.4em;padding:0 2vw;position:fixed;text-shadow:0 1px 0 rgba(51,54,77,.15),0 0 12px rgba(31,32,46,.15);text-transform:uppercase;z-index:9}.synth{display:flex;flex-direction:column}
/*# sourceMappingURL=styles.css.map*/