/* Tracklist
 --------------------------------*/
.tracklist {
	counter-reset: li; /* Initiate a counter */
    list-style: none; /* Remove default numbering */
    *list-style: decimal; /* Keep using default numbering for IE6/7 */
    padding: 0;
    margin-left: 0;
    border: 1px solid #444;
}
	.tracklist li {
		margin: 0;
		padding: 3px 0;
		position: relative;
		border-bottom: 1px solid #444;
		background-color: #003333;
	}
	.tracklist li:last-child { border: none; }
	
	.track-details {
		margin-left: 44px;
		padding: 4px 0;
		border-left: 1px solid #444;
	
		width: auto;
		overflow: hidden;
}
	.track-details:before {
		content: counter(li);
	    counter-increment: li;
	    position: absolute; 
	    left: 0;
	    top: 8px;
	    text-align: center;
	    font-size: 24px;
	    width: 44px;
	}
		.track {
			margin-left: 15px;
			position: relative;
			float: left;
}
		.track-title, .track-artists {
			display: block;
			margin-left: 55px;

		}
		.track-title {
			color: #eee;
		}
		.track-title:hover {
			color: #ea4233;
		}
		.track-artists, .track-artists:hover {
			color: #777;
			font-size: 12px;
		}
		.track-cover {
			position: absolute;
			left: 0;
			top: 0;
			max-width: 40px !important;
			max-height: 40px !important;
			vertical-align: middle;
		}
		.track .track-title:before {
			display: none;
			content: "";
			position: absolute;
			left: 0;
			top: 0;
			width: 40px;
            height: 40px;
            -webkit-border-radius: 40px;
            -moz-border-radius: 40px;
            border-radius: 40px;
            z-index: 5;
            text-align: center;
            color: #eee;
            background-color: #000;
            background-color: rgba(0,0,0,0.8);
		}
		.track.sp-play .track-title:before {
			display: block;
			background-image: url(../img/eq.gif);
            background-position: center center;
            background-repeat: no-repeat;
		}
		.track.sp-pause .track-title:before {
			display: block;
			font-family: 'Scamp-Player';
            font-size: 16px;
            line-height: 40px;
            content: "\e6c9";
		}
		.track:hover.sp-pause .track-title:before { color: #eee; }

	/* Track Buttons */
	.track-buttons {
		margin-right: 15px;
		margin-top:10px;
		float: right;
	}
		.track-buttons i {
			margin:0 6px;
			color: #bbb;
		}
		.track-buttons a:hover i { color: #ea4233; }

/* Releases
 ------------------------------------ */

#releases {
	min-height: 380px;
}

/* Release footer */
.release-footer {
	background-color: #eee;
	padding: 15px;
}
.masonry.fullwidth .item > a, 
.masonry.fullwidth .item .release-social,
.masonry.fullwidth .item .release-footer {
	margin: 0 1px;
}
.masonry.fullwidth .item:nth-child(odd) .release-footer {
	background-color: #e3e3e3;
}
	.release-footer > .release-title,
	.release-footer > .release-artists {
		overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        -ms-text-overflow: ellipsis;
	}
	.release-footer > .release-title {
		font-size: 14px;
		color: #111;
		margin-bottom: 2px;
	}
	.release-footer > .release-title a {
		color: #111;
	}
	.release-footer > .release-title a:hover {
		color: #ea4233;
	}

	.release-footer > .release-artists {
		font-size: 12px;
		color: #111;
		padding-bottom: 0px;
		display: block;
	}

.release-badge {
	position: absolute;
	left: 0;
	bottom:0;
	width: 100%;
	padding: 3px 15px;
	z-index: 3;
	display: block;
	color: #fff;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: bold;
	background-color: #ea4233;
	background-color: rgba(234,66,51,0.7);
}
	.player-badge-pause, .player-badge-play {
		visibility: hidden;
	}
	.release.sp-play .player-badge-pause {
		visibility: hidden;
	}
	.release.sp-play .player-badge-play {
		visibility: visible;
	}
	.release.sp-pause .player-badge-pause {
		visibility: visible;
	}
	.release.sp-pause .player-badge-play {
		visibility: hidden;
	}

/* Release social */
.release-social {
	background-color: #282828;
	padding: 8px 6px;
	width: 100%;
	overflow: hidden;
}
	.release-social a {
		float: left;
		width: 30px;
		height: 16px;
		line-height: 16px;
		text-align: center;
	}
	.release-social a:hover i {
		color: #fff;
	}
	.release-social a i {
		color: #999;
		font-size: 16px;
	}