.interface{
	display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
	-webkit-align-content:center;
	align-content:center;

   -webkit-align-items: center;
    align-items: center;

}

ul.jp-controls {
margin: 0;
padding: 0;
}

.jp-progress{
margin-left: 5px;
margin-right: 5px;
background-color: #414141;
-webkit-flex-grow: 1;
flex-grow: 1;

height: 10px;
}

div.jp-current-time {
margin-top: 3px;
font-size: 0.8em;
}

.player-button {
	position:relative;
  width: 20px;
height: 20px;
   background-color:#8b8b8b;
   -webkit-border-radius:100%;
   border-radius:100%;

   -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
   box-shadow: 1px 1px 1px rgba(0,0,0,0.2);

}

.player-button:hover{
	background-color:#999;
}

.bright{
background-color: #CECECE;
-webkit-box-shadow: 0px 0px 4px rgba(255,255,255,0.5);
box-shadow: 0px 0px 4px rgba(255,255,255,0.5);

}

.bright:hover{
	-webkit-box-shadow:none;
	box-shadow:none;

}

.icon_play {
   top:11%;
   left:35%;
   position:relative;
   width: 0;
   height: 0;
   padding-top:40%;
   padding-bottom:40%;
   padding-left:40%;
   overflow:hidden;
}

.icon_play:after{
   content:"";
   display:block;
   width: 0;
   height: 0;
   margin-top:-500px;
   margin-left:-800px;
   border-top:500px solid transparent;
   border-bottom:500px solid transparent;
   border-left:800px solid #464646;
}

.icon_stop {
   top:34%;
   left:34%;
   position:relative;
   width: 35%;
   height: 35%;
   background-color: #464646;
}

div.jp-seek-bar {
width: 0px;
height: 100%;
cursor: pointer;
box-shadow: inset 1px 1px 2px #363636;
}

div.jp-play-bar {
background-color: #7e7e7e;
width: 0px;
height: 100%;
box-shadow: inset 0px 0px 2px #4a4a4a;
}

.jp-audio li{
	list-style:none;
}

.jp-playlist ul{
	list-style-type:none;
	padding-left:0px;
}

.jp-playlist li{

}

.jp-playlist a{
   display: block;
   text-decoration:none;
   color: #777;
   padding-left: 5px;
   margin-bottom: 1px;
}

a.jp-playlist-item.jp-playlist-current {
/*
color: rgba(255,255,255,0.43);
*/
}



.jp-playlist a:hover{
color: rgba(255, 255, 255, 0.5);
background-color: rgba(255, 255, 255, 0.07);
box-shadow: inset 1px 1px 3px rgba(0,0,0,0.2);
}

/******************** Tablet ***************************/

@media only screen and (max-width:900px){
	.player-button {
   width:22px;
   height:22px;
}
	.jp-progress{
height: 20px;
margin-left: 10px;
margin-right: 7px;
}

.jp-playlist a{
   padding: 7px;
   padding-left: 10px;
}
}

/******************** Mobile ***************************/
@media only screen and(max-width:650px){
.player-button {
   width:40px;
   height:40px;
}
	.jp-progress{
height: 30px;
margin-left: 10px;
margin-right: 0px;
}

div.jp-current-time {
display:none;
}

.jp-playlist a{
   padding: 10px;
   padding-left: 13px;
}
}




