.songname {
    font-size: 11px;
}
.albumart {
    float: left;


}

/* resizes */
.webPlayer .controls { display: block; position: relative; height: 88px; color: #969696; padding: 5px 10px; z-index: 996; }
/*  resizes */

.webPlayer { display: inline-block; position: relative; font-family: 'Segoe UI', Verdana, sans-serif; clear: both; margin-bottom: 10px; line-height: 1.4; font-size: 13px; /*box-shadow: 0 0 1px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5); */ text-align: center; /* Chrome FIX for full screen */ }
.webPlayer a.smooth { transition: all 0.1s linear; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; -o-transition: all 0.1s linear; }
.webPlayer.jp-video-full > .controls { position: absolute; left: 0; right: 0; bottom: 0; opacity: 0.8; z-index: 1000; }
.webPlayer.jp-video-full, .webPlayer.jp-video-full object, .webPlayer.jp-video-full video { position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: block; z-index: 999; }
.webPlayer.jp-video-full > .playerScreen, .webPlayer.jp-video-full > .playerScreen > .video-play { z-index: 1000; }
.webPlayer .playerScreen { cursor: pointer; }
.webPlayer .playerScreen .video-play { display: block; position: absolute; z-index: 990; width: 100%; top: 0; left: 0; right: 0; bottom: 50px; background: url("../img/preimg.png") no-repeat center center; opacity: 0.4; background-color: rgba(0, 0, 0, 0.4); }



.webPlayer .controls .leftblock { position: absolute; top: 7px; left: 3px; width: 72px; height:72px; }
.webPlayer .controls .leftblock .play { display: block; width: 72px; height: 72px; background: url("../img/playerUI.png") no-repeat 0 -114px; opacity: 1; }
.webPlayer .controls .leftblock .play:hover { opacity: 1; }
.webPlayer .controls .leftblock .pause { display: block; position: relative; width: 72px; height: 72px; background: url("../img/playerUI.png") no-repeat -82px -114px; opacity: 1; }
.webPlayer .controls .leftblock .pause:hover { opacity: 1; }
.webPlayer .controls .progress { position: relative; top: 10px; display: block; margin: 0 130px 0 85px; text-align: left; }
.webPlayer .controls .progress span { font-size: 12px; margin-left: 1px; color: #f0f0f0; }
.webPlayer .controls .progress .progressbar { display: block; height: 4px; background-color: #3C3C3C; background: rgba(255, 255, 255, 0.05); margin: 2.5px 0; }
.webPlayer .controls .progress .progressbar .seekBar { position: relative; display: block; cursor: pointer; padding: 1px; background: rgba(255, 255, 255, 0.1); }
.webPlayer .controls .progress .progressbar .seekBar .playBar { display: block; height: 2px; padding: 0; background: #FFFFFF; }
.webPlayer .controls .progress .progressbar .seekBar a { display: block; position: absolute; top: -2px; width: 8px; height: 8px; border-radius: 5px; background: #ffffff; margin-left: -3px; }
.webPlayer .controls .progress .progressbar .seekBar a div { width: 8px; height: 8px; }
.webPlayer .controls .progress .time { display: block; position: absolute; width: 50px; font-size: 11px; }
.webPlayer .controls .progress .time.current { left: 1px; text-align: left; color: #f0f0f0; }
.webPlayer .controls .progress .time.duration { right: 0px; text-align: right; }
.webPlayer .controls .rightblock { position: absolute; top: 20px; right: 10px; width: 110px;}
.webPlayer .controls .rightblock .volumeText { display: block; position: absolute; bottom: -12px; text-align: center; width: 80px; font-size: 11px; }
.webPlayer .controls .rightblock .volumeBar { display: block; position: absolute; height: 4px; background-color: #3C3C3C; background: rgba(255, 255, 255, 0.05); width: 80px; top: 19px; left: 0; cursor: pointer; }
.webPlayer .controls .rightblock .volumeBar .currentVolume { position: relative; height: 2px; padding: 1px; }
.webPlayer .controls .rightblock .volumeBar .currentVolume .curvol { display: block; height: 2px; padding: 0; background: #FFFFFF; }
.webPlayer .controls .rightblock .volumeBar .currentVolume a { display: block; position: absolute; top: -2px; margin-left: -3px; width: 8px; height: 8px; border-radius: 5px; background: #ffffff; }
.webPlayer .controls .rightblock .volumeBar .currentVolume a div { display: block; width: 8px; height: 8px; }
.webPlayer .controls .rightblock .fullScreen { display: block; float: right; width: 16px; height: 16px; background: url("../img/playerUI.png") no-repeat 0 -50px; margin-top: 12px; opacity: 0.4; }
.webPlayer .controls .rightblock .fullScreen:hover { opacity: 0.8; }
.webPlayer .controls .rightblock .fullScreenOFF { display: block; float: right; width: 16px; height: 16px; background: url("../img/playerUI.png") no-repeat 0 -68px; margin-top: 12px; opacity: 0.4; }
.webPlayer .controls .rightblock .fullScreenOFF:hover { opacity: 0.8; }
.webPlayer.audioPlayer .progress { margin-right: 100px; }
.webPlayer.audioPlayer .rightblock { width: 85px; top: 21px; }
.webPlayer.audioPlayer .rightblock .volumeText { bottom: -42px; }
.webPlayer.audioPlayer .fullScreen { display: none; }
.webPlayer.audioPlayer .fullScreenOFF { display: none; }


#songname{margin-bottom:10px;}

.webPlayer .controls .leftblock .pause:before {
    display: block;
    width: 72px;
    height: 72px;
    position: absolute;
    content: " ";
    left: 0;
    top: 0;
    background: transparent url("../img/playerUI.png") no-repeat -165px -114px;
    -webkit-animation: playspin 3s infinite linear;
    animation: playspin 3s infinite linear;
}


@-webkit-keyframes playspin {
    0% {
        -webkit-transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes playspin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}