/*

 SoundManager 2: "page as sm2playlist" example
 ------------------------------------------
 http://schillmania.com/projects/soundmanager2/

*/
.spectrum-container {
	display: none;
}

ul.use-spectrum li.sm2_playing .spectrum-container {
	position: absolute;
	left: 0px;
	top: 0px;
	margin-left: -266px;
	margin-top: -1px;
	display: block;
	background-color: #ababab;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 4px;
}

ul.use-spectrum .spectrum-box {
	position: relative;
	width: 255px;
	font-size: 1em;
	padding: 2px 0px;
	height: 1.2em;
	overflow: hidden;
}

ul.use-spectrum .spectrum-box .spectrum {
	position: absolute;
	left: 0px;
	top: -2px;
	margin-top: 20px;
	display: block;
	font-size: 1px;
	width: 1px;
	height: 1px;
	/* set to 50px for a thick line, 1px for a thin line, etc. */
	overflow: hidden;
	background-color: #fff;
}




/*
	POPUP OVERRIDES
*/
body.popup div#sm2_holder {
	height: 210px;
	width: 602px;
	overflow: auto;
	}

body.popup div#sm2_holder a.sm2_link, body.popup div#sm2_holder .sm2_inline_title {
	height: 150px;
	width: 200px;
	overflow: hidden;
	display: compact !important;
	height: 18px;
	}
body.popup ul.sm2playlist li {
	padding: 1px;
	margin-bottom: 4px;
}

div#sm2_info {
	border-top: 1px solid #999999;
	}






ul.sm2playlist {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

ul.sm2playlist li {
	position: relative;
	display: block;
	width: auto;
	font-size: 12px;
	text-transform: uppercase;
	color: #999999;
	border: none;
	margin-bottom: 10px;
	letter-spacing: -1px; /* ZOMG WEB X.0. ;) */
	background-color: #ededed;
	overflow: hidden;

}

ul.sm2playlist li a, ul.sm2playlist li a:active {
	/*display: block;*/
	text-decoration: none;
	font-weight: normal;
	/*color: #000;*/
	outline: none;
	position: relative;
	z-index: 2;
	
}

ul.sm2playlist li a:hover {
	background-color: #ffffff;
	color: #ff00ff;
}

ul.sm2playlist li.sm2_playing,ul.sm2playlist li.sm2_paused,ul.sm2playlist li.sm2_playing a
	{
	color: #fff;
}

ul.sm2playlist li:hover {
	background-color: #e5e5e5;
}

/*
ul.sm2playlist li:hover a {
	color: #ffffff !important;
	background-color: #ff00ff;
}
*/

ul.sm2playlist li.sm2_playing,ul.sm2playlist li.sm2_playing:hover {
	background-color: #ff00ff;
}

ul.sm2playlist li.sm2_paused {
	background-color: #999;
}

ul.sm2playlist li.sm2_playing:hover a,ul.sm2playlist li.sm2_paused a {
	color: #fff;
}

ul.sm2playlist li .controls {
	display: none;
}

ul.sm2playlist li .peak,ul.sm2playlist.use-peak li .peak {
	display: none;
	position: absolute;
	top: 0.55em;
	right: 0.5em;
}

ul.sm2playlist li.sm2_playing .controls,ul.sm2playlist li.sm2_paused .controls
	{
	position: relative;
	display: block;
}

ul.sm2playlist.use-peak li.sm2_playing .peak,ul.sm2playlist.use-peak li.sm2_paused .peak
	{
	display: inline;
	display: inline-block;
}

ul.sm2playlist.use-peak li .peak {
	display: none; /* IE 7 */
}

ul.sm2playlist li.sm2_paused .controls {
	background-color: #666;
}

ul.sm2playlist li:hover .controls .statusbar {
	position: relative;
	cursor: ew-resize;
	cursor: -moz-grab;
	cursor: grab;
}

ul.sm2playlist li.sm2_paused .controls .statusbar {
	background-color: #ccc;
}

ul.sm2playlist li .controls {
	position: relative;
	margin-top: 6px;
	margin-bottom: 4px;
	background-color: #99ccff;
}

ul.sm2playlist li .controls .statusbar {
	position: relative;
	height: 8px;
	background-color: #ff66ff;
	/*border: 2px solid #fff;*/
	overflow: hidden;
	cursor: -moz-grab;
	cursor: grab;
}

ul.sm2playlist li .controls.dragging .statusbar {
	cursor: -moz-grabbing;
	cursor: grabbing;
}

ul.sm2playlist li .controls .statusbar .position,ul.sm2playlist li .controls .statusbar .loading,ul.sm2playlist li .controls .statusbar .annotation
	{
	position: absolute;
	left: 0px;
	top: 0px;
	height: 8px;
}

ul.sm2playlist li .controls .statusbar .position {
	background-color: #ffffff;
	border-right: 3px solid #ff00ff;

}

ul.sm2playlist li.sm2_paused .controls .statusbar .position {
	background-color: #666;
	border-color: #666;
}

ul.sm2playlist li .controls .statusbar .loading {
	background-color: #ff99ff;
}

ul.sm2playlist li .controls .statusbar .position,ul.sm2playlist li .controls .statusbar .loading
	{
	width: 0px;
}

ul.sm2playlist li.sm2_playing a.sm2_link,ul.sm2playlist li.sm2_paused a.sm2_link
	{
	/*margin-right: 4.5em;  room for timing stuff */
}

ul.sm2playlist li .timing {
	position: absolute;
	display: none;
	text-align: right;
	right: 1em;
	top: 0px;
	width: auto;
	height: 1em;
	padding: 0px;
	padding-top: 4px;
	margin-right: 110px;
	/*background-color: #5588bb;*/
	letter-spacing: 0px;
	line-height: 1em;
	vertical-align: middle;
	margin-top: 3px;
}

ul.sm2playlist.use-peak li .timing {
	right: 4.25em;
}

ul.sm2playlist li:hover .timing {
	z-index: 2;
}

ul.sm2playlist li .timing div.sm2_timing {
	margin: 0px;
	padding: 0px;
	margin-top: -1em;
}

ul.sm2playlist li.sm2_playing .timing,ul.sm2playlist li.sm2_paused .timing {
	display: block;
}

ul.sm2playlist li.sm2_paused .timing .sm2_position {
	text-decoration: blink; /* hee hee. first actual appropriate use? :D */
}

ul.sm2playlist li.sm2_paused .timing,ul.sm2playlist.use-peak li.sm2_paused .peak
	{
	background-color: transparent;
}

/* peak data */ /* ul.sm2playlist ... */
ul.sm2playlist.use-peak li .peak {
	display: none;
	zoom: 1;
	border: 1px solid #99ccff;
	padding: 2px;
	height: 0.55em;
	background-color: #5588bb;
	width: 0.8em;
	height: 0.55em;
	margin-top: -3px;
}

ul.sm2playlist.use-peak li .peak-box {
	position: relative;
	width: 100%;
	height: 0.55em;
	overflow: hidden;
}

ul.sm2playlist li .peak .l,ul.sm2playlist li .peak .r {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 7px;
	height: 50px;
	background: #fff;
	border: 1px solid #fff;
	margin-top: 1em;
}

ul.sm2playlist li .peak .l {
	margin-right: 1px;
}

ul.sm2playlist li .peak .r {
	left: 10px;
}

#control-template {
	display: none;
}

/* variation
.sm2_inline_title {
	margin-left: 20px;
	display: block;
	float: left;
	width: 28%;
	}
a.sm2_link {
	padding-left: 20px;
	display: block;
	float: left;
	width: 28%;
	}
	
.sm2playlist span.btn {
	float: none !important;
	}	
	
div.sm2_actions {
	text-align: right;
}

ul.sm2playlist li {
	padding: 0.25em 0.5em 0.25em 0.5em;
}
*/
.sm2_inline_title {
	margin-left: 20px;
	display: block;
	float: left;
	width: 28%;
	height: 21px;
	padding-top: 4px;
	}
a.sm2_link {
	padding-left: 30px;
	display: block;
	float: left;
	width: 28%;
	height: 21px;
	padding-top: 4px;
	
	background-image: url(/media/img/icons/buttons/tracklist.play_single.png);
	background-repeat: no-repeat;
	
	}
	
.sm2playlist span.btn {
	/*float: none !important;*/
	}	
	
div.sm2_actions {
	text-align: right;
	margin-top: 3px;
	height: 18px;
}

ul.sm2playlist li {
	padding: 1px;
	/*height: 25px;*/
}





/* button setup */
li.sm2_playing div.sm2_actions .ui.btn.play_single { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.play_single a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.play_single a:link { background-position: -147px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.play_single a:visited { background-position: -147px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.play_single a:hover { background-position: -147px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.add { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.add a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.add a:link { background-position: -230px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.add a:visited { background-position: -230px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.add a:hover { background-position: -230px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.pl_add { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.pl_add a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.pl_add a:link { background-position: -230px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.pl_add a:visited { background-position: -230px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.pl_add a:hover { background-position: -230px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.sm2_add { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.sm2_add a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.sm2_add a:link { background-position: -230px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.sm2_add a:visited { background-position: -230px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.sm2_add a:hover { background-position: -230px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.download { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.download a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.download a:link { background-position: -64px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.download a:hover { background-position: -64px -19px !important; }


/*li.sm2_playing div.sm2_actions .ui.btn.m3u { width: 19px; }*/
li.sm2_playing div.sm2_actions .ui.btn.m3u a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.m3u a:link { background-position: -313px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.m3u a:visited { background-position: -313px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.m3u a:hover { background-position: -313px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.delete { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.delete a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.delete a:link { background-position: -396px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.delete a:hover { background-position: -396px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.edit { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.edit a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.edit a:link { background-position: -479px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.edit a:visited { background-position: -479px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.edit a:hover { background-position: -479px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.playlist_edit { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.playlist_edit a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.playlist_edit a:link { background-position: -479px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.playlist_edit a:visited { background-position: -479px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.playlist_edit a:hover { background-position: -479px -19px !important; }


li.sm2_playing div.sm2_actions .ui.btn.fb_share { width: 19px; }
li.sm2_playing div.sm2_actions .ui.btn.fb_share a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_playing div.sm2_actions .ui.btn.fb_share a:link { background-position: -499px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.fb_share a:visited { background-position: -499px -38px !important; }
li.sm2_playing div.sm2_actions .ui.btn.fb_share a:hover { background-position: -499px -19px !important; }










li.sm2_paused div.sm2_actions .ui.btn.play_single { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.play_single a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.play_single a:link { background-position: -147px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.play_single a:visited { background-position: -147px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.play_single a:hover { background-position: -147px -19px !important; }


li.sm2_paused div.sm2_actions .ui.btn.add { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.add a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.add a:link { background-position: -23-38pxpx -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.add a:visited { background-position: -230px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.add a:hover { background-position: -230px -19px !important; }


li.sm2_paused div.sm2_actions .ui.btn.pl_add { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.pl_add a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.pl_add a:link { background-position: -230px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.pl_add a:visited { background-position: -230px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.pl_add a:hover { background-position: -230px -19px !important; }


li.sm2_paused div.sm2_actions .ui.btn.sm2_add { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.sm2_add a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.sm2_add a:link { background-position: -230px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.sm2_add a:visited { background-position: -230px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.sm2_add a:hover { background-position: -230px -19px !important; }


li.sm2_paused div.sm2_actions .ui.btn.download { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.download a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.download a:link { background-position: -64px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.download a:hover { background-position: -64px -19px !important; }


/*li.sm2_paused div.sm2_actions .ui.btn.m3u { width: 19px; }*/
li.sm2_paused div.sm2_actions .ui.btn.m3u a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.m3u a:link { background-position: -313px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.m3u a:visited { background-position: -313px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.m3u a:hover { background-position: -313px -19px !important; }


li.sm2_paused div.sm2_actions .ui.btn.delete { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.delete a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.delete a:link { background-position: -396px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.delete a:hover { background-position: -396px -19px !important; }


li.sm2_paused div.sm2_actions .ui.btn.edit { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.edit a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.edit a:link { background-position: -479px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.edit a:visited { background-position: -479px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.edit a:hover { background-position: -479px -19px !important; }


li.sm2_paused div.sm2_actions .ui.btn.playlist_edit { width: 19px; }
li.sm2_paused div.sm2_actions .ui.btn.playlist_edit a { background: url(/media/img/icons/buttons/btn.large.sprite.png);}
li.sm2_paused div.sm2_actions .ui.btn.playlist_edit a:link { background-position: -479px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.playlist_edit a:visited { background-position: -479px -38px !important; }
li.sm2_paused div.sm2_actions .ui.btn.playlist_edit a:hover { background-position: -479px -19px !important; }