*,*:before,*:after{margin:0;padding:0;border:0;outline:none;background-color:transparent;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:border-color .4s cubic-bezier(.215,.61,.355,1),background-color .4s cubic-bezier(.215,.61,.355,1),opacity .4s cubic-bezier(.215,.61,.355,1),transform .4s cubic-bezier(.215,.61,.355,1)}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main,summary,div,h1,h2,h3,h4,h5,h6,hr,p,ol,ul,form,img{display:block}input,textarea,select,optgroup,option,button{font-family:inherit;font-size:inherit;font-weight:400;line-height:inherit;color:inherit}select,button{cursor:pointer}a,.link{color:#6495ed}a:hover,.link:hover{color:#92b4f2}hr{display:block;overflow:hidden;margin:1em 0;height:0;border:0;border-bottom:2px solid rgba(0,0,0,.08)}html,body{display:block;position:relative;max-width:100vw;min-height:var(--height, 100vh)}html{overflow:hidden;overflow-y:auto}body{font-family:Assistant,sans-serif;font-weight:400;font-size:12px;line-height:1.4em;background-size:cover}@media only screen and (min-width: 480px){body{font-size:13px}}@media only screen and (min-width: 820px){body{font-size:14px}}@media only screen and (min-width: 1200px){body{font-size:15px}}h1,h2,h3,h4,h5,h6{display:block;font-weight:400;line-height:1.2em;color:#f5f5f5}h1{font-size:220%}h2{font-size:200%}h3{font-size:180%}h4{font-size:160%}h5{font-size:140%}h6{font-size:120%}.app-wrap{-webkit-box-sizing:border-box;box-sizing:border-box;min-width:320px;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:nowrap;max-height:var(--height, 100vh)}.player-wrap{display:flex;flex-direction:column;flex-wrap:nowrap;flex:1;width:100%;height:var(--height, 100vh);min-width:320px}.player-layout{display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;height:100%;position:relative;z-index:3}.player-layout .header,.player-layout .content,.player-layout .current-track{position:relative}.player-layout .content{flex:1;height:100%;overflow:hidden;overflow-y:auto}.player-layout .content>section{margin:auto 0}.material-icons{user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}body{background:rgb(24,24,24);font-family:Roboto,sans-serif}body a{color:#aaa;text-decoration:none}body a:hover,body a:visited{color:#c8c8c8}body a:hover .material-icons{color:#fff}.material-icons{color:#c8c8c8}.queue_mode{color:#1ed760}.hide{display:none}.tracks .track:hover .hide{display:block}.tracks .track:hover .show{display:none}.track__selected{color:#ffffff4d}.header{background:rgb(40,40,40);padding:10px;color:#aaa;border-bottom:1px solid rgb(24,24,24);display:flex;flex-flow:row wrap;align-items:center;position:static}.header .search{margin-left:10px}.header .search input{height:30px;border-radius:15px;border:none;background:rgb(255,255,255);color:#181818;padding-left:30px;padding-right:30px;outline:none;background-image:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/7022/ios-search.svg);background-repeat:no-repeat;background-size:10%;background-position:5px}.header .search input:invalid~.clear-icon{display:none}.header .search .clear-icon{background-color:transparent;display:inline-block;vertical-align:middle;outline:0;cursor:pointer;position:relative;right:30px}.header .user{width:30px;height:30px;margin-left:auto;display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center}.header .user i{font-size:20px}.header .user i:hover{color:#fff;cursor:pointer}.content{display:flex;flex-flow:row wrap;height:100%}.content__middle{width:50%;height:100%}.content__right{position:relative;width:50%;height:100%}@media (max-width: 768px){.content__middle{width:100%;height:25%}.content__right{position:relative;width:100%;height:75%}}.navigation a:hover{color:#fff}.navigation{padding:15px;background:rgba(0,0,0,.4);color:#aaa;height:100%;overflow:hidden;overflow-y:scroll}.navigation__list{display:flex;flex-flow:column wrap;margin-bottom:15px}.navigation__list__header:after{font-family:Ionicons;content:"\f123"}.navigation__list .active:after{font-family:Ionicons;content:"\f126"}.navigation__list__item{color:#aaa;padding:5px 0;display:flex;flex-flow:row nowrap;align-items:center}.navigation__list__item .playing{color:#1ed760}.navigation__list__item:hover{color:#fff;text-decoration:none;background-color:#ffffff1a}.navigation__list__item i{width:25px;display:block}.navigation__list__item__selected{background-color:#ffffff4d}.navigation__list__item__selected:hover{background-color:#ffffff1a}@media (max-width: 768px){.navigation{display:flex;flex-flow:row wrap;justify-content:space-around}.navigation__list{margin-bottom:0;width:100%;text-align:center}.navigation__list__item{width:100%;text-align:center}.navigation__list__item i{display:none}.navigation__list__item span{margin:0 auto}.navigation__list__item:hover{border:none}}.queue{position:absolute;overflow:hidden;left:0;top:0;width:100%;height:100%;border-radius:6px;background-color:#181818;pointer-events:none;z-index:-1;overflow-y:scroll}.queue.active{pointer-events:auto}.queue.visible{background-color:#181818;z-index:1}.current-track{background:rgb(40,40,40);border-top:solid 1px rgb(40,40,40);padding:5px;display:flex;align-items:center;height:90px}.current-track .playing__song{font-size:24px;color:#1ed760;display:flex;flex-flow:column wrap}.current-track .playing__song a{color:#aaa}.current-track .playing__song a:hover{color:#fff;cursor:pointer}.current-track .playing__song .playing__song__name{color:#fff}.current-track__player{width:85%;margin:auto;display:flex;flex-flow:row wrap;justify-content:space-around}.current-track__player div{display:flex;flex-grow:1;justify-content:space-around;max-width:400px}.current-track__player a:hover{text-decoration:none;cursor:pointer}.current-track__player a i{margin-right:5px}.current-track__player a span{font-size:11px;text-transform:uppercase}.current-track__player .volume .volume_range{position:absolute;z-index:1000;writing-mode:bt-lr;-webkit-appearance:slider-vertical;width:30px;height:175px;top:-175px;padding:0 4px;background-color:#282828}.current-track__player .volume .volume_range input{position:relative;bottom:15px}.current-track__player .volume i{width:20px;color:#aaa}.current-track__player .volume #song-volume{width:calc(80% - 20px);border:none;margin-left:10px}.current-track__player .volume #song-volume .noUi-base{background:rgb(200,200,200)}.current-track__player .volume #song-volume .noUi-origin{background:#5e5e5e}.current-track__player .volume #song-volume .noUi-handle{background:rgb(200,200,200);width:15px;height:15px;border-radius:50%;box-shadow:none;border:none;left:0;display:none}.current-track__player .volume #song-volume .noUi-handle:before,.current-track__player .volume #song-volume .noUi-handle:after{background:none}.current-track__player .volume #song-volume:hover .noUi-handle{display:block}.current-track__progress{width:70%;padding:0 30px;color:#aaa;font-size:11px;display:flex;flex-flow:row;justify-content:space-between;align-items:center}.current-track__progress__bar{width:100%;padding:0 15px}.current-track__progress__bar .noUi-target{border:none;height:4px}.current-track__progress__bar .noUi-base{background:rgb(30,215,96)}.current-track__progress__bar .noUi-origin{background:#5e5e5e}.current-track__progress__bar .noUi-handle{background:rgb(200,200,200);width:15px;height:15px;border-radius:50%;box-shadow:none;border:none;left:0;display:none}.current-track__progress__bar .noUi-handle:before,.current-track__progress__bar .noUi-handle:after{background:none}.current-track__progress:hover .noUi-handle{display:block}.artist{position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;overflow-y:scroll;background-color:#181818}.artist__header{height:140px;border-bottom:1px solid rgb(40,40,40);position:relative;background-image:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/7022/spotify_img_bground.png);background-size:cover;background-position:center;background-repeat:no-repeat;overflow:hidden;z-index:1;display:flex;flex-flow:row wrap;justify-content:space-between;align-items:flex-end}@media (max-width: 768px){.artist__header{height:45px;width:100%;position:fixed;background-color:#181818;box-shadow:0 1px 20px #0009}}.artist__header .artist__info{padding:15px;z-index:1;width:80%;margin-top:78px;display:flex;flex-flow:row wrap;align-items:flex-end}.artist__header .artist__info .profile__img{margin-right:15px}.artist__header .artist__info .profile__img img{width:150px;height:150px;border-radius:50%}.artist__header .artist__info__name{color:#fff;font-size:36px;font-weight:100;padding:0 0 10px}@media (max-width: 768px){.artist__header .artist__info__name{font-size:24px}}.artist__header .artist__info__actions{display:flex;flex-flow:row wrap}.artist__header .artist__info__actions button{margin-right:10px;height:27px;display:flex;flex-flow:row wrap;align-items:center;padding:0 15px;font-weight:500}.artist__header .artist__info__actions button i{font-size:20px;margin-right:5px}.artist__header .artist__info__actions .more{width:27px;height:27px;border-radius:50%;padding:0;text-align:center}.artist__header .artist__info__actions .more i{margin:0;padding-left:6px}.artist__header .artist__listeners{width:20%;z-index:1;padding:15px;text-align:right;color:#aaa;font-weight:100;font-size:16px;letter-spacing:1px}.artist__header .artist__listeners__label{font-weight:300;text-transform:uppercase;font-size:12px;letter-spacing:1px}.artist__header .artist__navigation{width:100%;z-index:1;background:rgba(24,24,24,.6);display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center}.artist__header .artist__navigation ul{border:none}.artist__header .artist__navigation ul li{padding:0 15px}.artist__header .artist__navigation ul li a{padding:15px 0;color:#aaa;border:none;text-transform:uppercase;letter-spacing:1px;transition:all .4s ease;border-bottom:4px solid rgba(0,0,0,0)}.artist__header .artist__navigation ul li a:hover{background:none;border:none;color:#fff;transition:all .4s ease;border-bottom:4px solid rgba(0,0,0,0)}.artist__header .artist__navigation ul li.active a{color:#fff;background:none;border:none;border-bottom:4px solid rgb(30,215,96)}.artist__header .artist__navigation ul li.active a:hover{border-bottom:4px solid rgb(30,215,96)}.artist__header .artist__navigation__friends{padding:15px}.artist__header .artist__navigation__friends img{width:30px;height:30px;border-radius:50%;position:relative}.artist__header .artist__navigation__friends .tooltip{z-index:1;position:absolute}.artist__content{height:100%}.artist__content{padding:15px}.artist__content h1{color:#c8c8c8}.artist__content .overview{display:flex;flex-flow:row wrap}.artist__content .overview__related{width:30%}@media (max-width: 1024px){.artist__content .overview__artist{width:100%}.artist__content .overview__related{width:100%;margin-top:15px}}@media (max-width: 768px){.artist__content .overview__artist{padding-right:0}}@media (max-width: 768px){.artist{height:100%;overflow-y:auto}}.tracks{height:100%;display:flex;flex-flow:column wrap;margin-bottom:15px}.tracks__heading{color:#aaa;height:42px;display:flex;flex-flow:row wrap;align-items:center}.tracks__heading__number{margin-left:10px;font-style:italic;width:24px;text-align:center}.tracks__heading__title{margin-left:30px;width:45%;text-transform:uppercase;letter-spacing:1px}.tracks .track{border-top:1px solid rgb(40,40,40);height:45px;display:flex;flex-wrap:nowrap;align-items:center}.tracks .track .playing{color:#1ed760}.tracks .track:hover{background:rgb(40,40,40)}.tracks .track__number{margin-left:10px;color:#aaa;width:24px;text-align:center}.tracks .track__added{margin-left:20px;margin-right:20px;color:#c8c8c8}.tracks .track__selected{background-color:#ffffff4d}.tracks .track__selected:hover{background-color:#ffffff1a;text-decoration:none}.tracks .track__title{margin-left:20px;overflow:hidden;width:calc(85% - 100px);display:flex;flex-wrap:wrap}.tracks .track__title .title{width:100%;white-space:nowrap;overflow:hidden}.tracks .track__title .composer{color:#fff}.tracks .track__title .composer:hover{text-decoration:underline}.overview__albums{width:100%;margin-top:30px}@media (max-width: 768px){.overview__albums{margin-top:5px}}.overview__albums__head{border-bottom:1px solid rgb(40,40,40);margin-bottom:10px;display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center}.overview__albums__head .view-type{color:#fff;margin-bottom:4px}.overview__albums__head .view-type .active{background:rgb(40,40,40);padding:8px;border-radius:50%}.overview__albums__head .view-type i{padding:8px;border-radius:50%}.overview__albums__head .view-type i:hover{padding:8px;border-radius:50%;background:#353535;cursor:pointer}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{border-radius:4px;background:#373737}.section-title{text-transform:uppercase;color:#aaa;letter-spacing:1.25px;font-size:13.2px;margin-bottom:10px}
