/*** FRONTEND ***/

#MyRecordCollection:before,
#MyRecordCollection:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

#MyRecordCollection:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
#MyRecordCollection {
    *zoom: 1;
}




/* Table view */
#MyRecordCollection td {
	padding: 3px;
}
#MyRecordCollection tr:nth-child(odd) td {
	background: rgba(0,0,0,0.1);
}

#MyRecordCollection tr:nth-child(even) td {
	background: rgba(255,255,255,0.1);
}

#MyRecordCollection th {
	background: rgba(0,0,0,0.3);
}

#MyRecordCollection {
	color: #000;
}


#MyRecordCollection.lightondark {
	color: #fff;
}

#MyRecordCollection.lightondark th {
	background: rgba(255,255,255,0.3);
}

/** covers_wo (Default) **/

#MyRecordCollection ul {
	padding: 0px;
}

ul.music,
ul.music li,
ul.music li a,
ul.music li img{ margin:0; padding:0; list-style:none; list-style-type: none !important; border:0; text-decoration:none; }
ul.music li{ margin:15px 15px 15px 0 !important; float:left; position:relative; } 
ul.music li a{ display:block; position:relative; float:left; width:80px; height:80px; text-indent:-1000em; overflow:hidden; z-index:1; cursor: pointer; } 
ul.music li img{ position:absolute; width:80px; height:80px; border:0; }

/* Jewel Case */
ul.music li.jewel img{ width:72px; height:72px; top:3px; left:12px; } 
ul.music li.jewel a{ background:url(../gfx/jewel.png) 0 0 no-repeat; width:96px; height:82px; } 
ul.music li.jewel{ background:url(../gfx/blank_insert.gif) 12px 3px no-repeat; }

/* Vinyl Sleeve */
ul.music li.vinyl img { width:72px; height:72px; left:2px; top:1px; } 
ul.music li.vinyl a { background:url(../gfx/vinyl.png) 0 0 no-repeat; width:96px; /*height:76px;*/ height: 82px; } 
ul.music li.vinyl { background:url(../gfx/vinyl_insert.gif) 2px 1px no-repeat; }


/** covers **/

ul.simplemusic li { display: block; float: left; width: 100px; height: 100px; margin: 10px 10px 0 0 !important; padding: 0px; position: relative; background: #ccc; }
ul.simplemusic li img { width: 100px; height: 100px; position: absolute; top: 0px; left: 0px; z-index: 0;}
ul.simplemusic li a { display: none; width: 90px; height: 90px; position: absolute; top: 0px; padding: 5px; left: 0px; z-index: 2; background: rgba(0,0,0,0.8); color: #fff; font-size: 11px; }
ul.simplemusic li:hover a { display: block;  }
ul.simplemusic a span { display: none; }
ul.simplemusic a span.mrc_artist,
ul.simplemusic a span.mrc_title { display: block; }
ul.simplemusic a span.mrc_title { font-weight: bold; }

ul.simplemusic a span.mrc_format,
ul.simplemusic a span.mrc_label { display: inline;  color: #bbb; }

/** list **/
ul.simple { list-style-type: none !important; }
ul.simple li:nth-child(odd) { background-color: #eee; }

.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
	-webkit-box-shadow: 0 0 5px #aaa;
	box-shadow: 0 0 5px #aaa;
	background: #fff;
	font: 12px Helvetica, Arial, sans-serif;
	color: #000;
}
body .ui-tooltip {
	border-width: 2px;
}


/** DISPLAY INFO **/
#MRC_INFO { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12px; padding: 0px;  }
.tracks{
	clear: both;
	width: 450px;
	font-size: 12px;
	border-spacing: 0;
	padding-left: 0;
	padding-top: 5px;
}

.tracks th{
	padding: 2px;
	color: #444;
	text-align: left;
	background-color: #eee;
	border-bottom: 1px solid #555;
}

.tracks td{
	padding: 2px;
	color: #000;
	vertical-align: top;
	text-align: left;
	border-bottom: 1px solid #ddd;
}
#MRC_INFO img { float: left; border: 1px solid #333; margin: 0 5px 5px 0;  }
#MRC_INFO h2 { display: inline; font-size: 14px; }
#MRC_INFO div { margin-top: 5px; line-height: 1.3;}
#MRC_INFO .label { display: inline-block; width: 100px; }
p.credits { line-height: 1.2; width: 450px !important; }
#MRC_INFO p.credits b {
	margin-top: 5px;
	width: 450px;
	display: block;
	padding: 2px;
	color: #444;
	text-align: left;
	background-color: #eee;
	border-bottom: 1px solid #555;
}