/*
 * http://www.jplayer.org 
 * Skin Name: FT-Skin
    * nur Audioplayer mit Playlist, voll skalierbar, kein Video Skin 
    * angepasste CSS Datei vom "Pink Flag" Theme (Author: Silvia Benvenuti) 
 * Author: Jan Heinicke (jan.ftide@gmail.com / www.fractatulum.net) 
 * Datum: 4. April 2012 
*/
div.jp-audio { font-size:1em; font-family:Verdana, Arial, sans-serif; line-height:1.6; color: #fff; background:#eee url("player-bg.png") no-repeat top left; background-size: 25% auto; position:relative; border:10px solid #fff; border-radius: 15px; box-shadow: 0 8px 12px -6px #222; width:85%; max-width:600px; padding:20px; margin:auto; text-shadow: 0px 0px 5px #ccc; }
div.jp-interface { position: relative; width:76%; margin:auto; padding:2%; background-color:transparent; }
div.jp-audio .jp-interface { height: 80px; padding-top:30px; }
/* @group CONTROLS */
div.jp-controls-holder { clear: both; width:440px; margin:0 auto 10px auto; position: relative; overflow:hidden; }
div.jp-interface ul.jp-controls { background: url("ft-player-skin.png") 0 0 no-repeat; list-style-type:none; padding: 1px 0 2px 1px; overflow:hidden; width: 201px; height: 34px; }
div.jp-audio ul.jp-controls { margin:0 auto; }
div.jp-interface ul.jp-controls li { display:inline; float: left; }
div.jp-interface ul.jp-controls a { display:block; overflow:hidden; text-indent:-9999px; height: 34px; margin: 0 1px 2px 0; padding: 0; }
/* @group playlist player controls */
div.jp-type-playlist .jp-controls li a { width: 49px; }
div.jp-type-playlist .jp-play { background: url("ft-player-skin.png") -24px -40px no-repeat; }
div.jp-type-playlist .jp-play:hover { background: url("ft-player-skin.png") -124px -40px no-repeat; }
div.jp-type-playlist .jp-pause { background: url("ft-player-skin.png") -24px -120px no-repeat; }
div.jp-type-playlist .jp-pause:hover { background: url("ft-player-skin.png") -124px -120px no-repeat; }
div.jp-type-playlist .jp-stop { background: url("ft-player-skin.png") -24px -80px no-repeat; }
div.jp-type-playlist .jp-stop:hover { background: url("ft-player-skin.png") -124px -80px no-repeat; }
div.jp-type-playlist .jp-previous { background: url("ft-player-skin.png") -24px -200px no-repeat; }
div.jp-type-playlist .jp-previous:hover { background: url("ft-player-skin.png") -124px -200px no-repeat; }
div.jp-type-playlist .jp-next { background: url("ft-player-skin.png") -24px -160px no-repeat; }
div.jp-type-playlist .jp-next:hover { background: url("ft-player-skin.png") -124px -160px no-repeat; }
/* @end */

/* @group TOGGLES */
ul.jp-toggles { display:none; /*   Ausgeblendet, brauch ich nicht */ }
/* @end */

/* @group progress bar */
/* The seeking class is added/removed inside jPlayer */
.jp-progress { background: none; width: 100%; height: 13px; padding: 0 2px 2px 2px; margin: 12px 0 4px 0; overflow:hidden; }
.jp-seek-bar { border-radius:4px; background: url("ft-player-skin.png") 0px -260px repeat-x; width:0px; height: 100%; overflow:hidden; cursor:pointer; }
.jp-play-bar { border-radius:4px; background: url("seekbar.gif") repeat-x; width:0px; height: 100%; overflow:hidden; }
/* @end */

/* @group volume controls */
div.jp-interface ul.jp-controls a.jp-mute, div.jp-interface ul.jp-controls a.jp-unmute, div.jp-interface ul.jp-controls a.jp-volume-max { background: url("ft-player-skin.png") 0px -330px no-repeat; position: absolute; width: 16px; height: 11px; }
div.jp-audio ul.jp-controls a.jp-mute, div.jp-audio ul.jp-controls a.jp-unmute { top:8px; left: 25%; }
div.jp-audio ul.jp-controls a.jp-volume-max { top:8px; left: 75%; }
div.jp-interface ul.jp-controls a.jp-mute:hover { background: url("ft-player-skin.png") -25px -330px no-repeat; }
div.jp-interface ul.jp-controls a.jp-unmute { background: url("ft-player-skin.png") -60px -330px no-repeat; }
div.jp-interface ul.jp-controls a.jp-unmute:hover { background: url("ft-player-skin.png") -85px -330px no-repeat; }
div.jp-interface ul.jp-controls a.jp-volume-max { background: url("ft-player-skin.png") 0px -350px no-repeat; }
div.jp-interface ul.jp-controls a.jp-volume-max:hover { background: url("ft-player-skin.png") -25px -350px no-repeat; }
.jp-volume-bar { background: url("ft-player-skin.png") 0px -300px repeat-x; position: absolute; width: 40%; margin-left: 30%; height: 4px; padding: 2px 2px 1px 2px; overflow: hidden; }
.jp-volume-bar:hover { cursor:  pointer; }
div.jp-audio .jp-interface .jp-volume-bar { border-radius:6px;top:10px; left: 0; }
.jp-volume-bar-value { background: url("ft-player-skin.png") 0px -320px repeat-x; height: 4px; }
/* @end */

/* @group current time and duration */
.jp-current-time, .jp-duration { width:70px; font-size:.6em; color: #666; }
.jp-current-time { float: left; }
.jp-duration { float: right; text-align:right; }
/* @end */

/* @group playlist */
.jp-title ul, .jp-playlist ul { list-style-type:none; font-size:.8em; margin: 5px 0 0 0; padding: 0; }
.jp-title li, .jp-playlist li { position: relative; padding: 2px 2px 2px 10px; margin:0 0 -1px 0; border-top:1px dotted #666; border-bottom:none; overflow: hidden; }
.jp-title li { border-bottom:none; border-top:none; padding:2px; text-align:center; }
/* Note that the first-child (IE6) and last-child (IE6/7/8) selectors do not work on IE */
div.jp-type-playlist div.jp-playlist li:first-child { border-top:none; padding-top:3px; }
div.jp-type-playlist div.jp-playlist li:last-child { border-bottom:none; padding-bottom:3px; }
div.jp-type-playlist div.jp-playlist a { color: #666; text-decoration:none; display:block; padding:0.5em; line-height:1.2em; -moz-transition: font-size 0.3s ease-in; -webkit-transition: font-size 0.3s ease-in; -o-transition: font-size 0.3s ease-in; transition: font-size 0.3s ease-in; }
div.jp-type-playlist div.jp-playlist a:hover { color: #000; }
div.jp-type-playlist div.jp-playlist li.jp-playlist-current { /*background: #6C0000 url("current-bg.png");*/
margin-bottom:-1px; }
div.jp-type-playlist div.jp-playlist li.jp-playlist-current a { color: #000; font-size:1.3em; }
/* @end */

/* @group NO SOLUTION error feedback */
.jp-no-solution { position:absolute; width:390px; margin-left:-202px; left:50%; top: 10px; padding:5px; font-size:.8em; background-color:#fff; border-top:2px solid #554461; border-left:2px solid #554461; border-right:2px solid #180a1f; border-bottom:2px solid #180a1f; color:#000; display:none; }
.jp-no-solution a { color:#000; }
.jp-no-solution span { font-size:1em; display:block; text-align:center; font-weight:bold; }
.jp-audio .jp-no-solution { width:190px; margin-left:-102px; }
/* @end */
