1 /**

     2  * Based upon the AmaroK WebControl interface by:

     3  *    Jonas Christian Drewsen ( kde at xspect dot dk )

     4  *    André Kelpe ( fs111 at web dot de )

     5  *    Peter C. Ndikuwera ( pndiku at gmail dot com )

     6  */

     7 

     8 body {

     9   font-family: sans-serif;

    10   background-color: #262626;

    11   color: #ffffff;

    12   padding: 0 8px;

    13   background-image: url(images/playbar-shadow.gif);

    14   background-repeat: repeat-x;

    15 }

    16 

    17 div.tblholder {

    18   padding: 1px;

    19   background-color: #b0b0b0;

    20   border: 1px solid #000000;

    21 }

    22 

    23 div.tblholder table {

    24   background-color: #606060;

    25 }

    26 

    27 tr th {

    28   background-color: #505050;

    29 }

    30 

    31 tr.row1 td {

    32   background-color: #383838;

    33 }

    34 

    35 tr.row2 td {

    36   background-color: #424242;

    37 }

    38 

    39 tr.current td {

    40   background-color: #303030;

    41   color: #ffff00;

    42 }

    43 

    44 div#playbar {

    45   position: fixed;

    46   top: 0;

    47   left: 0; 

    48   width: 100%;

    49   height: 32px;

    50   padding: 0;

    51   margin: 0;

    52   background-image: url(images/playbar.gif);

    53   background-repeat: repeat-x;

    54   background-color: #383f61;

    55   border-bottom: 1px solid #000000;

    56 }

    57 

    58 div.playbar-inner {

    59   padding: 5px;

    60   line-height: 22px;

    61 }

    62 

    63 a img {

    64   border-width: 0;

    65 }

    66 

    67 div#playlist {

    68   margin-top: 48px;

    69 }

    70 

    71 a.tracklink {

    72   text-decoration: none;

    73   color: white;

    74 }

    75 

    76 div#playlist tr.current a.tracklink {

    77   color: #ffff00;

    78 }

    79 

    80 span#playmeter, span#volume_wrap {

    81   position: relative;

    82   top: -7px;

    83 }

    84 

    85 a.volume_button {

    86   padding-right: 10px;

    87   margin-right: 1px;

    88   background-color: #262626;

    89   border: 1px solid #909090;

    90   text-decoration: none;

    91 }

    92 

    93 a.volume_button_active {

    94   background-color: #404040;

    95   border-color: #d0d0d0;

    96 }

    97 

    98 /* Position slider (playhead) */

    99 

   100 div#playhead {

   101   background-image: url(images/position-empty.png);

   102   width: 250px;

   103   background-repeat: no-repeat;

   104   background-position: center center;

   105   float: right;

   106   margin-left: 10px;

   107 }

   108 

   109 div#playhead-filler {

   110   background-image: url(images/position-full.png);

   111   width: 150px;

   112   background-repeat: no-repeat;

   113   background-position: left center;

   114 }

   115 

   116 div#playhead-button {

   117   background-image: url(images/playhead.png);

   118   width: 16px;

   119   height: 16px;

   120   font-size: 1px;

   121   position: absolute;

   122   background-repeat: no-repeat;

   123   background-position: center center;

   124 }

   125 

   126 /* The list of colors that will be cycled through as playback takes place */

   127 tr.pulsar0 td { background-color: #303030; }

   128 tr.pulsar1 td { background-color: #333333; }

   129 tr.pulsar2 td { background-color: #363636; }

   130 tr.pulsar3 td { background-color: #393939; }

   131 tr.pulsar4 td { background-color: #3c3c3c; }

   132 tr.pulsar5 td { background-color: #3f3f3f; }

   133 tr.pulsar6 td { background-color: #424242; }

   134 tr.pulsar7 td { background-color: #454545; }

   135 tr.pulsar8 td { background-color: #484848; }

   136 tr.pulsar9 td { background-color: #4b4b4b; }

   137 

   138 div.poweredby {

   139   font-size: smaller;

   140   text-align: center;

   141   margin: 10px 0;

   142 }

   143 

   144 div.poweredby a {

   145   color: #57608a;

   146 }