@charset "UTF-8";
/* CSS Document */

#popup
{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #8f8b9c;
}



/* class used for rollover */
#tracklisting
{
  padding: 3px;
}
#tracklisting div
{
  padding: 3px;
}

.track
{
  margin: 0;
  padding: 0;
}
.track div
{
  margin: 0;
  padding: 0;
}
.track span
{
  color: #8f8b9c;
  text-decoration: none;
  margin: 0 5px;
}

.track a:link, .track a:visited, .track a:active
{
  color: #8f8b9c;
  text-decoration: none;
  padding-left: 20px;
  background-image: url(img/preview_off.gif);
  background-repeat: no-repeat;
  background-position: left;
}
.track a:hover
{
  background-image: url(img/preview_on.gif);
  color: #034275;
  text-decoration: underline;
  background-repeat: no-repeat;
  background-position: left;
}

/* class for lyric hover */
.lyric
{
  margin: 0;
  padding: 0;
}
.lyric div
{
  margin: 0;
  padding: 0;
}
.lyric span
{
  color: #8f8b9c;
  text-decoration: none;
  margin: 0 5px;
}

.lyric a:link, .lyric a:visited, .lyric a:active
{
  color: #8f8b9c;
  text-decoration: none;
  padding-left: 20px;
  background-image: url(img/lyric_off.gif);
  background-repeat: no-repeat;
  background-position: left;
}
.lyric a:hover
{
  background-image: url(img/lyric_on.gif);
  color: #034275;
  text-decoration: underline;
  background-repeat: no-repeat;
  background-position: left;
}

/* class for video hover */
.video
{
  margin: 0;
  padding: 0;
}
.video div
{
  margin: 0;
  padding: 0;
}
.video span
{
  color: #8f8b9c;
  text-decoration: none;
  margin: 0 5px;
}

.video a:link, .video a:visited, .video a:active
{
  color: #8f8b9c;
  text-decoration: none;
  padding-left: 20px;
  background-image: url(img/video_off.gif);
  background-repeat: no-repeat;
  background-position: left;
}
.video a:hover
{
  background-image: url(img/video_on.gif);
  color: #034275;
  text-decoration: underline;
  background-repeat: no-repeat;
  background-position: left;
}

/* class used for currently playing */
.playing div
{
  padding: 10px 0 0 0;
  border: 1px solid red;
}
.playing span
{
  color: #8f8b9c;
  text-decoration: none;
  margin: 0 5px;
}

.playing a:link, .playing a:visited, .playing a:active, .playing a:hover
{
  text-decoration: none;
  padding-left: 20px;
  background-repeat: no-repeat;
  background-position: left;
  background-image: url(img/preview_on.gif);
  color: #034275;
  text-decoration: underline;
}

.pu-header
{
  background-image: url(img/popup_top.png);
  background-position: top left;
  width: 383px;
  height: 56px;
  color: #fff;
}

.headerdiv
{
  margin: 25px 0 0 20px;
  font-size: 14px;
}

.pu-content
{
  background-image: url(img/popup_mid.png);
  width: 383px;
}
.pu-footer
{
  background-image: url(img/popup_bot.png);
  width: 383px;
  height: 13px;
}