.jspContainer {overflow: hidden; position: relative}
.jspPane {position: absolute}
.jspVerticalBar {position: absolute; top: 0; right: 0; width: 16px; height: 100%; background: red}
.jspHorizontalBar {position: absolute; bottom: 0; left: 0; width: 100%; height: 16px; background: red}
.jspVerticalBar *, .jspHorizontalBar * {margin: 0; padding: 0}
.jspCap {display: none}
.jspHorizontalBar .jspCap {float: left}
.jspTrack {background: #dde; position: relative}
.jspDrag {background: #bbd; position: relative; top: 0; left: 0; cursor: pointer}
.jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag {float: left; height: 100%}
.jspArrow {background: #50506d; text-indent: -20000px; display: block; cursor: pointer}
.jspArrow.jspDisabled {cursor: default; background: #80808d}
.jspVerticalBar .jspArrow {height: 16px}
.jspHorizontalBar .jspArrow {width: 16px; float: left; height: 100%}
.jspVerticalBar .jspArrow:focus {outline: none}
.jspCorner {background: #eeeef4; float: left; height: 100%}
 * html .jspCorner {margin: 0 -3px 0 0}
* {outline: none}
html, body {height: 100%; width: 100%; background-color: #000;}
body{background: #000; padding:0px; font-size:11px; margin:0px; overflow: hidden;}
h1, h2 {font-family:Arial; margin:0px; padding:0px;}
#splashView {display: none; position: absolute; width: 100%; height: 100%; margin: 0; padding: 0;z-index: 10;top: 0px;left: 0px;}
#splashSpinner {width: 50px; height: 50px; margin: auto;}
#playbackView {display: none; float: left;position: relative; background-color: #000000;overflow:hidden; width: 100%; height: 100%;}
#playerContainer {width: 100%; height: 100%}
 .allowTransition {-webkit-transition:all 0.1s ease-in-out; -moz-transition:all 0.1s ease-in-out; -o-transition:all 0.1s ease-in-out; transition:all 0.1s ease-in-out}
#stingImage {display: none;}
#titleBar {width: 100%; height: 27px; font-size: 16px; color: #ffffff; background-image: url('../../../../../../site/public/20130611/images/html5/panel_text_slice.png'); background-repeat: repeat-x; padding-left: 10px; padding-top: 3px; font-weight: bold}
#videoDisplay {overflow: hidden; display: none;  width: 10px; height: 10px}
#videoDisplay.thumbsBelow {height: 145px!important; display: block}
#videoDisplay.thumbsRight {width: 230px!important; display: block; float: left}
#videoDisplay.thumbsRight #titleBar {width: 230px!important; margin-left: 0px}
#videoList {overflow: hidden; outline: none}
#videoList.thumbsBelow {height: 98px; margin-top: 10px; width: 100%}
#videoList.thumbsRight {height: 100%; margin-top: 10px; width: 100%; float: left}
#videoList ul {list-style: none; padding: 0px; margin: 0px; margin-left: 10px}
#videoList ul li {float: left; margin-right: 10px}
#videoList ul li img {border: 1px solid transparent}
#videoList ul li.active img {border: 1px solid #cbfe00}
#videoList ul.thumbsBelow {width: 2000px}
#videoList ul.thumbsRight {height: 2000px; width: 220px}
#videoList ul.thumbsBelow li {width: 97px; height: 81px}
#videoList ul.thumbsRight li {width: 220px; height: 55px}
.thumbnailView {color: #ffffff; cursor: pointer}
.artistText {color: #8a8a8a; height: 15px; overflow: hidden}
.titleText {height: 15px; overflow: hidden}
#videoList ul.thumbsBelow li .artistText {width: 77px; margin-left: 3px}
#videoList ul.thumbsBelow li .titleText {width: 77px; margin-left: 3px}
#videoList ul.thumbsBelow li.active .titleText {color: #cbfe00}
#videoList ul.thumbsRight li img {float: left}
#videoList ul.thumbsRight li .artistText {width: 120px; margin-left: 10px; float: left}
#videoList ul.thumbsRight li .titleText {width: 120px; float: left; margin-left: 10px}
#videoList ul.thumbsRight li.active .titleText {color: #cbfe00}
.scroll-pane {width: 100%; height: 100%; overflow: auto}
.horizontal-only {height: auto}
 .toolbarVisible {height: 45px!important}
#videoToolbar{width:100%; position:absolute; bottom: 0px; left:0px; background:#000; opacity:0.8; height:5px; overflow: hidden; z-index: 10;display: none; -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out}
#videoToolbar ul {list-style: none; margin: 0px; padding: 0px; width: 100%; background: url('http://static.muzu.tv/site/public/20130611/images/html5/player_bottom_bar.png'); background-repeat: repeat-x;}
#videoToolbar li{margin-left:3px; margin-top: 2px;color: #ffffff; font-size: 10px; height: 40px;}
#videoToolbar.advertRunning li.notAllowedForAd{display: none;}
#advertDisplay {display: block; width: 100%; position: absolute; bottom: 0px; left: 0px; font-size: 11px; color: #ffffff; background-color: #000000; opacity: 0.8; z-index: 99;}
#advertDisplay h2{font-size: 12px; color: #ffffff;}
#advertDisplay div{width: 100%;}
#videoPlayer.advertRunning {cursor: pointer}
#videoProgress{height:5px;width:100%;float: left;}
#progressWrapper {position: relative; float: left; height: 5px; width: 100%; background-color:#222;}
.video_time_loaded{position: absolute; top: 0px; left: 0px; width: 0%; background-color:#CBFE00; height:5px;}
.video_time_download{position: absolute; top: 0px; left: 0px; width: 0%; background-color:#444; height:5px}
#playPauseVideo{cursor: pointer; background-repeat: no-repeat; height:18px; width:50px;float: left;margin-right: 10px; margin-left:5px !important;}
.playIcon {background:url("../../../../../../site/public/20130611/images/html5/play.png");}
.pauseIcon {background:url("http://static.muzu.tv/site/public/20130611/images/html5/pause.png");}
#videoTitle{color: #ffffff; font-size: 10px; background-color:#000; padding:2px; padding-top:5px;float: left;overflow: hidden; max-width: 60%; height: 20px!important;}
#videoTitle span{font-family:Arial; font-size:20px; color:#FFF;}
#videoTitle .artistName{color:#777;}
#videoDuration{color: #ffffff; font-size: 10px; background-color:#000; padding:2px;float: right;overflow: hidden; width: 70px;}
#videoDuration span{font-family:Arial; font-size:10px; color:#FFF;}
#muteVideo{cursor: pointer; margin-right: 8px; background-repeat: no-repeat; height:18px; width:55px;float: right}
.muteIcon {background:url("http://static.muzu.tv/site/public/20130611/images/html5/vol_mute.png");}
.unmuteIcon {background:url("http://static.muzu.tv/site/public/20130611/images/html5/volume.png");}
#hdVideo{cursor: pointer; background-repeat: no-repeat; height:18px; width:24px;display: none;float: right;}
#fullscreen{cursor: pointer; background:url("http://static.muzu.tv/site/public/20130611/images/html5/fullscreen.png"); background-repeat: no-repeat; height:18px; width:40px;float: right; margin-top:3px !important;}
#videoScrobble{background-position: center; cursor: pointer; background-repeat: no-repeat; height:36px; width:36px;display: none;float: right; margin-right: 10px;}
.scobbleOnIcon {background:url("http://static.muzu.tv/site/public/20130611/images/html5/scrobble.png");}
.scobbleOffIcon {background:url("http://static.muzu.tv/site/public/20130611/images/html5/scrobble_off.png");}
#scrobbleStatus {padding: 10px; z-index: 20; height: 15px; background-color: #222; border-radius: 5px; position: absolute; top: -10px; right: 40px; color: #ccc;}
#videoToolbar li span{font-family:Arial; color:#FFF}
#videoToolbar .seperate{margin-left:50px;}
#msgBox{height: 100%; width: 100%;position: absolute;display:none;z-index: 12;top: 0px; height: 0px;}
#msgDescription h1{color:#FFF; font-size: 10px; text-align: left; padding: 20px;}
#largePlay {position: absolute; top: 0px; left: 0px; display: none; z-index: 5; width: 100%; height: 100%; margin: 0px; padding: 0px;}
#largePlay div{cursor: pointer; margin: auto; margin-top: 25%; width: 93px; height: 93px; background: url('../../../../../../site/public/20130611/images/html5/play_overlay.png');}
.body_overlay{background:url("http://static.muzu.tv/site/public/20130611/images/html5/body_trans.png"); background-repeat:repeat-x;}
.errorHeader {font-size: 30px; color: #D9FF13}
.errorBody {font-size: 20px; color: #cccccc}
#muzuLogo {position: absolute; width: 93px; height: 15px; z-index: 15; top: 5px; left: 5px; background: url('../../../../../../site/public/20130611/images/html5/video_logo.png'); cursor: pointer; display: none}
#muzuLogo:hover {background: url('http://static.muzu.tv/site/public/20130611/images/html5/video_logo_hover.png');}
#brandLogo {position: absolute; z-index: 15; top: 5px; right: 5px; display: none}
.jspTrack {background: #0c0c0c; width: 10px}
.jspDrag {background: #BEDF2B; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; width: 10px}
.jspVerticalBar {width: 10px}
.jspHorizontalBar {height: 10px}
#contentArea {display: none; margin: 0px; padding: 0px; width: 100%; height: 100%; overflow:hidden; position: absolute; left: 0px; top: 0px}
 #circularG{ position:relative; width:50px; height:50px}
.circularG{ position:absolute; background-color:#cbfe00; width:11px; height:11px; -webkit-border-radius:8px; -moz-border-radius:8px; -webkit-animation-name:bounce_circularG; -webkit-animation-duration:1.04s; -webkit-animation-iteration-count:infinite; -webkit-animation-direction:linear; -moz-animation-name:bounce_circularG; -moz-animation-duration:1.04s; -moz-animation-iteration-count:infinite; -moz-animation-direction:linear; border-radius:8px; -o-animation-name:bounce_circularG; -o-animation-duration:1.04s; -o-animation-iteration-count:infinite; -o-animation-direction:linear; -ms-animation-name:bounce_circularG; -ms-animation-duration:1.04s; -ms-animation-iteration-count:infinite; -ms-animation-direction:linear}
#circularG_1{ left:0; top:20px; -webkit-animation-delay:0.39s; -moz-animation-delay:0.39s; -o-animation-delay:0.39s; -ms-animation-delay:0.39s}
#circularG_2{ left:5px; top:5px; -webkit-animation-delay:0.52s; -moz-animation-delay:0.52s; -o-animation-delay:0.52s; -ms-animation-delay:0.52s}
#circularG_3{ top:0; left:20px; -webkit-animation-delay:0.65s; -moz-animation-delay:0.65s; -o-animation-delay:0.65s; -ms-animation-delay:0.65s}
#circularG_4{ right:5px; top:5px; -webkit-animation-delay:0.78s; -moz-animation-delay:0.78s; -o-animation-delay:0.78s; -ms-animation-delay:0.78s}
#circularG_5{ right:0; top:20px; -webkit-animation-delay:0.9099999999999999s; -moz-animation-delay:0.9099999999999999s; -o-animation-delay:0.9099999999999999s; -ms-animation-delay:0.9099999999999999s}
#circularG_6{ right:5px; bottom:5px; -webkit-animation-delay:1.04s; -moz-animation-delay:1.04s; -o-animation-delay:1.04s; -ms-animation-delay:1.04s}
#circularG_7{ left:20px; bottom:0; -webkit-animation-delay:1.1700000000000002s; -moz-animation-delay:1.1700000000000002s; -o-animation-delay:1.1700000000000002s; -ms-animation-delay:1.1700000000000002s}
#circularG_8{ left:5px; bottom:5px; -webkit-animation-delay:1.3s; -moz-animation-delay:1.3s; -o-animation-delay:1.3s; -ms-animation-delay:1.3s}
@-webkit-keyframes bounce_circularG{ 0%{ -webkit-transform:scale(1)}
100%{ -webkit-transform:scale(.3)}
}
@-moz-keyframes bounce_circularG{ 0%{ -moz-transform:scale(1)}
100%{ -moz-transform:scale(.3)}
}
@-o-keyframes bounce_circularG{ 0%{ -o-transform:scale(1)}
100%{ -o-transform:scale(.3)}
}
@-ms-keyframes bounce_circularG{ 0%{ -ms-transform:scale(1)}
100%{ -ms-transform:scale(.3)}