html { 
  background: url(../images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
body {
	font-family: arial, helvetica, sans-serif;
}
.jp-audio {
	
	width: 420px;
	margin: 5% auto;
}
.player-header{background-color: #fff;}
.jp-interface {background-color: rgba(255, 255, 255, 0.7); margin-top:0px; padding: 25px;}
.player-inner img {
	margin: 0 auto;
	display: block;
}
.center-text {
	text-align: center;
}
.center-img {
	display: block;
	margin: 0 auto;
	max-width: 100%
}
.jp-controls {
	text-align: center;
	margin: 25px auto 30px auto;
}
.jp-volume-controls {
	margin: 0 auto 20px auto;
	display: block;
	width: 200px;
}
.jp-volume-bar {
	background-color: #000;
	width: 197px;
	height: 6px;
	overflow: hidden;
	cursor: pointer;
	margin: 0 auto;
}
.jp-volume-bar-value {
	height: 6px;
	background-color: #0D9849;
}
.jp-volume-max {
	float: right;
}
.jp-controls button {
	border-radius: 100px;
	background-color: rgba(126, 19, 14, 0.6);
	color: #fff;
	padding: 20px 25px;
	cursor: pointer;
	border: 3px solid #fff;
	
}
.jp-controls button:hover {
	background-color: rgba(126, 19, 14, 1);
}
.jp-volume-controls button {
	border: none;
	background-color: transparent;
	color: #0D9849;
	cursor: pointer;
	font-size: 18px;
	padding: 5px 0;
}
.channel-buttons {background-color: #fff;  margin-top:-18px; height: 40px; }
.channel-buttons ul {margin:0;padding:0;  display: block;}
.channel-buttons ul li {list-style:none; float:left;padding: 10px;border-right: 1px solid #ccc;}
.channel-buttons ul li:last-child {border-right: none;}
.channel-buttons ul li a { font-size: 12px;background-color: #fff; cursor: pointer; color: #000; text-decoration: none;}
.channel-buttons ul li a:hover {color: green;}
.channel-buttons ul li a.active {color: red; font-weight: bold;}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

@media screen and (max-width:767px) {
html { 
  background: url(../images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: inherit;
  -moz-background-size: inherit;
  -o-background-size: inherit;
  background-size: inherit;
}
.jp-audio {
	width: 95%;
}
.jp-volume-controls {
	display: none;
}
.jp-controls {
	margin-bottom: 15px;
}
img {
	max-width: 80%;
}
.channel-buttons ul li {text-align: center; float: none; display:block; background-color: #fff; border-bottom: 1px solid #ccc;}
}

@media screen and (min-width:768px) {
img.paradisus {
	margin-bottom: 25px;
}
}
