@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;
}