/*
 * Skin for jPlayer Plugin (jQuery JavaScript Library)
 * http://www.happyworm.com/jquery/jplayer
 *
 * Skin Name: Blue Monday
 *
 * Copyright (c) 2010 Happyworm Ltd
 * Dual licensed under the MIT and GPL licenses.
 *  - http://www.opensource.org/licenses/mit-license.php
 *  - http://www.gnu.org/copyleft/gpl.html
 *
 * Author: Silvia Benvenuti
 * Skin Version: 3.0 (jPlayer 2.0.0)
 * Date: 20th December 2010
 */


/**** The background player functionality with flash container ****/
div.jp-jplayer, *.hiddenPlayer {
	position:relative;
	/*left:23px; top:40px;*/
	width:0; height:0;
	/*overflow:hidden;
	visibility:hidden;*/  /** hidden flash doesn't work in ie **/
	border:0;
	background:transparent;
}


/** The visible controll Interface **/
div.jp-audio {
	position:absolute; z-index:300;
	display:block;
	/*float:left;
	display:inline;*/
	left:-10px; bottom:2px;
	/*width:50px; height:32px;*/
	background:transparent;
	/*border:0 none;*/
	text-align:left;
	/*
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	*/
	/*overflow:visible;*/
}
div.jp-type-playlist {
	overflow:visible;
	position:absolute;
	top:0; /* 3px */
	padding:3px 0 0 0;
	/*background:url(../img/menu/mac-bg02.png) repeat;*/
	/*background:#333;*/
	background:transparent;
}
div.jp-type-playlist div.ieSpacer {
	position:absolute; left:0; top:0; width:100%; height:10px;
	border:0;
	/*background:#333\9;
	filter:alpha(opacity=1);*/
	background:transparent url('../img/null.gif') 0 0 repeat;
}
div.jp-interface {
/*border:1px solid yellow;*/

	position:relative; z-index:300;
	background:#333;
	/*width:100%;
	overflow:visible;*/

	/*position:absolute;*/
	left:0; top:0;  /*bottom:-3px;*/
/****



TODO geht das auch mit dynamischer Breite ???



****/
	width:220px;
	/*background:url(../img/menu/mac-bg02.png) repeat;*/

	display:none;
}
/*.menu li.player.csshover div.jp-interface {
	display:none;
}*/
.menu li.player.csshover:hover div.jp-interface,
.menu li.player.csshover div.jp-interface:hover {
	display:block;
}
/*div.jp-audio div.jp-type-playlist div.jp-interface {
	height:32px;
}*/
div.jp-interface ul.jp-controls {
	list-style-type:none;
	position:absolute;
	padding:0;
	margin: 0;
	z-index:15;
}
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;
	padding:0;
	z-index:20;
}
div.jp-interface ul.jp-controls a img {
	position:absolute;
	border:none; margin:0; padding:0;
	/*background:transparent;
	zoom: 1;
	/*-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
	/*filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); /* IE6 & 7 */
}
div.jp-audio div.jp-type-playlist a.jp-play,
div.jp-audio div.jp-type-playlist a.jp-pause {
	left:10px;
	top:10px;
	width:32px;
	height:32px;
	z-index:1;
}

a.jp-play { background:transparent url("../img/player/buttons01.gif") 0 0 no-repeat; }
a.jp-play:hover { background:transparent url("../img/player/buttons01.gif") -32px 0 no-repeat; }
a.jp-pause { background:transparent url("../img/player/buttons01.gif") 0 -32px no-repeat; display: none; }
a.jp-pause:hover { background:transparent url("../img/player/buttons01.gif") -32px -32px no-repeat; }

/*a.jp-play img { left:0; top:0; }
a.jp-play:hover img { left:-32px; top:0; }
a.jp-pause img { left:0; top:-32px; }
a.jp-pause { display:none; }
a.jp-pause:hover img { left:-32px; top:-32px; }*/

div.jp-audio div.jp-type-playlist a.jp-stop {
	left:151px; /*48*/
	top:17px;
	width:20px;
	height:20px;
	z-index:1;
}

a.jp-stop {
	background: url("../img/player/buttons01.gif") 0 -64px no-repeat;
	width:20px;
	height:20px;
	z-index:1;
}
a.jp-stop:hover { background: url("../img/player/buttons01.gif") -20px -64px no-repeat; }


/*a.jp-stop img { left:0; top:-64px; }
a.jp-stop:hover img { left:-20px; top:-64px; }*/

/*
div.jp-audio div.jp-type-playlist a.jp-previous {
	left:20px;
	top:26px;
}
a.jp-previous {
	background: url("jplayer.blue.monday.jpg") 0 -112px no-repeat;
	width:28px;
	height:28px;
}
a.jp-previous:hover {
	background: url("jplayer.blue.monday.jpg") -29px -112px no-repeat;
}
div.jp-audio div.jp-type-playlist a.jp-next {
	left:88px;
	top:26px;
}
a.jp-next {
	background: url("jplayer.blue.monday.jpg") 0 -141px no-repeat;
	width:28px;
	height:28px;
}
a.jp-next:hover {
	background: url("jplayer.blue.monday.jpg") -29px -141px no-repeat;
}
*/

div.jp-progress {
	position:absolute; z-index:10;
	overflow:hidden;

	background:#000;
	border:1px solid #b0b0b0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
  /*behavior:url('css/ie-border-radius.htc');*/ /** für IE round corners --> doesn't work with fadeIn and hover fx **/

	margin:0; padding:0;
	left:51px; /*75*/
	top:21px;
	width:90px; /*190*/
	height:10px;
}
div.jp-seek-bar {
	position:absolute; left:0; top:0;
	width:0px;
	height:100%;
	background:#000; /* url("jplayer.blue.monday.jpg") 0 -202px repeat-x;*/
	cursor: pointer;
}
div.jp-play-bar {
	position:absolute; left:0; top:0;
	width:0px;
	height:100%;
	background:#b0b0b0; /* url("jplayer.blue.monday.jpg") 0 -218px repeat-x ;*/
}
/* The seeking class is added/removed inside jPlayer */
div.jp-seeking-bg {
	position:absolute; left:0; top:0;
	background-color:#f80; /* url("jplayer.pbar-ani.gif");*/
}

/*
a.jp-mute,
a.jp-unmute {
	width:18px;
	height:15px;
}
div.jp-audio div.jp-type-playlist a.jp-mute,
div.jp-audio div.jp-type-playlist a.jp-unmute {
	top:32px;
	left:296px;
}
a.jp-mute {
	background: url("jplayer.blue.monday.jpg") 0 -186px no-repeat;
}
a.jp-mute:hover {
	background: url("jplayer.blue.monday.jpg") -19px -170px no-repeat;
}
a.jp-unmute {
	background: url("jplayer.blue.monday.jpg") 0 -170px no-repeat;
	display: none;
}
a.jp-unmute:hover {
	background: url("jplayer.blue.monday.jpg") -19px -186px no-repeat;
}
div.jp-volume-bar {
	position:absolute;
	overflow:hidden;
	background: url("jplayer.blue.monday.jpg") 0 -250px repeat-x;
	width:46px;
	height:5px;
	cursor: pointer;
}
div.jp-audio div.jp-type-playlist div.jp-volume-bar {
	top:37px;
	left:324px;
}
div.jp-volume-bar-value {
	background: url("jplayer.blue.monday.jpg") 0 -256px repeat-x;
	width:0px;
	height:5px;
}
div.jp-current-time,
div.jp-duration {
	position: absolute;
	font-size:.64em;
	font-style:oblique;
}
div.jp-duration {
	text-align: right;
}
div.jp-audio div.jp-type-playlist div.jp-current-time,
div.jp-audio div.jp-type-playlist div.jp-duration {
	top:49px;
	left:164px;
	width:122px;
}
*/



div.jp-playlist {
	position:relative; z-index:0;
	margin:0;
	padding:55px 0 10px 0;
	/*left:0; top:50px;*/  /*bottom:27px;*/
	/*display:none;*/
	background:#333;
}
/*div.jp-interface:hover div.jp-playlist { display:block; }*/
div.jp-playlist ul {
	position:relative;

	list-style-type:none;
	margin:0; padding:0;
	/*font-size:.72em;*/

	/*position:absolute;
	left:0; top:0;*/  /*bottom:-3px;*/
	/*width:200px;
	background:url(../img/menu/mac-bg02.png) repeat;

	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;*/
}

div.jp-type-playlist div.jp-playlist li {
	position:relative;
	float:none;

	/*border-bottom:1px solid #eee;*/
}
/*div.jp-type-playlist div.jp-playlist li.jp-playlist-last {
	padding:5px 0 5px 21px;
	border-bottom:none;
}*/
div.jp-type-playlist div.jp-playlist li.jp-playlist-current {
	/*list-style-type:square;
	list-style-position:inside;*/
	/*padding-left:8px;*/
}
div.jp-type-playlist div.jp-playlist a {
	/*color: #666;*/
	text-decoration: none;
}
div.jp-type-playlist div.jp-playlist a:hover {
	color:#dca; /*#0d88c1;*/
}
div.jp-type-playlist div.jp-playlist a.jp-playlist-current {
	color:#dca; /*#0d88c1;*/
}
div.jp-type-playlist div.jp-playlist div.jp-free-media {
	display:inline;
	margin-left:20px;
}












/******** only for video ********/
div.jp-video-270p {
	width:480px;
}
div.jp-video-360p {
	width:640px;
}
div.jp-video div.jp-type-playlist div.jp-interface {
	height:60px;
}
div.jp-video a.jp-play,
div.jp-video a.jp-pause {
	top:15px;
}
div.jp-video-270p div.jp-type-playlist a.jp-play,
div.jp-video-270p div.jp-type-playlist a.jp-pause {
	left:220px;
}
div.jp-video-360p div.jp-type-playlist a.jp-play,
div.jp-video-360p div.jp-type-playlist a.jp-pause {
	left:300px;
}
div.jp-video a.jp-stop {
	top:21px;
}
div.jp-video-270p div.jp-type-playlist a.jp-stop {
	left:298px;
}
div.jp-video-360p div.jp-type-playlist a.jp-stop {
	left:378px;
}
div.jp-video div.jp-type-playlist a.jp-previous {
	top:21px;
}
div.jp-video-270p div.jp-type-playlist a.jp-previous {
	left:192px;
}
div.jp-video-360p div.jp-type-playlist a.jp-previous {
	left:272px;
}
div.jp-video div.jp-type-playlist a.jp-next {
	top:21px;
}
div.jp-video-270p div.jp-type-playlist a.jp-next {
	left:260px;
}
div.jp-video-360p div.jp-type-playlist a.jp-next {
	left:340px;
}
div.jp-video div.jp-progress {
	top:0px;
	left:0px;
	width:100%;
	height:10px;
}
div.jp-video a.jp-mute,
div.jp-video a.jp-unmute {
	top:27px;
}
div.jp-video-270p div.jp-type-playlist a.jp-unmute,
div.jp-video-270p div.jp-type-playlist a.jp-mute {
	left:363px;
}
div.jp-video-360p div.jp-type-playlist a.jp-mute,
div.jp-video-360p div.jp-type-playlist a.jp-unmute {
	left:443px;
}
div.jp-video div.jp-volume-bar {
	top:32px;
}
div.jp-video-270p div.jp-type-playlist div.jp-volume-bar {
	left:391px;
}
div.jp-video-360p div.jp-type-playlist div.jp-volume-bar {
	left:471px;
}
div.jp-video div.jp-current-time,
div.jp-video div.jp-duration {
	top:10px;
	left:0px;
	width:98%;
	padding:0 1%;
}
/*
div.jp-video div.jp-playlist li {
	padding:5px 0 5px 20px;
	font-weight:bold;
}
*/
div.jp-video div.jp-video-play {
	background: transparent url("jplayer.blue.monday.video.play.png") no-repeat center;
	/* position: relative; */
	position: absolute;
	cursor:pointer;
	z-index:2;
}
div.jp-video div.jp-video-play:hover {
	background: transparent url("jplayer.blue.monday.video.play.hover.png") no-repeat center;
}
div.jp-video-270p div.jp-video-play {
	top:-270px;
	width:480px;
	height:270px;
}
div.jp-video-360p div.jp-video-play {
	top:-360px;
	width:640px;
	height:360px;
}
div.jp-video div.jp-jplayer {
	border:1px solid #009be3;
	border-bottom:none;
	z-index:1;
}
div.jp-video-270p div.jp-jplayer {
	width:480px;
	height:270px;
}
div.jp-video-360p div.jp-jplayer {
	width:640px;
	height:360px;
}