/* Background color and resizes */
.webPlayer .controls { display: block; position: relative; height: 40px; background: #0b0b0b; color: #969696; padding: 5px 10px; z-index: 996; border: 1px solid #000000; }
/* Background color and 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; left: 3px; width: 50px; }
.webPlayer .controls .leftblock .play { display: block; width: 40px; height: 40px; background: url("../img/playerUI.png") no-repeat 0 1px; opacity: 0.8; }
.webPlayer .controls .leftblock .play:hover { opacity: 1; }
.webPlayer .controls .leftblock .pause { display: block; width: 40px; height: 40px; background: url("../img/playerUI.png") no-repeat -40px 1px; opacity: 0.8; }
.webPlayer .controls .leftblock .pause:hover { opacity: 1; }
.webPlayer .controls .progress { position: relative; display: block; margin: 0 130px 0 50px; 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; right: 10px; width: 110px; top: 5px; }
.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; }
.webPlayer.audioPlayer .rightblock .volumeText { bottom: -42px; }
.webPlayer.audioPlayer .fullScreen { display: none; }
.webPlayer.audioPlayer .fullScreenOFF { display: none; }