.jpA1 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(211, 220, 249), rgb(181, 190, 219));
	background-image: -moz-linear-gradient(top, rgb(211, 220, 249), rgb(181, 190, 219));
	background-image: -o-linear-gradient(top, rgb(211, 220, 249), rgb(181, 190, 219));
	background-image: -ms-linear-gradient(top, rgb(211, 220, 249), rgb(181, 190, 219));
	background-image: linear-gradient(top, rgb(211, 220, 249), rgb(181, 190, 219));
}

.jpA2 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(226, 195, 265), rgb(196, 165, 235));
	background-image: -moz-linear-gradient(top, rgb(226, 195, 265), rgb(196, 165, 235));
	background-image: -o-linear-gradient(top, rgb(226, 195, 265), rgb(196, 165, 235));
	background-image: -ms-linear-gradient(top, rgb(226, 195, 265), rgb(196, 165, 235));
	background-image: linear-gradient(top, rgb(226, 195, 265), rgb(196, 165, 235));
}

.jpA3 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(264, 237, 182), rgb(234, 207, 152));
	background-image: -moz-linear-gradient(top, rgb(264, 237, 182), rgb(234, 207, 152));
	background-image: -o-linear-gradient(top, rgb(264, 237, 182), rgb(234, 207, 152));
	background-image: -ms-linear-gradient(top, rgb(264, 237, 182), rgb(234, 207, 152));
	background-image: linear-gradient(top, rgb(264, 237, 182), rgb(234, 207, 152));
}

.jpA4 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(256, 165, 198), rgb(226, 135, 168));
	background-image: -moz-linear-gradient(top, rgb(256, 165, 198), rgb(226, 135, 168));
	background-image: -o-linear-gradient(top, rgb(256, 165, 198), rgb(226, 135, 168));
	background-image: -ms-linear-gradient(top, rgb(256, 165, 198), rgb(226, 135, 168));
	background-image: linear-gradient(top, rgb(256, 165, 198), rgb(226, 135, 168));
}

.jpA5 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(234, 254, 183), rgb(204, 224, 153));
	background-image: -moz-linear-gradient(top, rgb(234, 254, 183), rgb(204, 224, 153));
	background-image: -o-linear-gradient(top, rgb(234, 254, 183), rgb(204, 224, 153));
	background-image: -ms-linear-gradient(top, rgb(234, 254, 183), rgb(204, 224, 153));
	background-image: linear-gradient(top, rgb(234, 254, 183), rgb(204, 224, 153));
}

.jpA6 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(188, 245, 230), rgb(158, 215, 200));
	background-image: -moz-linear-gradient(top, rgb(188, 245, 230), rgb(158, 215, 200));
	background-image: -o-linear-gradient(top, rgb(188, 245, 230), rgb(158, 215, 200));
	background-image: -ms-linear-gradient(top, rgb(188, 245, 230), rgb(158, 215, 200));
	background-image: linear-gradient(top, rgb(188, 245, 230), rgb(158, 215, 200));
}

.jpA7 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(205, 252, 262), rgb(175, 222, 232));
	background-image: -moz-linear-gradient(top, rgb(205, 252, 262), rgb(175, 222, 232));
	background-image: -o-linear-gradient(top, rgb(205, 252, 262), rgb(175, 222, 232));
	background-image: -ms-linear-gradient(top, rgb(205, 252, 262), rgb(175, 222, 232));
	background-image: linear-gradient(top, rgb(205, 252, 262), rgb(175, 222, 232));
}

.jpA8 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(280, 237, 254), rgb(250, 207, 224));
	background-image: -moz-linear-gradient(top, rgb(280, 237, 254), rgb(250, 207, 224));
	background-image: -o-linear-gradient(top, rgb(280, 237, 254), rgb(250, 207, 224));
	background-image: -ms-linear-gradient(top, rgb(280, 237, 254), rgb(250, 207, 224));
	background-image: linear-gradient(top, rgb(280, 237, 254), rgb(250, 207, 224));
}

.jpA9 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(242, 238, 229), rgb(212, 208, 199));
	background-image: -moz-linear-gradient(top, rgb(242, 238, 229), rgb(212, 208, 199));
	background-image: -o-linear-gradient(top, rgb(242, 238, 229), rgb(212, 208, 199));
	background-image: -ms-linear-gradient(top, rgb(242, 238, 229), rgb(212, 208, 199));
	background-image: linear-gradient(top, rgb(242, 238, 229), rgb(212, 208, 199));
}

.jpA10 {
  border-radius:5px;
	background-image: -webkit-linear-gradient(top, rgb(281, 257, 169), rgb(251, 227, 139));
	background-image: -moz-linear-gradient(top, rgb(281, 257, 169), rgb(251, 227, 139));
	background-image: -o-linear-gradient(top, rgb(281, 257, 169), rgb(251, 227, 139));
	background-image: -ms-linear-gradient(top, rgb(281, 257, 169), rgb(251, 227, 139));
	background-image: linear-gradient(top, rgb(281, 257, 169), rgb(251, 227, 139));
}

.yellowbtn {
  height: 26px;
  border: 1px solid #ffc727;
  border-radius: 5px;
  color: #000;
  text-shadow: 1px 1px 1px #fff6e9;
  cursor: pointer;
	background-image: -webkit-linear-gradient(top, #fff6e9 0%,#ffaa00 100%);
	background-image: -moz-linear-gradient(top, #fff6e9 0%,#ffaa00 100%);
	background-image: -o-linear-gradient(top, #fff6e9 0%,#ffaa00 100%);
	background-image: -ms-linear-gradient(top, #fff6e9 0%,#ffaa00 100%);
	background-image: linear-gradient(top, #fff6e9 0%,#ffaa00 100%);
}

@media screen and (min-width: 300px) {
  .jp-progress {
  	width: 45%;
  }
  
  .separator {
  	width: 0.5%;
  	margin-right: 1.78%;
  }
  
  .jp-audio .jp-current-time {
  	margin-left: 1.78%;
  	min-width: 30px;
  }
  
  .jp-audio .jp-duration {
  	margin-right: 1.78%;
  	min-width: 30px;
  }
  
  .time-sep {
  	margin: 13px 0.3% 0 0.3%;
  }
}  

@media screen and (min-width: 310px) {
  .jp-progress {
  	width: 44%;
  }
}

@media screen and (min-width: 340px) {
  .jp-progress {
  	width: 46%;
  }
}

@media screen and (min-width: 370px) {
  .jp-progress {
  	width: 50%;
  }
}

@media screen and (min-width: 400px) {
  .jp-progress {
  	width: 52%;
  }
}

@media screen and (min-width: 450px) {
  .jp-progress {
  	width: 60%;
  }
}

@media screen and (min-width: 560px) {
  .jp-progress {
  	width: 68%;
  }
}

@media screen and (min-width: 730px) {
  .jp-progress {
  	width: 72%;
  }
}

.jp-interface {
	position: relative;
	height: 35px;
}

div.jp-controls-holder {
	clear: both;
	margin: 0;
	
	position: relative;
	overflow: hidden;
}

a.jp-play,
a.jp-pause {
	width: 9%;
	min-width: 35px;
	max-width: 45px;
	height: 35px;
	float: left;
	text-indent: -9999px;
	outline: none;
	margin-top: 2px;
}

a.jp-play {
	background: url(images/sprite.png) 0 0 no-repeat;
}

a.jp-pause {
	background: url(images/sprite.png) -40px 0 no-repeat;
	display: none;
}

.separator {
	background-image: url(images/separator.png);
	background-repeat: no-repeat;
	height: 35px;
	float: left;
	margin-top: 8px;
}

.jp-progress {
	background: #706d6d;

	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;

	-webkit-box-shadow:
		inset 0px 1px 4px rgba(0,0,0,.4),
		0px 1px 0px rgba(255,255,255,.4);
	-moz-box-shadow:
		inset 0px 1px 4px rgba(0,0,0,.4),
		0px 1px 0px rgba(255,255,255,.4);
	box-shadow:
		inset 0px 1px 4px rgba(0,0,0,.4),
		0px 1px 0px rgba(255,255,255,.4);

	height: 10px;
	float: left;
	margin-top: 15px;
}

.jp-seek-bar {
	width: 0px;
	height: 100%;
	cursor: pointer;
}

.jp-seeking-bg {
	background: #575555;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}

.jp-play-bar {
	background: url(images/play-bar.png) left repeat-x;
	width: 0px;
	height: 10px;
	position: relative;
	z-index: 9999;
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}

.jp-play-bar span {
	position:absolute;
	top: -3px;
  right: -12px;

	background:url(images/handle.png) no-repeat center;
	width: 16px;
	height: 17px;
}

.jp-current-time,
.jp-duration {
	font-size: 11px;
	font-family: Arial;
	color: #444444;
	margin-top: 12px;
	float: left;
}
.jp-current-time {
	float: left;
	display: inline;
}
.jp-duration {
	float: left;
	display: inline;
	text-align: right;
}

.time-sep {
	float: left;

	font-size: 11px;
	font-family: Arial;
	color: #444444;
}