body {
	margin:0;
	padding:0;
	overflow:hidden;
	line-height:14px !important;
	font-family:Verdana, Arial, sans-serif;
	font-size:11px;
	background-color:#2f649b !important;
	
}




/*********** MAIN Player ****************/
.jp-title, .jp-time-holder{
	font-size:9px; /* 1.25em for testing in site pages */ /* No parent CSS that can effect the size in the demos ZIP */
	font-weight:bold;
}
a.jp-play, a.jp-pause {
	width:46px;
	height:46px;
	display:block;
	text-indent: -9999px;
}

a.jp-pause {
	background: url("playlist.png") 0 -76px no-repeat;
}
a.jp-pause:hover {
	background: url("playlist.png") 0 -122px no-repeat;
}
a.jp-play {
	background: url("playlist.png") -46px -76px no-repeat;
}
a.jp-play:hover {
	background: url("playlist.png") -46px -122px no-repeat;
}
a.jp-stop, a.jp-previous, a.jp-next  {
	width:26px;
	height:26px;
	display:block;
	text-indent: -9999px;
}
a.jp-stop {
	background: url("playlist.png") -26px 0 no-repeat;
}
a.jp-stop:hover {
	background: url("playlist.png") -26px -26px no-repeat;
}
a.jp-previous {
	background: url("playlist.png") 0 0 no-repeat;
}
a.jp-previous:hover {
	background: url("playlist.png") 0 -26px no-repeat;
}
a.jp-next {
	background: url("playlist.png") -52px 0 no-repeat;
}
a.jp-next:hover {
	background: url("playlist.png") -52px -26px no-repeat;
}

.jp-current-time, .jp-duration {
	color:white;
	font-size:9px;
}



.jp-playlist a{
	padding-left:20px;
	background: url("playlist.png") -160px 3px no-repeat;
}
.jp-playlist a:hover, .jp-playlist-current a{
	background: url("playlist.png") -160px -12px no-repeat;
	color:#f7c500;
}

/** progress bar **/
div.jp-progress {
	height:7px;
	width:340px;
	overflow:hidden;
	background: url("playlist.png") 0px -66px repeat-x;
}

div.jp-seek-bar {
	background: url("playlist.png") 0px -52px repeat-x;
	width:0px;
	height:100%;
	cursor: pointer;
}
div.jp-play-bar {
	background: url("playlist.png") 0px -59px repeat-x;
	width:0px;
	height:100%;
}
/** end progress bar **/



/** volume bar **/
div.jp-volume-bar {
	position: absolute;
	overflow:hidden;
	background: url("playlist.png") 0px -52px repeat-x;
	height:7px;
	cursor: pointer;
	width:88px;
}

div.jp-volume-bar-value {
	background: url("playlist.png") 0px -59px repeat-x;
	width:0px;
	height:100%;
}
/** end volume bar **/


/** mute | unmute | max-volume **/
a.jp-mute,
a.jp-unmute,
a.jp-volume-max {
	position:absolute;
	width:20px;
	height:14px;
	display:block;
	text-indent: -9999px;
}
a.jp-mute {
	background: url("playlist.png") -78px 0px repeat-x;
}
a.jp-mute:hover {
	background: url("playlist.png") -78px -15px repeat-x;
}
a.jp-unmute {
	background: url("playlist.png") -122px 0px repeat-x;
}
a.jp-unmute:hover {
	background: url("playlist.png") -122px -15px repeat-x;
}
a.jp-volume-max {
	background: url("playlist.png") -100px 0px repeat-x;
}
a.jp-volume-max:hover {
	background: url("playlist.png") -100px -15px repeat-x;
} 
ul.jp-controls li {
	display:inline;
	float: left;
}
/**  @end mute | unmute | max-volume **/

.jp-title {
	width:430px;
	height:24px;
	padding:10px;
	color:#FFF;
	background: url("playlist.png") 0 -380px no-repeat;
	font-size:11px;

}






/** position **/
a.jp-play, a.jp-pause {
	position:absolute;
	top:10px;
	left:10px;
}
a.jp-stop {
	position:absolute;
	top:21px;
	left:58px;
}


a.jp-mute, a.jp-unmute {
	position:absolute;
	top:64px;
	left:410px;
}
div.jp-volume-bar {
	top:68px;
	left:434px;
}

a.jp-volume-max {
	position:absolute;
	top:64px;
	left:528px;
}


.jp-title {
	position:absolute;
	top:15px;
	left:100px;
}


.jp-progress {
	position:absolute;
	top:68px;
	left:15px;
}
.jp-current-time, .jp-duration {
	position:absolute;
	top:75px;
	left:15px;
}
.jp-current-time {
	left:15px;
}
.jp-duration {
	left:322px;
}

/** @end position ***/






/********* PC STYLES **********/
@media handheld, only screen and (min-width: 500px) {
	#container {
		display:block;
		width: 577px;
		height: 97px;
		font-family:Verdana, Arial, sans-serif;
		font-size:10px;
		/*border:1px solid red;*/
	}


}

/********* Mobile STYLES **********/
@media handheld, only screen and (max-width: 500px) {
	#container {
		display:block;
		width: 266px;
		height: 138px;
		font-family:Verdana, Arial, sans-serif;
		font-size:10px;
		/*border:1px solid red;*/
	}
	
	.jp-progress {
		top:108px;
		width:240px !important;
	}
	.jp-current-time, .jp-duration {
		top:115px;
	}
	.jp-current-time {
		left:15px;
	}
	
	.jp-duration {
		left:224px;
	}
	
	.jp-title {
		top:60px;
		left:15px;
		width:220px !important;
		font-size:8px;
	}

	a.jp-mute, a.jp-unmute {
		top:24px;
		left:110px;
	}
	div.jp-volume-bar {
		top:28px;
		left:134px;
	}

	a.jp-volume-max {
		top:24px;
		left:228px;
	}
	
}