

.audiojs audio { 
position: absolute; 
left: -1px;
height: 82px;
width: 87px; }
.play-pause{
width: 87px;
height: 82px;

}
}
.audiojs 
{ width: 87px; 
height: 82px; 

overflow: hidden; 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #444), color-stop(0.5, #555), color-stop(0.51, #444), color-stop(1, #444)); \
background-image: -moz-linear-gradient(center top, #444 0%, #555 50%, #444 51%, #444 100%); \
-webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); \
-o-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); } \
cursor: pointer; } \
.audiojs .error-message { 
float: left; 
display: none; 
margin: 0px 10px; 
height: 36px; 
width: 400px; 
overflow: hidden; 
line-height: 36px; 
white-space: nowrap; 
color: #fff; \
text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; } \
.audiojs .error-message a { 
color: #eee; 
text-decoration: none; 
padding-bottom: 1px; 
border-bottom: 1px solid #999; 
white-space: wrap; } \
\
.audiojs .play { 
background: url("$1") -2px -1px no-repeat; } \
.audiojs .loading { 
background: url("loading.gif") -2px -31px no-repeat; } \
.audiojs .error { 
background: url("$1") -2px -61px no-repeat; } \
.audiojs .pause { 
background: url("$1") -2px -91px no-repeat; } \
\
.playing .play, .playing .loading, .playing .error { 
display: none; } \
.playing .pause { 
display: block; } \
\
.loading .play, .loading .pause, .loading .error { 
display: none; } \
.loading .loading { 
display: block; } \
\
.error .time, .error .play, .error .pause, .error .scrubber, .error .loading { 
display: none; } \
.error .error { 
display: block; } \
.error .play-pause p { 
cursor: auto; } \
.error .error-message { 
display: block; }
.progress{
	height: 3px;
	opacity: 0.3;
	background-color: black;
}

.time{
/*	float:right;
	font-size: 10px;
	font-family: Roboto;*/
	visibility: hidden;
}

#instant_buttons{
margin: auto;
cursor:pointer;
}

.rojo{

	background: url("../images/botonrojo.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.rojo:active{
	background-color: #00FF00;
	background: url("../images/botonrojo_presionado.png");
}
.azul{

	background: url("../images/botonazul.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.azul:active{
	background-color: #00FF00;
	background: url("../images/botonazul_presionado.png");
}
.negro{

	background: url("../images/botonnegro.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.negro:active{
	background-color: #00FF00;
	background: url("../images/botonnegro_presionado.png");
}
.verde{

	background: url("../images/botonverde.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.verde:active{
	background-color: #00FF00;
	background: url("../images/botonverde_presionado.png");
}
.amarillo{

	background: url("../images/botonamarillo.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.amarillo:active{
	background-color: #00FF00;
	background: url("../images/botonamarillo_presionado.png");
}
.blanco{

	background: url("../images/botonblanco.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.blanco:active{
	background-color: #00FF00;
	background: url("../images/botonblanco_presionado.png");
}
.naranja{

	background: url("../images/botonnaranja.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.naranja:active{
	background-color: #00FF00;
	background: url("../images/botonnaranja_presionado.png");
}
.morado{

	background: url("../images/botonmorado.png");
	height:82px;
	width:87px;
	-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.morado:active{
	background-color: #00FF00;
	background: url("../images/botonmorado_presionado.png");
}










