* Date: 1st September 2011\r
*/\r
\r
+.jp-type-single {\r
+ padding: 5px 10px 0 10px;\r
+}\r
.jp-audio .title {\r
- font-size: 11px;\r
- position: relative;\r
- left: 10px;\r
- top: 5px;\r
- z-index: 100;\r
+ font-size: 11px;\r
+ z-index: 100;\r
}\r
.play-prev, .play-next {\r
- cursor: pointer;\r
+ cursor: pointer;\r
}\r
\r
div.jp-audio,\r
\r
div.jp-interface {\r
position: relative;\r
- background-color:#eee;\r
+ margin-top: -5px;\r
+ margin-left: -10px;\r
width:100%;\r
}\r
\r
div.jp-interface ul.jp-controls {\r
list-style-type:none;\r
margin:0;\r
- padding: 0;
- overflow:hidden;
-}
-
-div.jp-audio ul.jp-controls {
+ padding: 0;\r
+ overflow:hidden;\r
+}\r
+\r
+div.jp-audio ul.jp-controls {\r
width: 320px;\r
padding:20px 20px 0 20px;\r
-}
-
-div.jp-video div.jp-type-single ul.jp-controls {
+}\r
+\r
+div.jp-video div.jp-type-single ul.jp-controls {\r
width: 78px;\r
margin-left: 200px;\r
-}
-
-div.jp-video div.jp-type-playlist ul.jp-controls {
+}\r
+\r
+div.jp-video div.jp-type-playlist ul.jp-controls {\r
width: 134px;\r
margin-left: 172px;\r
-}
+}\r
div.jp-video ul.jp-controls,\r
div.jp-interface ul.jp-controls li {\r
- display:inline;
- float: left;
+ display:inline;\r
+ float: left;\r
}\r
\r
div.jp-interface ul.jp-controls a {\r
a.jp-pause:hover {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") -41px -42px no-repeat;\r
}\r
-
+\r
a.jp-stop, a.jp-previous, a.jp-next {\r
width:28px;\r
- height:28px;
+ height:28px;\r
margin-top:6px;\r
}\r
-
+\r
a.jp-stop {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -83px no-repeat;\r
- margin-left:10px;
-}
+ margin-left:10px;\r
+}\r
\r
a.jp-stop:hover {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") -29px -83px no-repeat;\r
-}
+}\r
\r
a.jp-previous {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -112px no-repeat;\r
}\r
a.jp-previous:hover {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") -29px -112px no-repeat;\r
-}
-
+}\r
+\r
a.jp-next {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -141px no-repeat;\r
}\r
a.jp-unmute,\r
a.jp-volume-max {\r
width:18px;\r
- height:15px;
- margin-top:12px;
-}
-
+ height:15px;\r
+ margin-top:12px;\r
+}\r
+\r
div.jp-audio div.jp-type-single a.jp-mute,\r
-div.jp-audio div.jp-type-single a.jp-unmute {
- margin-left: 180px;
-}
-
+div.jp-audio div.jp-type-single a.jp-unmute {\r
+ margin-left: 180px;\r
+}\r
+\r
div.jp-audio div.jp-type-playlist a.jp-mute,\r
-div.jp-audio div.jp-type-playlist a.jp-unmute {
+div.jp-audio div.jp-type-playlist a.jp-unmute {\r
margin-left: 154px;\r
-}
+}\r
\r
div.jp-audio a.jp-volume-max {\r
margin-left: 56px;\r
}\r
\r
div.jp-video a.jp-mute,\r
-div.jp-video a.jp-unmute {
+div.jp-video a.jp-unmute {\r
left: 50px;\r
-}
-\r\r
+}\r
+\r
+\r
div.jp-video a.jp-volume-max {\r
left: 134px;\r
}\r
}\r
a.jp-unmute:hover {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") -79px -170px no-repeat;\r
-}
-\ra.jp-volume-max {\r
+}\r
+\r
+a.jp-volume-max {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -186px no-repeat;\r
}\r
a.jp-volume-max:hover {\r
background: url("/static/jplayer/jplayer.blue.monday.jpg") -19px -186px no-repeat;\r
}\r
-
+\r
div.jp-volume-bar {\r
position: absolute;\r
overflow:hidden;\r
div.jp-duration {\r
width:60px;\r
font-size:.64em;\r
- font-style:oblique;
+ font-style:oblique;\r
}\r
div.jp-current-time {\r
float: left;\r
\r
div.jp-jplayer {\r
background-color: #000000;\r
-}
-
-
-
-
-
-/* @group TOGGLES */
+}\r
+\r
+\r
+\r
+\r
+\r
+/* @group TOGGLES */\r
\r
/* The audio toggles are nested inside jp-time-holder */\r
-
-ul.jp-toggles {
- list-style-type:none;
- padding:0;
+\r
+ul.jp-toggles {\r
+ list-style-type:none;\r
+ padding:0;\r
margin:0 auto;\r
- overflow:hidden;
-}
-
-div.jp-audio .jp-type-single ul.jp-toggles {
- width:25px;
-}
+ overflow:hidden;\r
+}\r
+\r
+div.jp-audio .jp-type-single ul.jp-toggles {\r
+ width:25px;\r
+}\r
div.jp-audio .jp-type-playlist ul.jp-toggles {\r
width:55px;\r
margin: 0;\r
left: 325px;\r
top: 50px;\r
}\r
-
-div.jp-video ul.jp-toggles {
+\r
+div.jp-video ul.jp-toggles {\r
margin-top:10px;\r
width:100px;\r
-}
-
-ul.jp-toggles li {
- display:block;
- float:right;
-}
-
-ul.jp-toggles li a {
- display:block;
- width:25px;
- height:18px;
+}\r
+\r
+ul.jp-toggles li {\r
+ display:block;\r
+ float:right;\r
+}\r
+\r
+ul.jp-toggles li a {\r
+ display:block;\r
+ width:25px;\r
+ height:18px;\r
text-indent:-9999px;\r
- line-height:100%; /* need this for IE6 */
-}
-
-a.jp-full-screen {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -310px no-repeat;
- margin-left: 20px;
-}
-
-a.jp-full-screen:hover {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -30px -310px no-repeat;
-}
-
-a.jp-restore-screen {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -60px -310px no-repeat;
+ line-height:100%; /* need this for IE6 */\r
+}\r
+\r
+a.jp-full-screen {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -310px no-repeat;\r
+ margin-left: 20px;\r
+}\r
+\r
+a.jp-full-screen:hover {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -30px -310px no-repeat;\r
+}\r
+\r
+a.jp-restore-screen {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -60px -310px no-repeat;\r
margin-left: 20px;\r
-}
-
-a.jp-restore-screen:hover {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -90px -310px no-repeat;
-}
-
-a.jp-repeat {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -290px no-repeat;
-}
-
-a.jp-repeat:hover {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -30px -290px no-repeat;
-}
-
-a.jp-repeat-off {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -60px -290px no-repeat;
-}
-
-a.jp-repeat-off:hover {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -90px -290px no-repeat;
-}
-
-a.jp-shuffle {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -270px no-repeat;
- margin-left: 5px;
-}
-
-a.jp-shuffle:hover {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -30px -270px no-repeat;
-}
-
-a.jp-shuffle-off {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -60px -270px no-repeat;
+}\r
+\r
+a.jp-restore-screen:hover {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -90px -310px no-repeat;\r
+}\r
+\r
+a.jp-repeat {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -290px no-repeat;\r
+}\r
+\r
+a.jp-repeat:hover {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -30px -290px no-repeat;\r
+}\r
+\r
+a.jp-repeat-off {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -60px -290px no-repeat;\r
+}\r
+\r
+a.jp-repeat-off:hover {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -90px -290px no-repeat;\r
+}\r
+\r
+a.jp-shuffle {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") 0 -270px no-repeat;\r
margin-left: 5px;\r
-}
-
-a.jp-shuffle-off:hover {
- background: url("/static/jplayer/jplayer.blue.monday.jpg") -90px -270px no-repeat;
-}
-
-
+}\r
+\r
+a.jp-shuffle:hover {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -30px -270px no-repeat;\r
+}\r
+\r
+a.jp-shuffle-off {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -60px -270px no-repeat;\r
+ margin-left: 5px;\r
+}\r
+\r
+a.jp-shuffle-off:hover {\r
+ background: url("/static/jplayer/jplayer.blue.monday.jpg") -90px -270px no-repeat;\r
+}\r
+\r
+\r
/* @end */\r
\r
/* @group NO SOLUTION error feedback */\r