body,html{margin:0;padding:0;background-repeat:no-repeat}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-wrapper{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;-webkit-backface-visibility:hidden;backface-visibility:hidden;flex-direction:column;max-height:100vh;min-height:100vh;max-width:100%}.app-wrapper,.player-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column}.player-wrapper{height:100vh;width:100%;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.container-background{z-index:1;top:-35px;left:-35px;right:-35px;bottom:-35px;position:fixed;-webkit-filter:blur(35px);filter:blur(35px);background-size:cover;background-attachment:fixed;background-position:50%;background-repeat:no-repeat}.container-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2;background-color:hsla(0,0%,100%,.45)}@-webkit-keyframes rotateAlbum{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotateAlbum{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.container-player{z-index:3;width:430px;height:100px;position:relative}.container-player-main{position:relative;height:inherit;background-color:#fff;-webkit-box-shadow:0 30px 80px #656565;box-shadow:0 30px 80px #656565;border-radius:15px;z-index:2}.container-music-info{position:absolute;top:0;right:15px;left:15px;padding:13px 22px 15px 184px;background-color:#fff7f7;border-radius:15px 15px 0 0;-webkit-transition:top .3s ease;transition:top .3s ease;z-index:1}.container-music-name{color:#54576f;font-size:17px;font-weight:700}.container-artist-name,.container-music-name{-ms-flex-wrap:nowrap;flex-wrap:nowrap;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.container-artist-name{color:#acaebd;font-size:13px;margin:2px 0 8px 0}.container-music-time{height:12px;margin-bottom:3px;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.container-music-current-time,.container-music-duration{color:#f86d92;font-size:11px;background-color:transparent;border-radius:10px;-webkit-transition:all .3s ease;transition:all .3s ease}.container-music-duration-flow{position:relative;height:4px;border-radius:4px;background-color:#ffe8ee;cursor:pointer}.container-music-instant-time{background-color:#3b3d50;position:absolute;top:-29px;color:#fff;font-size:12px;white-space:pre;padding:5px 6px;border-radius:4px;display:none}.container-control-hover{position:absolute;top:0;bottom:0;left:0;opacity:.2;z-index:2;background-color:#3b3d50}.container-music-active-bar{content:"";position:absolute;top:0;bottom:0;left:0;width:0;background-color:#fd6d94;-webkit-transition:width .2s ease;transition:width .2s ease;z-index:1;height:4px;border-radius:4px}.active.container-music-info{top:-92px}.container-album{position:absolute;top:-40px;width:115px;height:115px;margin-left:40px;-webkit-transform:rotate(0);transform:rotate(0);-webkit-transition:all .3s ease;transition:all .3s ease;-webkit-box-shadow:0 0 0 10px #fff;box-shadow:0 0 0 10px #fff;border-radius:50%;overflow:hidden}.container-album:before{content:"";position:absolute;top:50%;right:0;left:0;width:20px;height:20px;margin:-10px auto 0 auto;background-color:#d6dee7;border-radius:50%;-webkit-box-shadow:inset 0 0 0 2px #fff;box-shadow:inset 0 0 0 2px #fff;z-index:2}.container-album.active{top:-60px;-webkit-box-shadow:0 0 0 4px #fff7f7,0 30px 50px -15px #afb7c1;box-shadow:0 0 0 4px #fff7f7,0 30px 50px -15px #afb7c1}.container-dot{position:absolute;top:50%;right:0;left:0;height:13px;color:#1f1f1f;font-size:13px;font-family:Helvetica,serif;text-align:center;font-weight:700;line-height:1;padding:6px;margin:-12px auto 0 auto;background-color:hsla(0,0%,100%,.19);opacity:0;z-index:2;-webkit-transition:all .1s linear;transition:all .1s linear}.container-music-image{display:block;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;opacity:1}.container-music-image.active{z-index:1;-webkit-animation:rotateAlbum 3s linear 0s infinite forwards;animation:rotateAlbum 3s linear 0s infinite forwards}.container-controls{width:250px;height:100%;margin:0 5px 0 141px;float:right;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around}.control-btn .control-btn i{-webkit-transition:all .2s ease;transition:all .2s ease}.control-btn{width:26px;height:26px;padding:25px;display:block;color:#d6dee7;text-align:center;line-height:1;font-size:26px;-webkit-transition:all .3s ease;transition:all .3s ease;cursor:pointer;border-radius:5px}.control-btn:hover{color:#fff;background-color:#d6d6de}@media screen and (max-width:640px){.container-player{width:350px}.container-controls{width:225px}.container-album{width:100px;height:100px;top:-20px;margin-left:25px}.container-album.active{top:-45px}.container-music-info{padding-left:125px}}