/*

 SoundManager 2: In-page MP3 player Rev. 20140309, BJMdata
 ----------------------------------------------------
 Clicks on links to MP3s are intercepted via JS, calls are
 made to SoundManager to load/play sounds. CSS classes are
 appended to the link, which are used to highlight the
 current play state and so on.

 Class names are applied in addition to "sm2_link" base.
 Default: sm2_link
 Additional states: sm2_playing, sm2_paused
 eg.
 <!-- default -->
 <a href="some.mp3" class="sm2_link">some.mp3</a>
 <!-- playing -->
 <a href="some.mp3" class="sm2_link sm2_playing">some.mp3</a>

 Side note: Would do multiple class definitions eg.
 a.sm2_default.sm2_playing{}
 .. except IE 6 has a parsing bug which may break behaviour,
 applying sm2_playing {} even when the class is set to sm2_default.

 If you want to make your own UI from scratch, here is the base:
 Default + hover state, "click to play":
	a.sm2_link {}
 	a.sm2_link:hover {}
 Playing + hover state, "click to pause":
	a.sm2_playing {}
	a.sm2_playing:hover {}
 Paused + hover state, "click to resume":
	a.sm2_paused {}
	a.sm2_paused:hover {}
*/
/*----------------------------------------*/
.album h2 {
	font-size: 13px;
	font-weight: bold;
	text-align:center;
	background-color: #EFEFEF;
}

.container .content .album ul li {
	list-style-type: none;
}
.container .content .album .sidebar2 .tracks {
	width:247px;
}
.container .content .album .tracks { /* For Compilations Page */
	margin-bottom:0px;
}
/*----------------------------------------*/
.album ul.tracks li a,
.album ul.tracks li a.sm2_link {
 /* assume all items will be sounds rather than wait for onload etc. in this example.. may differ for your uses. */
 display:inline-block;
 min-height:12px; /*BJMdata 16px */
 border-radius:3px;
 padding:1px 1px 1px 24px;
 min-width:190px;         /*BJMdata 19em */
 _width:190px; /* IE 6 */ /*BJMdata 19em */
 text-decoration:none;
 font-weight:normal;
 color:#000; /*BJMdata #f6f9ff */
}

.album ul.tracks li a.sm2_link {
 /* safari 3.1+ fun (or, proprietary crap. TBD.) */
 -webkit-transition-property: hover;
 -webkit-transition: background-color 0.15s linear;
 -moz-transition: background-color 0.15s linear 0s; /* firefox 4 */
  -o-transition-property: background-color; /* opera 10.5 */
  -o-transition-duration: 0.15s;
}

.album ul.tracks li a, /* use a.sm2_link {} if you want play icons showing only if SM2 is supported */
.album ul.tracks li a.sm2_paused:hover,
.album ul.tracks li a.sm2_link:hover {
 background-image:url(../icons/play.png);
 background-position:3px 50%; 
 background-repeat:no-repeat;
 _background-image:url(../icons/play.gif); /* IE 6 */
}

.album ul.tracks li a.sm2_link:hover {
 /* default hover color, if you'd like.. */
 background-color: #CCF; 
 color:#000; /* BJMdata #fff */
}

.album ul.tracks li a.sm2_paused {
 background-color: #C6D6DB; 
}

.album ul.tracks li a.sm2_paused:hover {
 background: #CCF url(../icons/play.png) no-repeat 3px 50%;
 _background-image:url(../icons/play.gif);
}

.album ul.tracks li a.sm2_playing,
.album ul.tracks li a.sm2_playing:hover {
 background: #8E9AC4 url(../icons/pause.png) no-repeat 3px 50%;
 _background-image:url(../icons/pause.gif);
 text-decoration:none;
}

/* hide button while playing?
.album ul.tracks li a.sm2_playing {
 background-image:none;
}
*/

body #sm2-container object,
body #sm2-container embed {
 /*
  flashblock handling: hide SWF off-screen by default (until blocked timeout case.)
  include body prefix to ensure override of flashblock.css.
 */

 left:-9999em;
 top:-9999em;
}

