*{box-sizing:border-box;padding:0}*,body{margin:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}::-webkit-scrollbar{display:none}.App{display:flex;height:100vh;overflow:hidden;position:relative;width:100%}.background{background:url(/static/media/background.4d24370736ed492572d4.jpg) no-repeat 50%;background-size:cover;bottom:0;-webkit-filter:grayscale(100);filter:grayscale(100);left:0;position:absolute;right:0;top:0;z-index:-1}.leftMenu{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(34,34,34,.6);height:100%;min-height:100vh;overflow:hidden;padding:20px 15px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);width:280px;z-index:1}.leftMenu .logoContainer{color:#f1f1f1;display:flex;justify-content:space-between}.leftMenu .logoContainer i{font-size:30px}.leftMenu .logoContainer h2,.leftMenu .logoContainer i:nth-child(3){font-size:20px}.searchBox{border-radius:10px;box-shadow:0 0 20px rgba(0,0,0,.4);color:#848484;height:45px;margin-top:20px;overflow:hidden;position:relative;width:100%}.searchBox input{background:rgba(0,0,0,.4);border:none;color:#f1f1f1;font-size:14px;font-weight:700;height:100%;outline:none;padding-left:45px;width:100%}.searchBox .searchIcon{color:#848484;font-size:20px;height:45px;left:0;line-height:45px;position:absolute;text-align:center;top:0;width:45px}@media screen and (max-width:550px){.leftMenu{min-width:64px;width:64px}.leftMenu .MenuContainer ul li a span,.leftMenu .playlistContainer,.leftMenu .searchBox,.leftMenu .trackList{display:none}.leftMenu .MenuContainer ul li a i{font-size:26px}.leftMenu .MenuContainer ul li{margin:25px 0}.leftMenu .logoContainer h2{margin-left:20px}}.MenuContainer{margin:15px 0}.MenuContainer .title{color:#848484;font-size:12px;font-weight:700;margin-bottom:10px;text-transform:uppercase}.MenuContainer ul{padding:0;width:100%}.MenuContainer ul li{list-style:none;margin:5px 0;padding:5px 0;position:relative;width:100%}.MenuContainer ul li a{align-items:center;color:#848484;display:flex;font-size:16px;text-decoration:none}.MenuContainer ul li a i{font-size:18px;margin-right:15px}.MenuContainer ul li:before{background:#49e12e;border-radius:5px;content:"";height:100%;left:-15px;position:absolute;top:0;width:0}.MenuContainer ul li.active:before,.MenuContainer ul li:hover:before{transition:.3s;width:5px}.MenuContainer ul li.active a,.MenuContainer ul li:hover a{color:#f1f1f1;transition:.3s}.playlistContainer{cursor:pointer;margin:15px 0}.playlistContainer .listTop{align-items:center;color:#848484;display:flex;justify-content:space-between;margin-bottom:10px}.playlistContainer .listTop p{color:#848484;font-size:12px;font-weight:700;text-transform:uppercase}.playlistContainer .listTop i{color:#f1f1f1;cursor:pointer}.playlistContainer .playListScroll{height:100px;overflow-x:hidden;overflow-y:scroll;position:relative}.playlistContainer .playListScroll .playlist{align-items:center;color:#848484;display:flex;margin-bottom:10px}.playlistContainer .playListScroll .playlist:hover{color:#f1f1f1;cursor:pointer;transition:.3s}.playlistContainer .playListScroll .playlist i{font-size:18px}.playlistContainer .playListScroll .playlist .list{margin-right:15px}.playlistContainer .playListScroll .playlist .trash{margin-left:auto}.playlistContainer .playListScroll .playlist p{display:inline;font-size:16px;overflow:hidden;text-overflow:ellipsis}.trackList{border-top:1px solid hsla(0,0%,100%,.1);padding-top:20px}.trackList .top{align-items:center;display:flex}.trackList .top img{width:50px!important}.trackList .top .trackName{color:#f1f1f1;font-size:14px;margin-left:10px}.trackList .top .trackName .trackSpan{color:#848484;display:block;font-size:12px}.trackList .bottom{align-items:center;color:#848484;display:flex;justify-content:space-between;margin-top:20px}.trackList .bottom i{font-size:18px}.trackList .bottom i:hover{color:#f1f1f1;cursor:pointer;transition:.3s}.trackList .bottom input{-webkit-appearance:none;appearance:none;background:hsla(0,0%,100%,.1);border:none;border-radius:10px;height:5px;position:relative}.trackList .bottom input:before{background:#49e12e;border-radius:10px;content:"";height:100%;left:0;position:absolute;top:0;transition:width .25s linear;width:50%;z-index:2}.trackList .bottom input::-webkit-slider-thumb{-webkit-appearance:none;background:#f1f1f1;border:2px solid #000;border-radius:10px;box-sizing:border-box;cursor:pointer;height:20px;margin:-2px 0 0;position:relative;-webkit-transition:width .25s linear;transition:width .25s linear;width:10px;z-index:3}.trackList .bottom input::-moz-progress-bar,.trackList .bottom input::-moz-range-thumb{background:#49e12e;border-radius:10px;height:100%;-moz-transition:width .25s linear;transition:width .25s linear;width:50%;z-index:2}.mainContainer{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(34,34,34,.6);flex-grow:1;height:100vh;z-index:1}.menuList{background:#2c2c2c;justify-content:space-between;padding:15px 25px}.menuList,.menuList ul{align-items:center;display:flex}.menuList ul li{list-style:none;margin:0 20px;position:relative}.menuList ul li a{color:#848484;font-size:14px;font-weight:700;text-decoration:none}.menuList ul li:before{background:#f1f1f1;border-radius:5px;bottom:-20px;content:"";height:5px;left:10px;position:absolute;width:0}.menuList ul li.active:before,.menuList ul li:hover:before{transition:width .3s cubic-bezier(.175,.885,.32,1.275);width:20px}.menuList ul li .active a,.menuList ul li:hover a{color:#f1f1f1;transition:.3s}.menuList p{color:#f1f1f1;font-size:14px}.menuList p i{font-size:12px;margin-right:6px}.menuList p span{color:#848484;font-size:12px;margin-left:6px;text-align:center}@media screen and (max-width:550px){.mainContainer{min-width:380px}.content{padding:10px 15px}.content .breadCrump{font-size:12px}.banner .content .artist .left .name h2{font-size:25px}.banner .content .artist .right a{font-size:12px;margin:0 10px;padding:5px 15px}}.banner{height:300px;position:relative}.banner .bannerImg{-webkit-filter:grayscale(100);filter:grayscale(100);height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.banner .content{bottom:0;color:#f1f1f1;display:flex;flex-direction:column;left:0;padding:20px 30px;position:absolute;right:0;top:0;z-index:3}.banner .content .breadCrump{align-items:center;display:flex;justify-content:space-between}.banner .content .breadCrumb p{color:#848484;font-size:14px;font-weight:700;letter-spacing:1px}.banner .content .breadCrump i{cursor:pointer;font-size:18px}.banner .content .breadCrumb p span{color:#f1f1f1}.banner .bottomLayer{background-image:linear-gradient(transparent);bottom:0;height:5rem;left:0;position:absolute;width:100%}.banner .content .artist{color:#f1f1f1;display:flex;justify-content:space-between;margin-top:auto}.banner .content .artist .left .name{align-items:center;display:flex}.banner .content .artist .left .name h2{font-size:50px}.banner .content .artist .left .name img{margin-left:10px;width:30px}.banner .content .artist .left p{font-size:14px}.banner .content .artist .left p i{margin-right:6px}.banner .content .artist .left p span{color:#848484;margin-left:5px}.banner .content .artist .right{align-items:center;display:flex}.banner .content .artist .right a{align-items:center;border-radius:100vh;color:#f1f1f1;display:flex;font-size:16px;font-weight:700;margin:0 15px;padding:10px 30px;text-align:center;text-decoration:none}.banner .content .artist .right a i{font-size:12px;margin-right:10px}.banner .content .artist .right a:first-child{background:#39aa24;margin-left:0}.banner .content .artist .right a:nth-child(2){background:rgba(0,0,0,.3);border:1px solid hsla(0,0%,100%,.1);margin-right:0}.banner .content .artist .right a:hover{box-shadow:0 13px 27px -5px rgba(50,50,93,.25),0 8px 16px -8px rgba(0,0,0,.3)}.audioList{padding:10px 30px}.audioList .title{color:#f1f1f1;font-size:18px}.audioList .title span{color:#848484;font-size:12px}.songsContainer{height:220px;overflow-x:hidden;overflow-y:scroll}.songs{align-items:center;color:#848484;cursor:pointer;display:flex;font-size:14px;font-weight:600;margin:10px;padding:5px;width:100%}.songs.active,.songs:hover{color:#f1f1f1;transition:.3s}.count{margin-right:10px}.song{align-items:center;border-bottom:1px solid hsla(0,0%,100%,.1);display:flex;padding-bottom:5px;width:100%}.song .imgBox{background:#555;border-radius:.5em;height:45px;margin-right:10px;min-width:45px;overflow:hidden;width:45px}.song .imgBox img{height:100%;object-fit:cover;width:100%}.song .section{width:100%}.song .section,.song .section .songName{align-items:center;display:flex;justify-content:space-between}.song .section .songName{width:50%}.song .section .hits{align-items:center;display:flex;justify-content:space-between}.song .section .hits .duration,.song .section .hits .hit{margin-right:15px}.song .section .hits .duration i,.song .section .hits .hit i{font-size:12px;margin-right:5px}.song .section .hits .favorite{margin-right:10px}.song .section .hits .favorite i{color:#49e12e;-webkit-filter:drop-shadow(0 0 4px #49e12e);filter:drop-shadow(0 0 4px #49e12e)}.musicPlayer{display:flex;padding:10px;width:100%}.songImg{border-radius:10px;box-shadow:0 0 20px rgba(0,0,0,.4);height:80px;min-height:120px;overflow:hidden;width:120px}.songImg img{height:100%;object-fit:cover;width:100%}.songAtr{flex-direction:column;justify-content:center;padding-left:20px}.songAtr,.songAtr .bottom,.songAtr .top{align-items:center;display:flex;width:100%}.songAtr .bottom,.songAtr .top{justify-content:space-between}.songAtr .top .left,.songAtr .top .middle,.songAtr .top .right{align-items:center;color:#595959;cursor:pointer;display:flex;font-size:16px}.songAtr .top .left i,.songAtr .top .middle i,.songAtr .top .right i{margin:0 15px}.songAtr .top .left .likeSong i{color:#49e12e;-webkit-filter:drop-shadow(0 0 4px #49e12e);filter:drop-shadow(0 0 4px #49e12e)}.songAtr .top .middle .back i:nth-child(2),.songAtr .top .middle .forward i:first-child{color:#9a9a9a}.songAtr .top .middle .playPause{align-items:center;background:#f1f1f1;border-radius:100%;color:#000;display:flex;height:30px;justify-content:center;min-width:30px;width:30px}.songAtr .bottom{margin-top:20px;padding:0 15px}.songAtr .bottom .progressBar{-webkit-appearance:none;appearance:none;background:hsla(0,0%,100%,.1);border:none;border-radius:10px;cursor:pointer;height:5px;outline:none;position:relative;width:70%}.songAtr .bottom .progressBar:before{background:#848484;border-radius:10px;content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;transition:all .3s ease;width:var(--player-played);z-index:2}.songAtr .bottom .progressBar::-webkit-slider-thumb{-webkit-appearance:none;border:none;border-radius:50%;cursor:pointer;height:15px;outline:none;width:15px}.songAtr .bottom .progressBar::-moz-range-track{appearance:none;background:hsla(0,0%,100%,.1);border:none;border-radius:10px;cursor:pointer;height:5px;outline:none;width:78%}.songAtr .bottom .progressBar::-moz-range-progress{background:#848484;border-radius:10px;cursor:pointer;height:100%;-moz-transition:all .3s ease;transition:all .3s ease;width:var(--player-played);z-index:2}.songAtr .bottom .progressBar::-moz-range-thumb{-webkit-appearance:none;border:none;border-radius:50%;cursor:pointer;height:15px;outline:none;width:15px}.songAtr .bottom .currentTime,.songAtr .bottom .duration{color:#f1f1f1;font-size:12px;font-weight:700}.rightMenu{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(34,34,34,.6);border-left:1px solid hsla(0,0%,100%,.1);height:100vh;min-width:100px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);width:100px;z-index:1}
/*# sourceMappingURL=main.755572ea.css.map*/