div.jp-audio {
margin:0; padding:0;
}
div.jp-interface {
position: relative;
width:100%; 
height:38px;
overflow:hidden;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2b2c33+0,2b2c33+49,19191e+50,19191e+50,19191e+100 */
background: #2b2c33; /* Old browsers */
background: -moz-linear-gradient(top,  #2b2c33 0%, #2b2c33 49%, #19191e 50%, #19191e 50%, #19191e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #2b2c33 0%,#2b2c33 49%,#19191e 50%,#19191e 50%,#19191e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #2b2c33 0%,#2b2c33 49%,#19191e 50%,#19191e 50%,#19191e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2c33', endColorstr='#19191e',GradientType=0 ); /* IE6-9 */

/**-webkit-box-shadow: inset 0px -1px 0px 0px rgba(35, 35, 35, 1);
-moz-box-shadow:    inset 0px -1px 0px 0px rgba(35, 35, 35, 1);
box-shadow:         inset 0px -1px 0px 0px rgba(35, 35, 35, 1);**/
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
border:1px solid #202023;
}
div.jp-interface:before { content:""; display:block; width:100%; height:100%; border:1px solid #06090A; box-sizing:border-box; border-radius:.3em; position:absolute; top:0; left:0; }
div.jp-interface:after { width:calc(100% - 2px ); height:calc(100% - 2px ); border-radius:.2em; position:absolute; top:1px; left:1px; border:1px solid #222327; border-bottom:1px solid #2D3035; border-top:1px solid #60626A; content:""; display:block; box-sizing:border-box; }

div.jp-audio div.jp-interface {
height:38px;
}
div.jp-interface ul.jp-controls {
width:100%; height:38px; position:relative;
list-style-type:none;
margin: 0; padding:0;
}
div.jp-interface ul.jp-controls li {
position:absolute;
display:inline;
}
div.jp-interface ul.jp-controls a {
position:absolute;
overflow:hidden;
text-indent:-9999px;
}
a.jp-play,
a.jp-pause { z-index:999!important;
width:38px; height:38px;
display:block;
z-index:1;
border-right:#494d51 0px solid;
/**-webkit-box-shadow: inset -1px 0px 0px 0px rgba(30, 30, 30, 0.6);
-moz-box-shadow:    inset -1px 0px 0px 0px rgba(30, 30, 30, 0.6);
box-shadow:         inset -1px 0px 0px 0px rgba(30, 30, 30, 0.6);**/
}
div.jp-audio a.jp-play,
div.jp-audio a.jp-pause {
top:0; 
left:0;
}
a.jp-play {
background:URL(../img/play.png) no-repeat center center;
}
a.jp-pause {
background:URL(../img/pause.png) no-repeat center center;
display:none;
}
div.jp-progress { z-index:99;
position:absolute;
overflow:hidden;
}
div.jp-audio div.jp-progress {
top:14px; 
left:0;
width:100%;
height:10px;
padding:0 117px 0 50px;
box-sizing:border-box;
}
.jp-state-no-volume div.jp-progress {
padding-right:14px !important;
}
div.jp-bg-bar {
background:#40414A;
width:100%;
height:8px;
border:#262929 0px solid;
cursor:pointer;
}
div.jp-play-bar {
	background-color:#FE00EE;
width:0px; 
height:8px; 
padding:0;
}
div.jp-audio li.muteClass { 
width:24px; height:38px;
position:absolute;
right:80px; top:0;
padding:0 0 0 8px;
border-left:#494d51 0px solid;
/**-webkit-box-shadow: inset 1px 0px 0px 0px rgba(30, 30, 30, 0.6);
-moz-box-shadow:    inset 1px 0px 0px 0px rgba(30, 30, 30, 0.6);
box-shadow:         inset 1px 0px 0px 0px rgba(30, 30, 30, 0.6);**/
}
.jp-state-no-volume li.muteClass {
display:none !important;	
}
a.jp-mute,
a.jp-unmute {
width:20px; height:38px;
overflow:hidden;
display:block;
z-index:3;
}
div.jp-audio a.jp-mute,
div.jp-audio a.jp-unmute {

}
a.jp-mute {
background:URL(../img/volume.png) no-repeat center center;
}
a.jp-unmute {
background:URL(../img/volume_off.png) no-repeat center center;
display: none;
}
div.jp-volume-bar {
position: absolute;
overflow:hidden;
background:#40414A;
width:60px;
height:8px;
border:#262929 0px solid;
cursor:pointer;
box-sizing:border-box;
}
div.jp-audio div.jp-volume-bar {
top:14px; 
right:10px;
z-index:9999;
}
div.jp-volume-bar-value {
background-color:#FE00EE;
width:0px; height:8px;
padding:0;
}

.jp-playlist-item-remove { display:none !important; }

@media screen and (max-width:700px) {
a.jp-play {
background:URL(../img/play_sp.png) no-repeat center center; background-size:16px 16px;
}

a.jp-pause {
background:URL(../img/pause_sp.png) no-repeat center center; background-size:16px 16px;
}

a.jp-mute {
background:URL(../img/volume_sp.png) no-repeat center center; background-size:16px 16px;
}
a.jp-unmute {
background:URL(../img/volume_off_sp.png) no-repeat center center; background-size:16px 16px;
}

div.jp-play-bar {
background-color:#FE00EE;
}

div.jp-volume-bar-value {
background-color:#FE00EE;
}
}