#app,body,html{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#fff;background-color:#03030a;height:100%}h1{color:#36506f;font-weight:700;font-size:3em}h1.logo{color:#07101b;text-transform:uppercase}#nav{padding:30px}#nav a{font-weight:700;color:#2c3e50}#nav a.router-link-exact-active{color:#42b983}.btn,button{background-color:#07101b;cursor:pointer;color:#fff;font-family:Arial;font-size:12px;font-weight:700;padding:13px 32px;text-decoration:none}.btn:hover,button:hover{background-color:#0a1a2d}.btn:active,button:active{position:relative;top:1px}.amount{color:#555}.single__filter{padding:1em;-ms-flex-preferred-size:80px;flex-basis:80px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;margin:3px;font-size:.9em}.btn.single__filter-active{background-color:#333;color:#bbb}.single__filter-0{opacity:.3}.single__filter>span{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%}.single__filer .amount{display:inline-block;padding-left:.4em}.single__filter{border-bottom:2px solid #07101b}.color-lawngreen{border-color:#7cfc00}.color-darkgoldenrod{border-color:#b8860b}.color-grey{border-color:grey}.color-teal{border-color:teal}.color-firebrick{border-color:#b22222}.color-darkorange{border-color:#ff8c00}.color-darkblue{border-color:#00008b}.color-dodgerblue{border-color:#1e90ff}.filtergroup__container{-ms-flex-wrap:wrap;flex-wrap:wrap;padding:10px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.filter__header,.filtergroup__container{display:-webkit-box;display:-ms-flexbox;display:flex}.filter__header{width:100%;height:30px;-ms-flex-negative:0;flex-shrink:0;background-color:#0a1a2d;margin:3px;padding-top:7px}.filter__header strong{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.icon{margin:1px 5px;width:20px;-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0;background-size:20px;fill:#36506f}.filter__state-black{fill:#aaa}.filter__section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.sample__player{width:100%;height:100px}canvas{position:relative;top:10%;height:80%;width:100%}.line .line__wave .seek__clickarea{position:absolute;height:100%;width:100%}.line .line__wave .waveform__wrapper{width:calc(100% - 1px);height:100px;position:relative}.line .line__wave{background-color:#0a1a2d;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;position:relative}.line .line__wave .seek__progress{background-color:rgba(0,0,0,.8);border-right:1px solid #fff;position:absolute;width:0;height:100%}.btn.btn-random{font-size:2em;color:#fff;text-transform:uppercase;margin:20px 50px;display:block}.random{display:-webkit-box;display:-ms-flexbox;display:flex;height:calc(100% - 10px)}.random>div:first-child{max-width:50vw}.content{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}