.jp-jplayer {
width: 0;
height: 0;
box-sizing: border-box;
width: 100%;
}
.jp-audio {
margin: 0 auto;
width: 100%;
max-width: 100%;
padding: 0;
color: #fff;
}
.jp-audio a {
text-decoration: none;
color: #fff;
font-size: 0px;
}
.jp-audio a i {
font-size: 18px;
}
.jp-audio a:hover {
color: #69c201;
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
-ms-transition: none;
transition: none;
}
.jp-interface {
position: relative;
height: 86px;
width: 100%;
background-color: #444;
}
.jp-details > ul {
list-style: none outside none;
margin: 0 0 0 30px;
padding: 0;
height: 40px;
line-height: 40px;
}
.jp-details > ul .jp-title {
font-size: 18px;
font-weight: 300;
} .jp-progress {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
margin: 0 15px 0 30px;
height: 100%;
float: left;
}
.jp-seek-bar {
position: absolute;
height: 10px;
background-color:  #fff;
margin: auto;
top:0;
bottom: 0;
}
.jp-play-bar {
height: 100%;
background: #69c201;
position: absolute;
top: 0;
left: 0;
-webkit-animation: progress 0.75s linear infinite;
-moz-animation: progress 0.75s linear infinite;
-o-animation: progress 0.75s linear infinite;
-ms-animation: progress 0.75s linear infinite;
animation: progress 0.75s linear infinite;
} .jp-controls {
float: left;
height: 86px;
line-height: 86px;
list-style-type: none;
margin: 0;
padding: 0 0px 0 30px;
z-index: 100;
}
.jp-controls > li {
display: inline;
}
.jp-controls > li > a{ }
.jp-controls > li:first-child a {
padding-left: 0px;
}
.jp-controls > li:last-child a {
padding-right: 0px;
}
.jp-volume {
position: absolute;
right: 0;
float: right;
padding: 0 15px 0 0;
}
.jp-volume > li > a {
padding: 0px;
}
.jp-volume > li > a > i {
width: 20px;
}
.jp-play-pause {
width: 46px;
} .jp-volume-bar {
z-index: 99;
width: 65px;
height: 10px;
cursor: pointer;
background: #fff;
display: inline-block;
position: relative;
}
.jp-volume-bar-value {
width: 0px;
height: 10px;
} .jp-play-bar,
.jp-volume-bar-value {
-webkit-background-size: 7px 7px;
-moz-background-size: 7px 7px;
-o-background-size: 7px 7px;
background-size: 7px 7px;
background-color: #69c201;
} .jp-time-holder {
display: none;
visibility: hidden;
} .jp-toggles {
display: none;
visibility: hidden;
}