.close-modal:hover, .songProfile {
    cursor: pointer
}

.grey-text,.white-text {
    color: #fff
}

.clearfix:after,.hidden {
    visibility: hidden
}

.current-artist-name,.res-nate,.resonate-link {
    font-weight: 700
}

* {
    box-sizing: border-box
}

#player-container {
    background-color: #414141;
    width: 100%;
    height: auto;
    position: relative;
    margin: 0 auto
}

.playlist-item {
    display: block;
    border-bottom: 1px solid rgba(255,255,255,.1)
}

#header,.playlist-item-info {
    display: flex
}

#playlist-container {
    height: auto;
    overflow: hidden;
    background: #414141
}

.grey-text {
    opacity: .5
}

a {
    text-decoration: none
}

.clearfix:after {
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0
}

* html .clearfix {
    height: 1%
}

.clearfix {
    display: block
}

#playlist-item-template,#footer {
    height: 38px;
    background-color: #222
}

.res-nate {
    float: left;
    margin-left: 20px;
    line-height: 35px;
    font-size: 15px;
    text-rendering: geometricPrecision
}

.fair-music-streaming {
    margin-right: 15px;
    line-height: 37px;
    font-size: 12px;
    letter-spacing: .1px;
    text-align: right
}

.fair-music-streaming:hover {
    opacity: .8
}

.fair-music-streaming a {
    color: #97a7dc
}

.playlist-item.currently-playing .action-icons,.playlist-item.currently-playing .grey-text,.playlist-item.currently-playing .standard-info-container .duration,.playlist-item.currently-playing .white-text {
    color: #97a7dc;
    opacity: 1;
}
.playlist-item.currently-playing .standard-info-container{
    background-color: #545454;
}

.playlist-item.currently-playing .standard-info-container .buy-button {
    border-color: #97a7dc
}

.playlist-item:hover .standard-info-container {
    background-color: rgba(255,255,255,.2)
}

.playlist-item .action-icons {
    display: none;
    color: #fff;
    opacity: .5;
    text-align: center;
    padding-top: 15px
}

.playlist-item .action-icons .mdi {
    display: inline-block;
    width: 37px
}

.playlist-item .action-icons .mdi:before {
    font-size: 20px
}

.playlist-item .standard-info-container {
    width: 100%;
    height: 50px
}

.playlist-item .standard-info-container:hover .play-button {
    display: block
}

.playlist-item .standard-info-container .play-button {
    display: none
}

.playlist-item .standard-info-container .song-meta {
    margin: 7px 0;
    width:79%;
}

.playlist-item .standard-info-container .cover-container {
    position: relative;
    display: inline-block;
    width: 13%;
    height: 50px;
    float: left;
    overflow: hidden; min-width: 48px;
}

.playlist-item .standard-info-container .cover-container .darkener {
    width: 13%;
    height: 50px
}

.playlist-item .standard-info-container .duration {
    width: 14%;
    min-width: 50px;
    opacity: .5;
    font-size: 11px;
    line-height: 46px;
    letter-spacing: .5px;
    text-align: center;
    color: #fff
}

.playlist-item .standard-info-container .buy-button {
    width: 60px;
    border: 1px solid #fff;
    background: 0 0;
    text-transform: uppercase;
    letter-spacing: .5px;
    height: 20px;
    margin-top: 15px;
    display: none
}

.playlist-item.open .more-info {
    height: 75px;
    padding-top: 10px
}

.playlist-item .more-info {
    padding-left: 60px;
    height: 0;
    background-color: #222;
    overflow: hidden;
    transition: height .75s ease-in-out,padding 1s ease-in-out
}

.playlist-item .more-info .more-info-row {
    width: 100%;
    height: 55px;
    font-size: 11px;
    opacity: .5;
    color: #fff;
    line-height: 1.6;
}

.more-info-row .lblSongTag, .more-info-row .lblSongLabel {
    width: 37px;
    display: inline-block;
    opacity: .5;
}

.more-info-row .allTracksLink {
    color: #97a7dc;
}

.more-info-row .allTracksLink:hover {
    color: #999;
}

.more-info-row .songTags {
    overflow: hidden;
    height: 18px;
}

.more-info-row .allTracksLink { color: #97a7dc; }
.more-info-row .allTracksLink:hover { color: #999; }

.playlist-item .more-info .more-info-row .mdi {
    display: inline-block;
    padding: 5px 10px 1px;
    font-size: 18px
}

.playlist-item .more-info .more-info-row .wordy-section {
    width: 98%;
    float: left
}

.playlist-item .more-info .more-info-row .number-section {
    width: 30%;
    float: left
}

.play-button.small {
    top: 18px;
    left: 20px;
    border-width: 7px 0 7px 11px
}

.overlay {
    position: absolute;
    width: 400px;
    height: 49px;
    background-color: rgba(255,255,255,.1)
}

.playlist-item-info-container {
    display: inline-block;
    width: 87%
}

.playlist-item-info {
    width: 100%
}

.song-cover {
    height: 50px;
    min-width: 50px;
}

.artist-name {
    font-size: 11px;
    line-height: 1.36;
    letter-spacing: .5px
}

.song-number {
    font-size: 16px;
    line-height: 50px;
    width: 10%;
    text-align: center
}

.blog-btn,.current-artist-name,.song-name {
    line-height: 1.33;
    letter-spacing: .1px;
    font-size: .94rem;
}

.artist-name,.current-artist-name,.current-song-name,.song-name {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width:100%;
}

.um-profile-body .artist-name, .um-profile-body .song-name {
    padding-left: 10px;
}

#modal-container {
    background: #97a7dc;
    height: 400px;
    position: absolute;
    width: 100%;
    z-index: 5;
    color: #fff;
    padding: 20px;
    display: none
}

#modal-container.open {
    display: block
}

.modal-content {
    margin: 20px
}

.modal-content h1 {
    margin-bottom: 40px
}

#resonate-modal-content,#skipping-modal-content {
    display: none
}

#modal-container.open.resonate #resonate-modal-content,#modal-container.open.skipping #skipping-modal-content {
    display: block
}

.close-modal {
    float: right
}

.blog-btn {
    border: 1px solid #fff;
    text-transform: uppercase;
    text-align: center;
    padding: 10px 25px;
    background: 0 0;
    color: #fff
}

#controls-container {
    overflow: hidden;
    border-bottom: 1px solid rgba(255,255,255,.1);
    height: 0;
    transition: height 1s ease-in-out
}

#controls-container.open {
    height: 40px
}

#controls-container #controls {
    display: inline-flex;
    width: 80px;
    float: left
}

#controls-container #controls .control-button {
    width: 40px;
    height: 40px;
    background-color: #414141;
    color: #fff;
    opacity: .6;
    text-align: center;
    padding-top: 7px
}

#controls-container #controls .control-button:hover {
    opacity: 1
}

#controls-container #controls .control-button:hover.amplitude-prev {
    cursor: w-resize
}

#controls-container #controls .control-button:hover.amplitude-next {
    cursor: e-resize
}

#controls-container #waveform-container {
    height: 40px;
    width: calc(100% - 80px);
    position: relative;
    z-index: 0;
    display: inline-block
}

#controls-container #waveform-container #waveform {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-filter: blur(.5px);
    -moz-filter: blur(.5px);
    -o-filter: blur(.5px);
    -ms-filter: blur(.5px);
    filter: blur(.5px)
}

#controls-container #waveform-container .amplitude-song-time-visualization {
    height: 40px;
    width: 100%;
    position: absolute;
    z-index: 1
}

#controls-container #waveform-container .amplitude-song-time-visualization-status {
    height: 40px;
    background: rgba(0,0,0,.2);
}

#waveform img {
    width: 100% !important;
}

#header {
    height: 80px;
    position: relative;
    overflow: hidden;
    background-color: rgba(0,0,0,.3)
}

#header-blur-cover {
    -webkit-filter: blur(50px);
    -moz-filter: blur(50px);
    -o-filter: blur(50px);
    -ms-filter: blur(50px);
    filter: blur(50px);
    width: 100%;
    position: absolute;
    z-index: 0
}

.current-ontainer {
    position: relative;
    width: 80px;
    height: 80px
}

.current-cover {
    min-width: 80px;
    height: 80px
}

.play-button {
    position: absolute;
    top: 28px;
    left: 32px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 0 12px 20px;
    border-color: transparent transparent transparent #fff
}

.darkener {
    position: absolute;
    width: 80px;
    height: 80px;
    background-color: rgba(0,0,0,.1)
}

.cover-container {
    width: 80px;
    height: 80px;
    z-index: 1;
}

.cover-container:hover .on-hover {
    visibility: visible
}

.cover-container.amplitude-paused .mdi-pause,.cover-container.amplitude-playing .mdi-play {
    display: none
}

.cover-container .play-button-container {
    position: absolute;
    top: 16px;
    left: 14px;
    color: #fff
}

.standard-info-container .cover-container .play-button-container {
    top: 12px;
    left: 11px
}

.current-song-meta {
    width: 290px;
    padding-left: 15px;
    padding-top: 7px;
    z-index: 1
}

.resonate-link {
    font-size: 15px;
    text-align: center;
    color: #fff;
    height: 40px;
    line-height: 40px
}

.right-header {
    padding-top: 6px;
    text-align: center;
    width: 40px;
    z-index: 1
}

.amplitude-shuffle {
    display: none;
    height: 40px;
    opacity: .6;
    margin-right: 2px;
    color: #fff
}

.amplitude-shuffle i {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    display: inline-block
}

.playerparen {
    color: #d5dada ;
}

.rs_player_section_container {
    max-width: 400px;
}

.playlist-item:hover .buy-button {
    display: none
}

#playlist-item-template {
    display: none;
}

/*
causes song meta div shrinking
.playlist-item:hover .action-icons{display:inline-block}
*/
.duration-wrapper {
    display: inline-block;
    line-height: 44px;
    position: relative;
    top: -21px;
    left: 0px;
    width: 25px;
}

.play-count {
    display: inline-block;
    height: 42px;
    width: 12px;
    margin: 4px 2px 4px 6px;
    background-color: #111;
    position: relative;
}

.play-count-text {
    z-index: 2;
    position: absolute;
    left: auto;
    text-align: center;
    width: 13px;
    top: -13px;
}

.play-count-bar {
    z-index: 1;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 12px;
    background-color: #54EB80;
}

.play-count-header {
    color: #97a7dc;
}

.play-count-bar.stage1 {
    height: 1px
}

.play-count-bar.stage2 {
    height: 2px
}

.play-count-bar.stage3 {
    height: 3px
}

.play-count-bar.stage4 {
    height: 4px
}

.play-count-bar.stage5 {
    height: 6px
}

.play-count-bar.stage6 {
    height: 9px
}

.play-count-bar.stage7 {
    height: 14px
}

.play-count-bar.stage8 {
    height: 22px
}

.play-count-bar.stage9 {
    height: 42px
}

.play-count-text.stage9 {
    color: #414141;
}

/*
.song-name .mdi-heart:hover:after { content:'remove'; color:#fff;font-size: 14px;}
*/
.noFavorites {
    color: #fff;
    padding: 2rem 3rem;
    text-align: center;
}

#header .play-button-container {
    background: rgba(0, 0, 0, 0.5);
    left: 0;
    padding: 16px 15px 16px 14px;
    top: 0; width: 80px;
}

#header .play-button-container:hover {
    background: transparent;
}

.sectionTitle {
    background: #ededed;
    padding: 1rem 0 .3rem;
    font-size: 1rem;
}

.playerWrapper .sectionTitle {
    background: #ccc; padding: .8rem; color: #414141;
}

.song-number .mdi-gift, .song-number .mdi-currency-usd {
    color: #97a7dc;
}

span.catalogStub {
    display: block;
    margin: 2rem 0 1rem;
    padding: 1rem;
    background: #fff;
    max-width: 400px;
    font-size: 1rem; 
}
span.catalogStub:hover { background: #d5dada;}

.catalogStub .mdi-share-variant {
    display: block;
    float: left;
    font-size: 1.5rem; color: #97a7dc;
    padding: 5px 15px 0px 0px;
}

@media only screen and (max-width:399px) {
.playlist-item-info-container { width: 83%;}
.playlist-item .standard-info-container .song-meta { padding-left: 3% !important; width: 82%; }
.um-profile-body .artist-name, .um-profile-body .song-name { padding-left: 0; }
.duration .play-count { margin-left: 4px; }
.white-text.current-song-name { font-size: 16px; }

}