Your IP : 216.73.216.20
html {
}
body {
font:normal 75% verdana,tahoma,arial,"sans serif";
background:#000;
color:#fff;
}
/*
GENERAL RANT AWARENESS NOTICE
-----------------------------
You may see some complaining about Internet Explorer, PNG and opacity-related hacks.
Even the new (at time of writing, 12/2006) IE 7 has issues and other quirks. Too bad.
*/
.sm2player {
position:absolute;
left:1.75em;
top:5.5em;
z-index:3;
padding:1px;
height:20px;
font:normal xx-small/19px verdana,tahoma,arial;
*line-height:19px;
letter-spacing:-1px;
color:#4f4f4f;
zoom:1;
}
.sm2player.altFont {
/* font tweaks for mac which has tighter spacing */
letter-spacing:0px;
}
.sm2player,
.sm2player .sm2playlist-box {
/*width:284px;*/
}
/*.sm2player .ui,*/
.sm2player .sm2playlist {
xfilter:alpha(opacity=90); /* Even IE 7 (still) sucks! */
opacity:0.9;
}
.sm2player .ui {
_filter:none; /* IE <7 sucks */
}
.sm2player.noOpacity .ui {
/* Safari (1.3.2 at least?) has render bugs with UI display + animated PNG progress bar when applying opacity */
opacity:1;
}
.sm2player .ui:hover {
opacity:1;
filter:none;
}
.sm2player a:focus {
outline:none;
}
.sm2player .left,
.sm2player .mid,
.sm2player .right {
position:relative;
float:left;
display:inline;
height:20px;
color:#4f4f4f;
}
.sm2player .left {
width:15px;
background:transparent url(../image/skin-3-ui.png) 0px 0px no-repeat;
_background-image:url(../image/skin-3-ui.gif); /* IE <7 */
}
.sm2player .left .trigger,
.sm2player .left .trigger span {
display:block;
width:15px;
height:20px;
}
.sm2player .left .trigger.pauseplay span {
background:transparent url(../image/sec-left-arr1.png) 5px 6px no-repeat;
_background-image:url(../image/sec-left-arr1.gif);
}
.sm2player .left .trigger.pauseplay span.playing {
/* class applied while playing */
background-image:url(../image/sec-left-pause-1.gif);
background-position:6px 7px;
}
.sm2player .left .trigger:hover {
background:transparent url(../image/ui-highlight-1.png) 2px 0px no-repeat;
_background-image:url(../image/ui-highlight-1.gif);
_background-position:2px 0px;
}
.sm2player .left .trigger.pauseplay:hover span {
background:transparent url(../image/sec-left-arr0.png) 5px 6px no-repeat;
_background-image:url(../image/sec-left-arr2.gif);
}
.sm2player .left .trigger.pauseplay:hover span.playing {
background-image:url(../image/sec-left-pause.gif);
background-position:6px 7px;
}
.sm2player .mid {
position:relative;
width:223px;
_width:224px;
background:transparent url(../image/skin-3-ui.png) -14px 0px no-repeat;
_background-image:url(../image/skin-3-ui.gif);
}
.sm2player .mid .info {
position:absolute;
left:0px;
top:0px;
width:100%;
height:20px;
overflow:hidden;
text-indent:2px;
z-index:2;
cursor:default;
}
.sm2player .mid .progress {
position:relative;
display:block;
width:1px;
height:12px;
margin:4px 0px 0px 0px;
background:transparent url(../image/sec-mid-loaded-light.png) 0px 0px repeat-x;
_background-image:url(../image/sec-mid-loaded-light.gif);
background-color:#eee;
}
.sm2player .mid .progress.loading {
position:relative;
display:block;
width:1px;
border-right:1px solid #eee;
}
.sm2player .mid .slider {
position:absolute;
display:block;
width:12px;
height:12px;
left:0px;
top:0px;
margin-top:4px;
background:transparent url(../image/slider-light.png) 0px 0px no-repeat;
_background-image:url(../image/slider-light.gif);
z-index:1; /* swap between 1 and 2 to position on top */
z-index:2;
opacity:0.95;
/* filter:alpha(opacity=95); IE7 still messes up alpha transparency with PNGs when applying filters. Boo urns. */
}
.sm2player .mid.hover .slider,
.sm2player .mid:hover .slider {
/*
z-index:2;
opacity:0.95;
filter:filter:alpha(opacity=95);
*/
}
.sm2player .mid .slider.active {
/*
-moz-opacity:0.85;
filter:alpha(opacity=85);
*/
}
.sm2player .mid .text,
.sm2player .mid .default,
.sm2player .mid .seek,
.sm2player .mid .divider {
display:none;
}
.sm2player .mid .caption {
*position:absolute; /* required for scroll positioning to work under IE */
display:inline;
white-space:nowrap;
visibility:hidden; /* hidden by default */
}
.sm2player .mid .seek {
position:absolute;
left:0px;
top:0px;
text-indent:2px;
}
.sm2player .right {
/*
width:18px;
width:45px;
*/
background:transparent url(../image/skin-3-ui.png) 100% 0px no-repeat;
_background-image:url(../image/skin-3-ui.gif);
margin-left:1px;
_margin-left:0px; /* IE <7 sucks. */
}
.sm2player .right .divider {
/* one-pixel visual divider between bar / cap (yep, this is a UI nit-pick.) */
float:left;
display:inline;
width:1px;
height:20px;
overflow:hidden;
background:transparent url(../image/skin-3-ui.png) -1006px 0px no-repeat;
_background-image:url(../image/skin-3-ui.gif);
margin-left:-1px;
_display:none; /* IE <7 sucks. */
}
.sm2player .right .time {
float:left;
display:inline;
width:3em;
text-align:center;
line-height:19px;
margin:0px 1px 0px 3px;
}
.sm2player .right .trigger {
float:left;
display:inline;
width:14px;
height:20px;
}
.sm2player .right .trigger span {
display:block;
height:20px;
}
.sm2player .right .trigger.prev {
margin-left:1px;
}
.sm2player .right .trigger.s0 {
width:16px;
}
.sm2player .right .trigger.s1 {
width:18px;
}
.sm2player .right .trigger.s2 {
width:20px;
}
.sm2player .right .trigger.s3 {
width:12px;
}
.sm2player .right .trigger.s4 {
width:13px;
}
.sm2player .right .trigger {
background:transparent;
}
.sm2player .right .trigger.prev {
}
.sm2player .right .trigger.dropdown {
width:14px;
margin-right:2px;
}
.sm2player .right .trigger span {
background:transparent url(../image/sec-right-arr1.png) 3px 7px no-repeat;
/*
_background-image:url(../image/sec-right-arr1.gif);
_background-position:0px 0px;
*/
}
.sm2player .right .trigger.prev span {
background:transparent url(../image/btn-prev-1.png) 4px 6px no-repeat;
/* _background-image:url(../image/btn-prev-1.gif); */
}
.sm2player .right .trigger.next span {
background:transparent url(../image/btn-next-1.png) 3px 6px no-repeat;
/* _background-image:url(../image/btn-next-1.gif); */
}
.sm2player .right .trigger.loop span {
background:transparent url(../image/loop-light.png) 3px 5px no-repeat;
opacity:0.5;
filter:alpha(opacity=50);
}
.sm2player .right .trigger.loop.active span {
opacity:1;
filter:none;
}
.sm2player .right .trigger.shuffle span {
background:transparent url(../image/shuffle-1-light.png) 2px 5px no-repeat;
opacity:0.5;
filter:alpha(opacity=50);
_background-image:none;
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop src='image/shuffle-1-light.png');
_margin:5px 0px 0px 2px;
}
.sm2player .right .trigger.shuffle:hover span {
background-image:url(../image/shuffle.png);
}
.sm2player .right .trigger.shuffle.active span {
opacity:1;
filter:none;
}
.sm2player .right .trigger.mute span {
background:transparent url(../image/speaker-light.png) 3px 5px no-repeat;
}
.sm2player .right .trigger.mute:hover span {
background-image:url(../image/speaker.png);
opacity:0.75;
}
.sm2player .right .trigger.mute.active span {
opacity:0.5;
}
.sm2player .right .trigger.volume span {
background:transparent url(../image/volume-light.png) 0px 4px no-repeat;
}
.sm2player .right .trigger:hover {
background:transparent url(../image/ui-highlight-1.png) -2px 0px no-repeat;
_background-image:url(../image/ui-highlight-1.gif);
/*_background-position:2px 2px;*/
}
.sm2player .right .trigger.dropdown:hover>span {
background-image:url(../image/sec-right-arr0.png);
}
.sm2player .right .trigger.prev:hover>span {
background-image:url(../image/btn-prev.png);
}
.sm2player .right .trigger.next:hover>span {
background-image:url(../image/btn-next.png);
}
.sm2player .right .trigger.loop:hover>span {
background-image:url(../image/loop.png);
}
.sm2player .right .trigger.shuffle:hover>span {
background-image:url(../image/shuffle-1.png);
}
.sm2player .right .trigger.mute:hover>span {
background-image:url(../image/speaker.png);
}
.sm2player .right .trigger.volume:hover>span {
background-image:url(../image/volume.png);
}
.sm2player .right .dropdown:hover {
background-position:right 0px;
}
.sm2playlist-box {
position:absolute;
/*width:256px;*/
/*overflow:hidden;*/
/*max-height:33.1em;*/
left:1px;
top:26px;
overflow:auto;
margin-top:-4px;
}
.sm2playlist {
position:relative;
/* zoom:1; stupid IE. */
margin-top:-999em; /* hidden by default */
}
.sm2playlist .hd,
.sm2playlist .c {
position:relative;
height:3px;
}
.sm2playlist .hd {
background:transparent url(../image/skin-3-ui.png) no-repeat 0px 0px;
_background-image:url(../image/skin-3.ui.gif);
margin-right:3px;
}
.sm2playlist .hd .c {
position:absolute;
right:0px;
top:0px;
background:transparent url(../image/skin-3-ui.png) no-repeat 100% 0px;
_background-image:url(../image/skin-3-ui.gif);
margin-right:-3px;
width:3px;
}
.sm2playlist .bd {
background:transparent url(../image/shade-left.png) repeat-y 0px 0px;
_background-image:none;
margin-right:2px;
}
.sm2playlist ul {
list-style-type:none;
margin:0px;
padding:0px;
padding-right:4px; /* space for background */
margin-right:-2px;
background:transparent url(../image/shade-right.png) repeat-y 100% 0px;
_background-image:none;
zoom:1; /* Even IE 7 needs this (!?) */
}
.sm2playlist ul li {
line-height:1.5em;
}
.sm2playlist ul li a {
display:block;
background:transparent;
margin-left:2px;
margin-right:-2px;
color:#666;
text-indent:0.25em;
text-decoration:none;
width:100%; /* stupid IE 7. */
}
.sm2playlist ul li a span {
display:block;
background:#eee;
padding:0.1em 0.5em;
border-top:1px solid #fff;
border-bottom:1px solid #ccc;
}
.sm2playlist ul li:first-child a span {
border-top:none;
}
.sm2playlist ul li:last-child a span {
border-bottom:none;
}
.sm2playlist ul li a:hover span {
background-color:#ddd;
color:#333;
}
.sm2playlist ul li a:hover span {
border-color:transparent;
_border-color:#ccc;
}
.sm2playlist ul li.highlight a {
color:#222;
}
.sm2playlist ul li.highlight a span {
background-color:#ddd;
}
.sm2playlist ul li.highlight a:hover {
background-color:#ffeedd;
color:#9999ff;
}
.sm2playlist ul li a:focus {
outline:none;
}
.sm2playlist .ft {
background:transparent url(../image/skin-3-ui.png) no-repeat 0px 100%;
_background-image:url(../image/skin-3-ui.gif);
margin-right:3px;
height:2px;
}
.sm2playlist .ft .c {
position:absolute;
right:0px;
bottom:0px;
background:transparent url(../image/skin-3-ui.png) no-repeat 100% 100%;
_background-image:url(../image/skin-3-ui.gif);
xmargin-left:3px; /* leave room for left cap */
xmargin-right:-3px;
width:3px;
height:2px;
/* not needed */
xdisplay:none;
}
#soundmanager-debug {
position:absolute;
right:1.5em;
bottom:1.5em;
display:none;
font-size:xx-small;
height:20em;
overflow:auto;
background:transparent url(../image/whiteout.png);
padding:1em;
color:#000;
}