.range{position:relative;height:4px;margin:10px 0;border-radius:2px}.range,.range>span{background-color:#fff}.range>span{display:block;position:absolute;z-index:8;left:0;width:12px;height:12px;margin-top:-4px;margin-left:-6px;border-radius:50%;cursor:pointer}.range>span:hover{width:16px;height:16px;margin-top:-6px;margin-left:-8px}.page{-webkit-user-select:none;-moz-user-select:none;user-select:none}.bg,.page{width:100%;height:100%}.bg{z-index:1;top:0;left:0}.bg,.hidden{position:absolute}.hidden{top:-100vh}.main{position:relative;z-index:2;width:100%;height:100%}.menu{position:fixed;top:50%;left:50%;width:240px;height:240px;margin-top:-120px;margin-left:-120px;transition:opacity .18s ease-in;transform:rotate(45deg)}.menu.visible{opacity:1}.menu.visible .line1,.menu.visible .line2{transform:translateX(0)}.menu.visible .line3,.menu.visible .line4{transform:rotate(90deg) translateX(0)}.menu .row{display:flex;width:100%;height:80px}.menu .col{flex:1 1;width:80px;height:80px;text-align:center}.menu .icon{display:block;width:40px;height:40px;margin:20px;cursor:pointer;transform:rotate(-45deg);background-repeat:no-repeat;background-position:50%;background-size:40px}.menu .icon-volume{background-image:url(/icons/unmute.png);background-size:36px}.menu .icon-volume.muted{background-image:url(/icons/mute.png)}.menu .icon-list{background-image:url(/icons/menu.svg)}.menu .icon-timer{background-image:url(/icons/timer.png)}.menu .icon-timer.active{display:none}.menu .icon-exit{background-image:url(/icons/exit.svg);background-size:36px}.logo{display:block;width:72px;height:72px;margin:4px;background-image:url(/icons/logo.svg);background-size:72px;transform:rotate(-45deg);cursor:pointer}.line-group>div{position:absolute;width:240px;height:1px;transition:transform .2s ease-in;transition-delay:.3s;background-color:#fff}.line-group .line1{top:80px;transform:translateX(200px)}.line-group .line2{top:160px;transform:translateX(-200px)}.line-group .line3{top:120px;left:-40px;transform:rotate(90deg) translateX(-200px)}.line-group .line4{top:120px;left:40px;transform:rotate(90deg) translateX(200px)}.timer{position:relative;top:20px;font-family:Monaco,Consolas,monospace;font-size:20px;line-height:40px;text-align:center;color:#fff;transform:rotate(-45deg)}.timer.visible{display:block;opacity:.8}.whitenoise{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background-color:rgba(0,0,0,.3)}.sound-list{display:flex;flex-wrap:wrap;margin-left:5%;margin-right:5%}.sound-list li{display:flex;justify-content:center;width:33.33%;margin:10px 0;padding:0;list-style:none;color:#fff;text-align:center}.sound-list .title{height:24px;line-height:24px}.sound-list .icon{display:inline-block;width:60px;height:60px;margin-left:10px;margin-right:10px;background-image:url(/icons/icon-sprite.png);background-repeat:no-repeat;background-size:720px 60px;cursor:pointer}.icon-rain{background-position:0 0}.icon-thunder{background-position:-540px 0}.icon-farm{background-position:-660px 0}.icon-night{background-position:-360px 0}.icon-forest{background-position:-60px 0}.icon-leaves{background-position:-120px 0}.icon-river{background-position:-180px 0}.icon-fire{background-position:-240px 0}.icon-seaside{background-position:-600px 0}.icon-yacht{background-position:-420px 0}.icon-coffee{background-position:-300px 0}.icon-train{background-position:-480px 0}.close{position:fixed;left:50%;bottom:40px;width:24px;height:24px;margin-left:-16px;text-align:center;background-image:url(/icons/close.svg);background-repeat:no-repeat;background-position:50%;background-size:24px;cursor:pointer}.close span{position:relative;top:24px;font-size:12px;color:#fff}.setting{position:fixed;z-index:10;top:12px;right:12px;display:block;width:32px;height:32px;transition:transform .3s ease;transition-delay:.3s;border-radius:50%;background-color:rgba(0,0,0,.3);background-image:url(/icons/setup.svg);background-repeat:no-repeat;background-position:50%;background-size:24px;cursor:pointer}.fade-enter{opacity:0}.fade-enter-active{opacity:1;transition:opacity .3s}.fade-exit{opacity:1}.fade-exit-active{opacity:0;transition:opacity .3s}