/* Playable */
.playable {
text-decoration: none;
font-weight: bold;
display: block;
padding: .5em .8em;
outline: none;
background-image: url(img_dark/player-play-btn2.png);
background-repeat: no-repeat;
background-position: 8px 6px;
text-indent: 28px;
margin-bottom: 30px;
}
.track {
font-weight: bold;
cursor: pointer;
}

/* Button UI */
.button .playable {
padding-left: 2.5em;
min-height: 16px;
}
.button .playable.playing {

}

/* Simple UI */
.playable .ui {
display: none;
}
.playable.playing .ui,
.playable.paused .ui {
display: block;
}
.playable .track-title { /* display: block; */ width: 100%;}
.playable .ui.progress,
.playable .ui.progress .loading,
.playable .ui.progress .position {
height: 10px;
}
.playable .ui.progress {
position: relative;
/* border: 1px solid transparent; */
margin: 4px 0 0 0;
overflow: hidden;
cursor:ew-resize;
cursor:-moz-grab;
cursor:grab;
margin-right: 182px;
margin-left: 182px;
top: 8px;
}
.playable .ui.progress .loading,
.playable .ui.progress .position {
display: block;
position: absolute;
left: 0;
top: 0;
}
.playable .ui.timing {
display: inline-block;
cursor: text;
text-indent: 0;
text-align: right;
}

/* Volume */
.playable .ui.volume { 
position: relative;
width: 76px;
height: 10px;
float: right;
margin: 8px 8px 0px 0;
/* border: 1px solid transparent; */
cursor:ew-resize;
cursor:-moz-grab;
cursor:grab;
}
.playable .ui.volume:before {
content: '';
display: block;
position: absolute;
left: -25px;
top: -1px;
width: 18px;
height: 15px;
background-image: url(img_dark/player-volume.png);
background-repeat: no-repeat;
background-position: left top;
}
.playable .ui.volume .vol-position {
display: block;
position: absolute;
left: 0;
top: 0px;
height: 10px;
width: 70%;
}

/* Corners */
.playable {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}

/* Color Scheme */
.playable {
color: rgba(255, 255, 255, 0);
background-color: #131313;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-ms-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
}
.playable .track-title { color: #FFF; font-size: 14px; font-weight: normal; margin-top: 5px; position: absolute; overflow: hidden;}
.playable:hover, .playable:hover .track-title { color: #FFFFFF; }
span.playable:hover, span.playable:hover .track-title { color: #aaa; }

.playable.playing {
color: #fa4c29;
background-image: url(img_dark/player-pause-btn2.png);
}
.playable.paused {
color: #666;
}
.playable .ui.timing {
color: #FFF;
position: absolute;
right: 130px;
font-size: 10px;
margin-top: 3px;
}
.playable.paused .ui.timing {
color: #333;

}
.playable .ui.progress {
border-color: #111;
background-color: #0f0f0f;
}
.playable.paused .ui.progress {
background-color: #0f0f0f;
}
.playable .ui.progress .loading {
background-color: #222;
}
.playable .ui.progress .position {
background-color: #FFFFFF;
}
.playable.paused .ui.progress .position {
background-color: #333;
}
.playable .ui.volume { 
border-color: #111;
background-color: #0f0f0f;
}
.playable .ui.volume .vol-position { background-color: #FFF; }
.playable.paused .ui.volume .vol-position {
background-color: #222;
}
.playable.paused .ui.volume { 
border-color: #111;
background-color: #0f0f0f;
}

/* --- Extended player --- */
.ext-playable {
background-color: #111;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
margin-bottom: 30px;
overflow: hidden;
}
.ext-playable .playable {
margin: 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 0 0;
border-radius: 5px 5px 0 0;
background-color: #131313;
border-bottom: 1px solid #191919;
}
.ext-playable .player-button {
display: inline-block;
border-right: 1px solid #191919;
font-size: 10px;
font-weight: 400;
text-transform: uppercase;
color: #666;
padding: 3px 12px 3px 2px;
margin-left: 6px;
}
.ext-playable .player-button:hover { color: #fff; }

/* Show ui*/
.show-ui .ui { display: block; }

/* --- Playlist --- */
.playlist {
list-style: none;
overflow: hidden;
margin-bottom: 30px;
display: block;
clear: both;
border-bottom: 1px solid #131313;
}

.playlist li {
margin: 0;
position: relative;
width: 100%;
background-color: #0f0f0f;
border-top: 1px solid #131313;
overflow: hidden;
padding: 4px 0;
}
.playlist li.odd {
background-color: #0d0d0d;
}
.playlist .track-number {
position: absolute;
left: 8px;
top: 8px;
font-weight: 800;
color: #444;
text-align: center;
width: 20px;
}
.playlist .playable {
margin-left: 30px;
margin-bottom: 0;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
background-color: transparent;
background-image: url(img_dark/player-play-btn2.png);
}
.playlist .playable.playing {
background-image: url(img_dark/player-pause-btn2.png);
}
.playlist .playable .ui.progress .loading {
background-color: #222;
}
.playlist .playable .ui.progress, {
border-color: #212121;
background-color: #212121;
}
.playlist .playable.paused .ui.progress .position {
background-color: #444;
}
.playlist .playable.paused .ui.progress {
background-color: #222;
}
.playlist .playable .ui.volume { 
border-color: #111;
background-color: #0c0c0c;
}
/* Playlist button */
.playlist .player-button {
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
float: right;
margin: 2px 12px 6px 0px;
color: #999;
padding: 2px 8px;
background-color: #333;
line-height: normal;
font-size: 11px;
text-transform: uppercase;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-ms-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
}
.playlist .player-button:hover {
background-color: #fa4c29;
color: #fff;
}
.playlist .player-button strong { color: #999; }
.playlist .player-button:hover strong { color: #fff; }
.playlist .playlist-details {
float: left;
color: #666;
font-size: 11px;
margin: 2px 0 6px 42px;
}


/* Full player
---------------------------------------------------------------------- */
.player-home{
    position: absolute;
    width: 100%;
	
    bottom: 0;
    z-index: 1000;
    background-color: rgba(0, 0, 0, 0.37);
    padding: 15px 0;
}
#full-player-wrap {
/* background: #ff8800; */
/*width: 100%;*/
/* border: 1px solid #CF6E00; */
/* border-top: none; */
min-height: 32px;
clear: both;
}
/* Navigation */
#fp-nav {
float: left;
margin-top: 7px;
width: 114px;
padding: 0 10px;
}
#fp-nav a {
display: inline-block;
width: 17px;
height: 21px;
margin: 0 6px;
background-repeat: no-repeat;
background-position: left top;
opacity: .9;
filter:alpha(opacity=40);
}
#fp-nav a:hover { opacity: 1; filter:alpha(opacity=100); }
#fp-nav a.play {
background-image: url(img_dark/fp-play-btn.png);
background-position: left top;
}
#fp-nav a.play.pause {
background-image: url(img_dark/fp-play-btn.png);
background-position: right top;
}
#fp-nav a.next { background-image: url(img_dark/fp-next-btn.png); }
#fp-nav a.prev { background-image: url(img_dark/fp-prev-btn.png); }
#fp-nav a.details { background-image: url(img_dark/fp-details-btn.png); }

/* Player container */
#full-player {
float: left;
width: 970px;
height: 32px;
margin-top: 0px;
position: relative;
overflow: hidden;
margin-left: 10px;
}

/* Tracklist */
#tracklist {
top: 0;
left: 0;
position: absolute;
width: 100%;
padding: 0;
list-style: none;
z-index: 2;
}
#tracklist li {
margin: 0;
padding: 0;
height: 32px;
overflow: hidden;
}
#tracklist li .track {
background:none;
padding: 0;
text-indent: 0;
margin: 0;
height: 32px;
}

/* Tracklist navigation */
#tracklist-nav {
clear: both;
width: 100%;
padding-top: 20px;
display: none;
}
#tracklist-nav ul {
margin-bottom: 20px;
padding: 0;
list-style: none;
border-top: 1px solid #191919;
}
#tracklist-nav ul li {
margin: 0;
padding: 8px 12px;
color: #aaa;
background: #111;
border-bottom: 1px solid #191919;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-ms-transition: all .4s ease;
-o-transition: all .4s ease;
transition: all .4s ease;
cursor: pointer;
}
#tracklist-nav ul li:hover, #tracklist-nav ul li.active {
color: #fff;
background: #B8181F;
}
#tracklist-nav ul li .track-num {
font-size: 14px;
display: inline-block;
margin-right: 20px;
color: #666;
font-weight: bold;
}
#tracklist-nav ul li:hover .track-num, #tracklist-nav ul li.active .track-num { color: #fff }

.player-home #full-player-wrap{
padding-left: 0!important;
padding-right: 0!important;
}
.player-home #full-player-wrap .container{
width: auto!important;
margin-right: 0!important;
margin-left: 0!important;
padding-left: 0!important;
padding-right: 0!important;
display: table;
}
.player-home span.icone-musica{ background-image: url(img_dark/Nota_Musical.png); height: 32px; width: 34px; display: block; background-repeat: no-repeat; background-position: center center; float: left;}
.player-home span.separador-musica{
    display: block;
    width: 0px;
    height: 32px;
    border-right: 1px solid #FFFFFF;
    border-left: 1px solid #000000;
    float: left;
}
.player-home .progress{ border-radius:0;}
#full-player-wrap > div > a.details{
    width: 34px;
    height: 32px;
    float: right;
}
#full-player-wrap .glyphicon{
    font-size: 10px;
    color: #FFF;
    margin: 11px 10px 11px 11px;
}
@media only screen and (max-width: 1200px) {
	#full-player { width: 769px; }
}
@media only screen and (max-width: 991px) {
	#full-player { width: 608px; }
}


@media only screen and (min-width: 768px) and (max-width: 991px) {
		
	
	/* Full player
 	 ---------------------------------------------------------------------- */
 	#full-player { width: 549px; }
	#fp-nav {}

}

/* All mobile devices */
@media only screen and (max-width: 767px) {



	/* Lists
 	 ---------------------------------------------------------------------- */

	/* Stats list */
	ul.stats {
		margin-top: 40px;
		max-width: 300px;
	}
	ul.stats li {
		height: 65px;
		width: 100px;
	}
	ul.stats li .stat-value { 
		font-size: 38px;
	}
	ul.stats li .stat-name {
		font-size: 10px;
		color: #666;
	}



	/* Sound Manager Styles
 	 ---------------------------------------------------------------------- */
	.playable .ui.volume { display: none; }
	.playable .ui.progress { margin-right: 57px; margin-left: 245px;}


	

}


@media only screen and (max-width: 767px) {
		
	.player-home{
    position: relative;
	top:0px;
}
	/* Stats list */
	ul.stats { max-width: 420px; }
	ul.stats li { width: 120px; }
#full-player-wrap > div > a.details{
    right: 0;
    position: absolute;
	z-index: 20;
}



	/* Full player
 	 ---------------------------------------------------------------------- */
 	#full-player { width: 99.9%;
position: absolute;
margin: 0; }
	#fp-nav {
    padding: 0 2px;
    width: 98px;
	z-index: 25;
position: relative;
}
.playable .track-title {
padding: 0 0 0 102px;}
	.playable .ui.timing,
	.player-home span.separador-musica,
	.player-home span.icone-musica {display:none}



	/* Slider
	 ---------------------------------------------------------------------- */

	/* Fullwidth slider */
	.fullslider .nivo-caption {
		width: 420px;
		margin-left: -210px;
	}
	.fullslider a.nivo-prevNav { margin-left:-210px; }
	.fullslider a.nivo-nextNav { margin-right:-210px; }


	
}


@media only screen and (max-width: 479px) {


	/* Full player
 	 ---------------------------------------------------------------------- */
 	#full-player { 
 		width: 99.8%;
 		margin: 0;
 		position: absolute;
 		top: 0;
}
	#fp-nav {
		margin: 5px 0 0px 0;
		float:none;
		clear: both;
		display: block;
	}
	.playable .ui.progress{display:none;}
#full-player-wrap > div > a.details {
position: absolute;
top: 0;
right: 0;
}
.playable .track-title {
    padding: 3px 0 0 95px;
}


		
}