body{font-family:"Roboto","sans-serif","Arial";font-size:14px;color:#aaa}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{border-radius:4px;background:#424242}.search{box-sizing:border-box;padding:3px 29px;width:195px;font-size:14px;letter-spacing:.2px;line-height:16px;border:none;border-radius:15px;background:url(../media/search.9be65d5c.svg) left 5px top 1.5px no-repeat;background-size:19px;background-color:#fff}.search:focus{outline:none}@media screen and (max-width:650px){.search{width:64%;margin-bottom:2px}}.user{width:300px;padding-right:10px;display:flex;justify-content:space-between;align-items:center}.user__button{height:18px;cursor:pointer;fill:#aaa}.user__button:hover{fill:#fff}.user__info{display:flex;justify-content:space-between;align-items:center}.user__info-image{width:30px;margin-right:5px;border-radius:50%}.user__menu-button{width:30px;height:30px;fill:#aaa;cursor:pointer}.user__menu-button:hover{fill:#fff}@media screen and (max-width:770px){.user{width:40%}}@media screen and (max-width:650px){.user{width:100%;height:65px;justify-content:space-around}.user__button{width:20px;height:20px}}.user-menu{top:73px;right:10px;position:absolute;padding:0;list-style-type:none}.user-menu__item{box-sizing:border-box;background-color:#282828;padding:10px;width:160px;transition:background-color .2s}.user-menu__item:hover{background-color:#aaa;color:#c8c8c8}.user-menu__link{display:block;padding:3px 20px;line-height:1.4;color:inherit;text-decoration:none}.user-menu_open{display:block}.user-menu:before{display:block;top:-17px;right:2px;position:absolute;transform:rotateX(60deg);content:"▲";color:#282828;font-size:28px;z-index:-5}@media screen and (max-width:650px){.user-menu{top:110px;right:10%}}.top-bar{box-sizing:border-box;background-color:#282828;padding:0 10px;top:0;height:60px;position:fixed;width:100%;border-bottom:1px solid #181818;z-index:10}.top-bar,.top-bar__nav-buttons{display:flex;justify-content:space-between;align-items:center}.top-bar__nav-buttons{width:76px;padding-right:10px}.top-bar__nav-arrow{padding:5px;height:28px;width:28px;float:left;fill:#5e5e5e}.top-bar__nav-arrow_active{fill:#aaa}.top-bar__nav-arrow_active:hover{fill:#fff}.top-bar__nav{box-sizing:border-box;width:285px;display:flex;justify-content:space-between;align-items:center}@media screen and (max-width:770px){.top-bar{position:relative}}@media screen and (max-width:650px){.top-bar{height:100px;display:block}.top-bar__nav{width:100%;height:35px;align-items:flex-end;justify-content:flex-start}.top-bar__nav-arrow{padding:0}.top-bar__nav-buttons{width:64px;margin-right:calc(18% - 64px)}}.friends-bar{position:fixed;right:0;top:60px;width:15%;box-sizing:border-box;background-color:#181818;height:calc(100vh - 122px);overflow-y:scroll;padding-bottom:15px}.friends-bar__list{padding:0;margin:0 0 17px;list-style-type:none}.friends-bar .text-button{margin:0 auto}@media screen and (max-width:1400px){.friends-bar{display:none}}.friend__link{box-sizing:border-box;display:inline-block;padding:17px 10px;width:100%;color:inherit;text-decoration:none;line-height:26px}.friend__link:hover{color:#c8c8c8;text-decoration:underline}.friend__link:hover .friends-bar__icon{fill:#c8c8c8}.friend__icon{width:23px;padding-right:10px;float:left;fill:#aaa}.text-button{padding:7px 15px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-size:11px;font-weight:500;letter-spacing:1px;text-transform:uppercase;display:block;border-radius:20px;cursor:pointer}.text-button_transparent{color:#c8c8c8;background-color:transparent;border:1px solid #c8c8c8}.text-button_transparent:hover{color:#fff;border-color:#fff}.text-button_green{background-color:#1ed760;border:1px solid #1ed760;color:#fff}.text-button_green:hover{background-color:#43e57d}.text-button_green-border:hover{border-color:#43e57d}.text-button:focus{outline:none}.main{width:70%;height:calc(100vh - 122px);position:relative;left:15%;top:60px;background-color:#181818;z-index:0}.main__content{overflow-y:scroll;height:100%}@media screen and (max-width:1400px){.main{width:80%;left:20%}}@media screen and (max-width:770px){.main{width:100%;left:auto;top:auto;height:auto}.main__content{overflow:auto}}.artist-bar{position:relative;width:100%;height:320px;overflow:hidden;background-color:#181818}.artist-bar__back{position:absolute;min-height:100%;min-width:100%;left:50%;transform:translateX(-50%);opacity:.15}.artist-bar__info{box-sizing:border-box;position:absolute;padding:15px;bottom:60px;width:80%}.artist-bar__image{height:150px;border-radius:50%}.artist-bar__image-container{margin-right:15px;float:left;position:relative}.artist-bar__image-container:after{content:"✔";position:absolute;top:125px;right:25px;box-sizing:border-box;padding:5px 6px;height:20px;width:20px;color:#fff;font-size:9px;border-radius:50%;background:#4888d7;background-size:contain}.artist-bar__title{margin:45px 0 0;text-transform:uppercase;font-size:11px;letter-spacing:1px}.artist-bar__name{margin:10px 0 15px;font-size:36px;font-weight:300;color:#fff}.artist-bar .text-button{margin-right:10px;float:left}.artist-bar__listeners{position:absolute;right:0;width:20%;margin:0;bottom:60px;padding:15px;text-align:right;font-size:12px;text-transform:uppercase;letter-spacing:1px}.artist-bar__listeners-number{font-size:16px;margin:0}.artist-bar__listeners-text{margin:3px 0}@media screen and (max-width:520px){.artist-bar{height:auto}.artist-bar__info{width:100%;position:relative;bottom:auto;text-align:center}.artist-bar__image-container{float:none;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:0 auto}.artist-bar__title{margin:10px 0 0}.artist-bar__name{margin:10px 0}.artist-bar__info-actions{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:0 auto}.artist-bar__listeners{position:relative;bottom:auto;width:100%;text-align:center;margin-bottom:60px}}.more-button{fill:#c8c8c8;border:1px solid #c8c8c8;border-radius:50%;cursor:pointer}.more-button_big{padding:2px}.more-button_small{width:12px;padding:2px 7px}.more-button:hover{fill:#fff;border-color:#fff}.tabs{width:100%;position:absolute;top:-60px;background-color:rgba(24,24,24,.6)}.tabs__list{padding:0;margin:0;width:100%;height:60px;display:flex;list-style-type:none}.tab-item{padding:0 15px;height:58px;box-sizing:border-box;text-transform:uppercase;color:#aaa;line-height:22px;letter-spacing:1px;cursor:pointer;transition:color .4s}.tab-item:hover{color:#fff}.tab-item__text{padding:15px 0;margin:0}.tab-item_active .tab-item__text{border-bottom:4px solid #1ed760}.tab-item_active{color:#fff;cursor:default}.overview{padding:15px;background-color:#181818}@media screen and (max-width:770px){.overview{padding-bottom:100px}}@media screen and (max-width:480px){.overview{padding-bottom:145px}}.album{margin-bottom:12px}.album__image{width:135px;padding-right:15px;float:left}.album__year{margin:10px 0}.album__name{margin:0;height:81px;font-weight:300;font-size:30px;color:#fff}.album .text-button{margin-right:10px;padding:7px 30px;float:left;display:inline-block}.track{padding:0;margin:0 0 15px}.track__item{list-style-type:none}.song{border-top:1px solid #282828;box-sizing:border-box;display:flex;align-items:center;height:42px;border-bottom:1px solid #282828}.song:hover{background-color:#282828}.song__icon{height:41px;width:41px;float:left}.song__number{width:16px;margin-left:10px}.song__name{display:inline;color:#fff;margin-left:30px}.song__name_popular{min-width:120px}.song__label{padding:3px 7px;margin:0 0 0 auto;text-transform:uppercase;font-size:10px;color:#424242;font-weight:700;border:1px solid #424242;border-radius:3px}.song__plays{margin:0 0 0 10%;min-width:80px;text-align:right}.song__time{margin:0 0 0 5%}.song__popularity{margin:0 0 0 42px;fill:#aaa}.song__feature{margin-left:5px;cursor:pointer}.song__feature:hover{text-decoration:underline;color:#c8c8c8}.song__container{min-width:300px;display:flex}.song .added-icon{margin-left:25px}@media screen and (max-width:1200px){.song__plays{margin:0 0 0 auto}.song__container{min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.song__label,.song__popularity{display:none}.song__name{margin-left:25px}.song__time{margin:0 0 0 auto}}.added-icon{min-width:18px;width:18px;height:30px;fill:#c8c8c8}.overview-top{display:flex}.overview-top__artist-info{box-sizing:border-box;width:70%;padding:0 15px 30px 0;display:inline-block}.overview-top__artists{width:30%;display:inline-block}@media screen and (max-width:1025px){.overview-top{display:block;margin-bottom:20px}.overview-top__artist-info,.overview-top__artists{width:100%}}.release{height:75px;margin-bottom:30px;background-color:#282828}.release__image{padding-right:15px;width:75px;float:left}.release__title{padding:15px;margin:0;color:#c8c8c8}.release__date{margin:0}.popular{margin:-2px 0 15px}.popular,.related{padding:0;list-style-type:none}.related{dispaly:flex;flex-flow:row wrap;margin:0}.related__item{display:inline-block;width:100%}@media screen and (max-width:1025px){.related__item{margin:10px;width:calc(33.33333% - 20px)}}@media screen and (max-width:770px){.related__item{margin:5px;width:calc(50% - 10px)}}@media screen and (max-width:480px){.related__item{margin:5px;width:calc(25% - 10px)}}.artist-preview{box-sizing:border-box;padding:5px;margin-bottom:2px;height:52px;display:inline-block;width:100%;background-color:#282828;cursor:pointer}.artist-preview:hover{background-color:#424242}.artist-preview__image{width:42px;margin-right:15px;border-radius:50%;float:left}.artist-preview__name{height:100%;line-height:42px;color:#fff}@media screen and (max-width:480px){.artist-preview,.artist-preview:hover{background-color:transparent}.artist-preview:hover{opacity:.6}.artist-preview__image{float:none;display:block;margin:0 auto}.artist-preview__name{display:none}}.overview-title{margin:0 0 10px;text-transform:uppercase;letter-spacing:1.25px}.album-title{display:flex;justify-content:space-between;border-bottom:1px solid #282828}.album-title__buttons{padding-bottom:2px}.album-title__view{width:30px;height:30px;fill:#fff;border-radius:50%;cursor:pointer}.album-title__view:hover{background-color:#424242}.album-title__view_active{background-color:#282828}.album-title__view_small{width:20px;padding:0 5px}.track-title{display:flex;height:42px;align-items:center;justify-content:space-between}.track-title .overview-title{margin:0 auto 0 70px}.track-title__number{margin-left:10px}.track-title__time{fill:#aaa}.track-title__popularity{fill:#aaa;margin-left:46px}@media screen and (max-width:1200px){.track-title__popularity{display:none}}.artists-page{box-sizing:border-box;width:100%;padding:15px;background-color:#181818;display:flex;flex-wrap:wrap}.artists-page__item{box-sizing:border-box;overflow-x:hidden;width:calc(25% - 30px);margin:15px}@media screen and (max-width:1100px){.artists-page__item{width:calc(33.33333% - 30px)}}@media screen and (max-width:770px){.artists-page{padding-bottom:100px}.artists-page__item{width:calc(50% - 30px)}}@media screen and (max-width:480px){.artists-page{padding-bottom:145px}.artists-page__item{width:calc(100% - 30px)}}.artist-card__image{height:200px;position:relative;background-size:cover;background-position:50%}.artist-card__image:hover .artist-card__play{opacity:1}.artist-card__play{position:absolute;top:50px;width:60px;height:100px;left:50%;transform:translateX(-50%);transition:opacity .5s;opacity:0;display:block;fill:#fff;cursor:pointer}.artist-card__name{padding:15px;color:#fff;text-decoration:none;display:block;background-color:#282828}.artist-card__name:hover{text-decoration:underline}.tabs-view{position:relative}.menu-bar{position:fixed;top:60px;width:15%;height:calc(100vh - 120px);display:flex;flex-direction:column;background-color:#282828}.menu-bar__navigation{overflow-y:scroll;padding:15px;height:100%}.menu-bar__button{position:absolute;top:12px;left:320px;width:35px;height:35px;display:none;fill:#aaa;cursor:pointer;z-index:10}.menu-bar__button:hover{fill:#fff}.nav{margin-bottom:15px}.nav-list{overflow:hidden;margin:0 0 15px;padding:0;list-style-type:none}.nav-list__link{box-sizing:border-box;display:block;padding:5px 0;color:inherit;text-decoration:none;line-height:20px;border-right:3px solid transparent}.nav-list__item-icon{width:14px;margin-right:10px;float:left;fill:#aaa}.nav-list__link:hover{color:#fff;border-right:3px solid #1ed760}.nav-list__link:hover .nav-list__item-icon{fill:#fff}@media screen and (max-width:1400px){.menu-bar{width:20%}}@media screen and (max-width:770px){.menu-bar{width:100%;height:auto;position:static;top:auto}.menu-bar__button{display:inline-block}.menu-bar__button_open+.menu-bar__navigation{display:none}.menu-bar__navigation{display:flex}.nav{width:33%;height:-webkit-min-content;height:-moz-min-content;height:min-content;flex-grow:1}.nav-list{margin:0}.nav-list__link{text-align:center;border:none}.nav-list__link:hover{border:none}.nav-list__item-icon{display:none}}@media screen and (max-width:650px){.menu-bar__button{top:5px;right:20px;left:auto}}.nav-title{height:15px;margin:0 0 5px;cursor:pointer;text-transform:uppercase;font-size:11px;letter-spacing:1px}.nav-title__icon{width:16px;margin:-4px 0 -7px 1px;fill:#aaa}@media screen and (max-width:770px){.nav-title{width:100%;text-align:center}}.add-button{width:100%;height:65px;box-sizing:border-box;padding:15px;background-color:#282828;border-top:1px solid #181818;border-bottom:1px solid #181818}.add-button:hover{color:#fff;background-color:#424242}.add-button__link{display:flex;align-items:center;height:100%;text-decoration:none;color:inherit}.add-button__icon{fill:#fff;width:24px;height:24px;padding-right:13px}@media screen and (max-width:770px){.add-button{display:none}}.track-cover{position:relative;bottom:2px;width:100%;padding-right:10px;display:flex;align-items:center;box-sizing:border-box;background-color:#282828;border-top:1px solid #181818;border-bottom:1px solid #181818}.track-cover__text{padding:3px 15px;height:100%;box-sizing:border-box}.track-cover__name{display:block;margin:6px 0;color:inherit;text-decoration:none}.track-cover__name:hover{color:#fff;text-decoration:underline}.track-cover .added-icon{margin:0 0 0 auto}.track-cover__image{width:50px}@media screen and (max-width:770px){.track-cover{display:none}}.track-controls{box-sizing:border-box;position:fixed;bottom:0;padding:5px 15px;width:100%;height:62px;text-transform:uppercase;font-size:11px;background-color:#282828}.track-controls,.track-controls__actions{display:flex;justify-content:space-between;align-items:center}.track-controls__actions{width:6%}.track-controls__play{width:30px;height:30px;fill:#c8c8c8;cursor:pointer}.track-controls__skip{fill:#c8c8c8;width:25px;height:25px;cursor:pointer}.track-controls__play:hover,.track-controls__skip:hover{fill:#fff}.track-controls__progress{display:flex;justify-content:space-between;align-items:center;width:70%;height:16px;padding:0 30px;box-sizing:border-box}.track-controls__progress-range{width:calc(100% - 70px)}.track-controls__progress:hover .noUi-handle{opacity:1}.track-controls__progress .noUi-handle:focus{outline:none}.track-controls__progress .noUi-connect{background-color:#1ed760}.track-controls .noUi-target{height:4px;border:none;border-radius:0}.track-controls .noUi-handle{width:16px;height:16px;right:-15px;opacity:0;background-color:#c8c8c8;box-shadow:none;border:none;border-radius:50%}.track-controls .noUi-base{background-color:#5e5e5e}.track-controls .noUi-handle-lower:after,.track-controls .noUi-handle-lower:before{display:none}.track-controls .noUi-touch-area{width:18px;height:18px}.track-controls__tools{display:flex;justify-content:space-between;align-items:center;width:25%}.track-controls__menu,.track-controls__phone,.track-controls__refresh,.track-controls__shuffle,.track-controls__valume-icon{fill:#aaa;height:18px;width:18px;cursor:pointer}.track-controls__menu:hover,.track-controls__phone:hover,.track-controls__refresh:hover,.track-controls__shuffle:hover{fill:#c8c8c8}.track-controls__menu{height:15px;width:15px}.track-controls__phone{width:12px;height:12px;margin-top:-2px}.track-controls__device{display:flex;justify-content:space-between;align-items:center;width:120px}.track-controls__device,.track-controls__lyrics{cursor:pointer}.track-controls__lyrics:hover{text-decoration:underline;color:#c8c8c8}.track-controls__device:hover{color:#c8c8c8}.track-controls__valume{display:flex;justify-content:space-between;align-items:center;width:76px;padding-right:15px}.track-controls__valume-icon{width:24px;height:24px}.track-controls__valume-range{width:50px}.track-controls__valume .noUi-connect{background-color:#c8c8c8}.track-controls__valume-range:hover .noUi-handle{opacity:1}@media screen and (max-width:1400px){.track-controls__actions{width:10%}.track-controls__progress{width:50%}.track-controls__tools{width:40%}}@media screen and (max-width:980px){.track-controls__progress{width:40%}.track-controls__tools{width:50%}}@media screen and (max-width:770px){.track-controls{display:block;padding:15px 15px 10px;height:auto}.track-controls__actions{width:25%;float:left}.track-controls__progress{width:75%;height:30px}.track-controls__tools{width:100%;margin-top:5px}.track-controls__valume{width:20%}.track-controls__valume-range{width:80%}}@media screen and (max-width:480px){.track-controls__actions{width:100%;margin:5px 0 10px;justify-content:space-around}.track-controls__progress{width:100%;padding:0}}
/*# sourceMappingURL=main.94fe7410.chunk.css.map */