/* Qobuz Flac JS Player CSS */


#player{
    overflow: hidden;
    padding:20px 30px 10px;
}
#playerBt{
    float:left;
    margin-right:30px;
}
    #btPrev,
    #btNext{
        border:none;
        display:block;
        float:left;
        height:32px;
        margin: 6px 0;
        outline: none;
        width:32px;
    }
    #btPrev{
        background:url('/js/qobuz-jsplayer/img/sprite-player-03_2019.png') no-repeat 0 -44px;
    }
        #btPrev:hover{
            background-position:-32px -44px;
            cursor:pointer;
        }
    #btNext{
        background:url('/js/qobuz-jsplayer/img/sprite-player-03_2019.png') no-repeat -64px -44px;
    }
        #btNext:hover{
            background-position:-96px -44px;
            cursor:pointer;
        }
    #btPlay{
        background:url('/js/qobuz-jsplayer/img/sprite-player-03_2019.png') no-repeat 0 0;
        border:none;
        cursor:pointer;
        display:block;
        float:left;
        height:44px;
        margin:0 22px;
        outline: none;
        width:44px;
    }
        #btPlay:hover{
            background-position:-44px 0;
        }
        #btPlay.load{
            background-position:-176px 0;
        }
        #btPlay.pause{
            background-position:-88px 0;
        }
            #btPlay.pause:hover{
                background-position:-132px 0;
            }
    #trackQuality{
        clear:both;
        cursor: pointer;
        color: #0070ef;
        margin-left: -5px;
        padding-top:5px;
        margin:0;
    }   
        #trackQuality p.selected:before{
            content: "✓";
            font-weight: bold;
            left: 5px;
            position: absolute;
        }
        #trackQuality .choose-quality{
            padding: 0 5px;
            position: relative;
        }
        #trackQuality .pictoMenu{
            background:url('/js/qobuz-jsplayer/img/sprite-player-03_2019.png') no-repeat -211px -44px;
            display:inline-block;
            height:6px;
            margin-left:10px;
            position: absolute;
            right: 0;
            top:5px;
            width:9px;
        }
            #trackQuality:hover .pictoMenu{
                background-position:-211px -50px;
            }
        #qualityChoice{
            background:#fff;
            border:1px solid #dcdcdc;
            box-shadow: 0 4px 2px rgba(0, 0, 0, 0.4);
            display:none;
            margin-top: -6px;
            padding:0;
            position: absolute;
            width: 165px;
            z-index: 1;
        }
            #qualityChoice p{
                color: #333333;
                margin: 0;
                padding: 5px 5px 5px 20px;
            }
            #qualityChoice p:hover{
                background: #e0e0e0;
            }
            #qualityChoice p.disabled{
                background:#eaeaea;
                color: #555;
                cursor: no-drop;
            }
                #qualityChoice p.disabled.label.flac{
                    background:#aaa;
                }
#playerTrack{
    float:left;
    max-width: 267px;
    overflow: hidden;
    width:267px;
}
    #trackName{
        font-size:20px;
        height: 18px;
        position: relative;
        text-align: center;
        white-space: nowrap;
    }
    #btRepeat,
    #btShuffle{
        display:block;
        float:left;
        height:16px;
        position: relative;
        top: 2px;
        width:15px;
    }
    #btRepeat{
        background:url('/js/qobuz-jsplayer/img/sprite-player-03_2019.png') no-repeat -132px -44px;
    }
        #btRepeat.repeatAll,
        #btRepeat:hover{
            background-position:-147px -44px;
            cursor: pointer;
        }
        #btRepeat.repeatOne,
        #btRepeat.repeatOne:hover{
            background-position:-162px -44px;
            cursor: pointer;
        }
    #btShuffle{
        background:url('/js/qobuz-jsplayer/img/sprite-player-03_2019.png') no-repeat -177px -44px;
    }
        #btShuffle.shuffle,
        #btShuffle:hover{
            background-position:-192px -44px;
            cursor: pointer;
        }
    #current-playing-format{
        font-size: 11px;
        display: block;
        float: left;
        margin-left: 70px;
    }
    #currentTime{
        bottom: -13px;
        line-height: 12px;
        position: relative;
        text-align: center;
        visibility: hidden;
    }
     #playerTrack:hover #currentTime{
        visibility:visible;
     }
    #progressBar{
        float: left;
        height: 20px;
        margin:0 10px;
        position: relative;
        width: 217px;
    }
        #cursorTime{
            background:url('/js/qobuz-jsplayer/img/sprite-player-03_2019.png') no-repeat -132px -60px;
            cursor: pointer;
            display:block;
            height: 20px;
            margin-left:-10px;
            position: absolute;
            top:0;
            width: 20px;
            z-index: 30;
        }
        #totalBar,
        #valueBar,
        #bufferBar{
            display:block;
            height: 5px;
            position: absolute;
            top: 7px;
        }
        #totalBar{
            background: #a0a0a0;
            width: 100%;
            z-index: 1;
            cursor:hand;
        }
        #valueBar{
            background: #0070ef;
            z-index: 20;
        }
        #bufferBar{
            background: #cdcdcd;
            z-index: 10;
        }
.player-open-button{
    float:left;
    margin-left:30px;
    margin-top: 18px;
}