/**
 * @author Florian Kapaun <mail@florian-kapaun.de>
 */
*,:after,:before{margin:0;padding:0;box-sizing:border-box}html{line-height:1.15;-webkit-text-size-adjust:100%}a{background-color:transparent}img{display:block;border-style:none}@font-face{font-family:IBMPlexSans-Regular;src:url(../fonts/IBMPlexSans-Regular.ttf) format('truetype')}html{height:100%}body{height:100%;font-family:IBMPlexSans-Regular,sans-serif;font-size:115%;line-height:1.45}body#normal{margin:10px}#app{display:flex;flex-direction:column;justify-content:space-between;min-height:100%;transition:.2s cubic-bezier(0,0,.2,1)}footer,header{font-size:.7em;margin:10px;clear:both}footer .right,header .right{float:right}header{position:relative}header .download-info{display:inline-block;max-width:200px}main{position:relative}p{margin:1em 0}a{color:inherit}a:hover{opacity:.7}.opaque span{opacity:.65}.opaque a{opacity:.65}.opaque a:hover{opacity:1}#categories{font-size:3em;text-align:center;line-height:1;list-style:none}#categories li{position:relative;width:80%;max-width:575px;margin-left:auto;margin-right:auto}#categories li .li-wrapper{position:relative;margin:.25em 0}#categories li .li-wrapper .audio-wrapper{position:absolute;left:0;top:0;right:0;bottom:0;display:flex;flex-direction:row;flex-wrap:nowrap;background-color:#000;z-index:99;cursor:pointer}#categories li .li-wrapper .audio-wrapper .audio-visualizer{width:100%;background-color:#000;outline:1px solid #000}#categories li .li-wrapper .audio-wrapper .audio-visualizer.run-animation{animation:show-progress}#categories li .category{display:inline-block;position:relative;text-transform:capitalize;text-decoration:none;color:#fff;transition:.2s cubic-bezier(0,0,.2,1);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#categories li .category .gif-wrapper{position:absolute;left:0;top:0;right:0;bottom:0;display:flex;flex-direction:row;flex-wrap:nowrap;z-index:99;cursor:pointer}#categories li .category .gif-wrapper .gif-visualizer{display:none;width:100%}#categories li .category .gif-wrapper .gif-visualizer:hover{background-color:rgba(255,255,255,.15)}#categories:hover .category{opacity:.3;z-index:1}#categories:hover .category:hover{opacity:1}@supports (font-size:11vh){#categories{font-size:11vh!important}#categories li .li-wrapper{margin:.3em 0!important}}#audio-files{display:none}#gifs{position:absolute;top:0;left:0;width:100%;height:100%}#gifs .gif{display:none}#gifs .gif.visible{display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-width:100%;max-height:100%;z-index:0}#enable-audio-play{display:none}#enable-audio{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.85);transition:.2s cubic-bezier(0,0,.2,1);z-index:999}#enable-audio .wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:450px}#enable-audio .wrapper #start-screen{margin:20px;padding:30px;background-color:#fff}#enable-audio .wrapper #start-screen .button{display:inline-block;margin:.5em 0;padding:.5em 1.5em .6em;color:#fff;background-color:red;border-radius:.15em;transition:.1s cubic-bezier(0,0,.2,1);cursor:pointer}#enable-audio .wrapper #start-screen .button:hover{background-color:#c00}#enable-audio.fade-out{opacity:0;z-index:-1}#mode-toggle{display:none}#mode-toggle:checked+#app{color:#fff;background-color:#000}#mode-toggle:checked+#app #categories li .audio-wrapper{opacity:0;z-index:-1}#mode-toggle:checked+#app #categories li .category .gif-wrapper .gif-visualizer{display:block}#mode-toggle:checked+#app header .switch:before{content:'visual';bottom:0}#mode-toggle:checked+#app header .slider:before{-webkit-transform:translateY(26px);-ms-transform:translateY(26px);transform:translateY(26px)}#mode-toggle:focus+#app header .slider{box-shadow:0 0 1px #2196f3}.switch{position:relative;display:inline-block;width:34px;height:60px;margin-left:53px;float:right}.switch:before{content:'audio';display:block;position:absolute;right:100%;margin:10px;transition:none}.switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#333;-webkit-transition:.1s cubic-bezier(0,0,.2,1);transition:.1s cubic-bezier(0,0,.2,1);border-radius:34px}.switch .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;top:4px;background-color:#eaeaea;-webkit-transition:.1s cubic-bezier(0,0,.2,1);transition:.1s cubic-bezier(0,0,.2,1);border-radius:50%}@keyframes show-progress{0%{background-color:#000}1%{background-color:#fff}100%{background-color:#000}}@media (min-width:600px){#categories{font-size:3.5em}#categories li .li-wrapper{margin:.5em 0}}
