.su-audio {
position:relative;
width:100%;
height:30px;
margin-bottom:1.5em;
background:#555;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}

.su-audio .jp-play,.su-audio .jp-pause {
	display:block;
	width:30px;
	height:30px;
	border-right:1px solid #454947;
	color: #ddd;
}

.su-audio .jp-play:after, .su-audio .jp-pause:after {
	font-family: FontAwesome;
	position: absolute;
	left: 12px;
	top: 5px;
}
.su-audio .jp-play:after {content: "\f04b";}
.su-audio .jp-pause:after {content: "\f04c";}

.su-audio .jp-current-time,.su-audio .jp-duration {
position:absolute;
top:0;
display:block;
height:30px;
line-height:30px;
font-size:10px;
color:#eee;
text-shadow:0 -1px 0 #000;
-moz-text-shadow:0 -1px 0 #000;
-webkit-text-shadow:0 -1px 0 #000;
}

.su-audio .jp-current-time {
left:45px;
}

.su-audio .jp-duration {
right:85px;
}

.su-audio .jp-seek-bar,.su-audio .jp-play-bar {
position:absolute;
top:0;
left:0;
height:10px;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
cursor:pointer;
}

.su-audio .jp-progress {
position:absolute;
top:10px;
left:85px;
right: 125px;
height:10px;
background:#333;
box-shadow:0 0 5px #000 inset;
-moz-box-shadow:0 0 5px #000 inset;
-webkit-box-shadow:0 0 5px #000 inset;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}

.su-audio span.jp-mute, span.jp-unmute {
	position: absolute;
	right: 65px;
	top: 7px;
	line-height: normal;
	color: #fff;
	height: 19px;
	width: 13px;
}


.su-video span.jp-mute, .su-video span.jp-unmute {
	position: absolute;
	right: 90px;
	top: 7px;
	line-height: normal;
	color: #fff;
	height: 19px;
	width: 13px;
}

span.jp-mute:after {
	font-family: FontAwesome;
	content: "\f028";
}
span.jp-unmute:after {
	font-family: FontAwesome;
	content: "\f026";
}


.su-video .jp-seek-bar,
.su-audio .jp-seek-bar {
background:#0b0b0b;
	background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
	background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 10%, transparent 10%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
	-webkit-background-size:20px 20px;
	-moz-background-size:20px 20px;
	-o-background-size:20px 20px;
	background-size:20px 20px;
	-webkit-animation:progress-bar-stripes 2s linear infinite;
	-moz-animation:progress-bar-stripes 2s linear infinite;
	-ms-animation:progress-bar-stripes 2s linear infinite;
	-o-animation:progress-bar-stripes 2s linear infinite;
	animation:progress-bar-stripes 2s linear infinite;
}

@-webkit-keyframes progress-bar-stripes {
   100% { background-position: -40px 0px; }
}

@keyframes progress-bar-stripes {
   100% { background-position: -40px 0px; }
}

.su-audio .jp-play-bar {
background:#6db3f2;
}

.su-video {
position:relative;
margin-bottom:1.5em;
overflow:hidden;
}

.su-video .jp-title {
position:absolute;
top:-100px;
left:0;
width:100%;
height:30px;
padding:0 1em;
line-height:30px;
font-size:.9em;
background:rgba(0,0,0,0.5);
color:#fff;
transition:top .2s;
-o-transition:top .2s;
-ie-transition:top .2s;
-moz-transition:top .2s;
-webkit-transition:top .2s;
}

.su-video:hover .jp-title {
top:0;
}

.su-video .jp-start {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
cursor:pointer;
-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity:0.5;
opacity:0.5;
transition:opacity .2s;
-moz-transition:opacity .2s;
-webkit-transition:opacity .2s;
-o-transition:opacity .2s;
background:50% 50% url(../images/player/default-start.png) no-repeat;
}

.su-video:hover .jp-start {
-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity:0.8;
opacity:0.8;
}

.su-video.jp-video-full {
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
}

.su-video.jp-video-full .jp-jplayer {
position:fixed!important;
left:0;
top:0;
overflow:hidden;
}

.su-video .jp-gui {
position:relative;
height:30px;
background:#555;
-webkit-border-bottom-right-radius:3px;
-webkit-border-bottom-left-radius:3px;
-moz-border-radius-bottomright:3px;
-moz-border-radius-bottomleft:3px;
border-bottom-right-radius:3px;
border-bottom-left-radius:3px;
}

.su-video.jp-video-full .jp-gui {
position:fixed;
left:0;
bottom:0;
width:100%;
}

.su-video-controls-no .jp-gui {
position:absolute!important;
bottom:-100px;
left:0;
right:0;
transition:bottom .2s;
-o-transition:bottom .2s;
-ie-transition:bottom .2s;
-moz-transition:bottom .2s;
-webkit-transition:bottom .2s;
}

.su-video-controls-no:hover .jp-gui {
bottom:0;
}

.su-video img {
border-radius:0!important;
-moz-border-radius:0!important;
-webkit-border-radius:0!important;
border:none!important;
margin:0!important;
padding:0!important;
}

.su-video .jp-gui .jp-play,.su-video .jp-gui .jp-pause {
position:absolute;
left:0;
top:0;
display:block;
width:30px;
height:30px;
border-right:1px solid #454947;
cursor:pointer;
}

.su-video .jp-gui .jp-play {
background:0 0 url(../images/player/default.png) no-repeat;
}

.su-video .jp-gui .jp-pause {
background:-30px 0 url(../images/player/default.png) no-repeat;
}

.su-video .jp-full-screen,.su-video .jp-restore-screen {
position:absolute;
top:0;
right:0;
display:block;
width:30px;
height:30px;
border-left:1px solid #454947;
cursor:pointer;
}

.su-video .jp-full-screen {
background:0 -30px url(../images/player/default.png) no-repeat;
}

.su-video .jp-restore-screen {
background:-30px -30px url(../images/player/default.png) no-repeat;
}

.su-video .jp-progress {
position:absolute;
top:10px;
left:90px;
right: 150px;
height:10px;
background:#333;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
box-shadow:0 0 5px #000 inset;
-moz-box-shadow:0 0 5px #000 inset;
-webkit-box-shadow:0 0 5px #000 inset;
}

.su-video .jp-seek-bar,.su-video .jp-play-bar {
position:absolute;
top:0;
left:0;
height:100%;
cursor:pointer;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}


.su-video .jp-play-bar {
background:#6db3f2;
}

.su-video .jp-current-time,.su-video .jp-duration {
	position:absolute;
	top:0;
	display:block;
	height:30px;
	line-height:30px;
	color:#f5f5f5;
	font-size:10px;
}


.su-video .jp-current-time {
left:50px;
}

.su-video .jp-duration {
right:115px;
}


a.jp-mute,
a.jp-unmute {
	width:18px;
	height:15px;
}
div.jp-audio div.jp-type-single a.jp-mute,
div.jp-audio div.jp-type-single a.jp-unmute {
	top:32px;
	left:274px;
}
div.jp-audio div.jp-type-playlist a.jp-mute,
div.jp-audio div.jp-type-playlist a.jp-unmute {
	top:0px;
	left:200px;
}
div.jp-video a.jp-mute,
div.jp-video a.jp-unmute {
	top:27px;
}
div.jp-video-270p div.jp-type-single a.jp-mute,
div.jp-video-270p div.jp-type-single a.jp-unmute {
	left:304px;
}
div.jp-video-270p div.jp-type-playlist a.jp-unmute,
div.jp-video-270p div.jp-type-playlist a.jp-mute {
	left:363px;
}
div.jp-video-360p div.jp-type-single a.jp-mute,
div.jp-video-360p div.jp-type-single a.jp-unmute {
	left:384px;
}
div.jp-video-360p div.jp-type-playlist a.jp-mute,
div.jp-video-360p div.jp-type-playlist a.jp-unmute {
	left:443px;
}
a.jp-mute {
	background: url(audio_on.png) no-repeat 0 0;
}
a.jp-mute:hover {
	background: url(audio_on_2.png) no-repeat 0 0;
}
a.jp-unmute {
	background: url(audio_off.png) no-repeat 0 0;
	display: none;
}
a.jp-unmute:hover {
	background: url(audio_off_2.png) no-repeat 0 0;
}
div.jp-audio div.jp-type-single div.jp-volume-bar {
top: 10px;
right: 12px;
}
div.jp-volume-bar {
position: absolute;
overflow: hidden;
background: #222;
width: 46px;
height: 10px;
cursor: pointer;
border-radius: 2px;
}

.su-video div.jp-volume-bar {
right: 40px;
top: 10px;
}


div.jp-audio div.jp-type-playlist div.jp-volume-bar {
	top:5px;
	left:229px;
}

div.jp-volume-bar-value {
	background: #ddd;
	height:10px;
}