@charset "utf-8";
/* CSS Document */

a:link {
	text-decoration: none;
	color:#FFF;
}
a:visited {
	text-decoration: none;
	color:#FF9;
}
a:hover {
	text-decoration: none;
	color:#FC0;
}
a:active {
	text-decoration: none;
}


body{
	background:#222;
	font-family: Arial;
	margin:0;
	}


.bienvenidos{
	width:600px;
	height:400px;
	background-color:#A80000;
	position:absolute;
	left:50%;
	margin-left:-300px;
	top:50%;
	margin-top:-200px;
	border-radius:10px;
	background-image:url(fondo.jpg);
	box-shadow:0px 0px 30px rgba(0,0,0,0.875);

}


.logo{
float:left;
margin-top:80px;
margin-left:25px;
padding-top:20px;
}

.logo img{
	width:100%;
	height:auto;
}

.anillo{
float:left;
margin-top:80px;
margin-left:-65px;
}

.anillo img{
	width:100%;
	height:auto;
}


.seleccionar{

width:100%;
float:left;
background: rgba(0,0, 0, 0.4);
margin-top:20px;
}

.es{
	width:42%;
	float:left;
	color:#FFF;
	text-align:right;
	margin:8px 4%;
}


.en{
width:42%;
float:left;
color:#FFF;
text-align:left;
margin:8px 4%;
}


.visible{
opacity:1;
color:#FFF;
}

.reproductor{
	float:none;
	background-color:#999 0.5;
	width:100px;
}

.webmail{
	color:#FCC;
	float:right;
	width:70px;
	font-size: 9pt;
	margin-top:-15px;
}

@media screen and (max-width:800px){
	
.bienvenidos{
	width:100%;
	height:100%;
	background-color:#A80000;
	position:absolute;
	left:0%;
	margin-left:0px;
	top:0%;
	margin-top:0px;
	border-radius:0px;
	background-image:none;
	box-shadow:0px 0px 30px rgba(0,0,0,0.875);

}

.logo{
float:left;
margin-top:10%;
margin-left:20%;
margin-right:20%;
padding-top:2%;
width:60%;
}

.logo img{
	width:100%;
	height:auto;
}

.anillo{
float:left;
margin-top:5%;
margin-left:25%;
margin-right:25%;
width:50%;
}

.anillo img{
	width:100%;
	height:auto;
}


.seleccionar{

width:100%;
float:left;
background: rgba(0,0, 0, 0.4);
margin-top:5%;
}

.es{
	width:42%;
	float:left;
	color:#FFF;
	text-align:right;
	margin:8px 4%;
	font-size:25px;
}


.en{
	width:42%;
	float:left;
	color:#FFF;
	text-align:left;
	margin:8px 4%;
	font-size:25px;
}


.visible{
opacity:1;
color:#FFF;
}

.reproductor{
	float:none;
	background-color:#999 0.5;
	width:100px;
}
	
}


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


.bienvenidos{
	width:100%;
	height:100%;
	background-color:#A80000;
	position:absolute;
	left:0%;
	margin-left:0px;
	top:0%;
	margin-top:0px;
	border-radius:0px;
	background-image:url(fondo.jpg);
	background-repeat:repeat;
	box-shadow:0px 0px 30px rgba(0,0,0,0.875);

}

.logo{
float:left;
margin-top:10%;
margin-left:10%;
margin-right:10%;

width:80%;

}

.logo img{
	width:100%;
	height:auto;
}

.anillo{
float:left;
margin-top:5%;
margin-left:2%;
margin-right:8%;
width:90%;
}

.anillo img{
	width:100%;
	height:auto;
}


.seleccionar{

width:100%;
float:left;
background: rgba(0,0, 0, 0.4);
margin-top:5%;
}

.es{
	width:42%;
	float:left;
	color:#FFF;
	text-align:right;
	margin:8px 4%;
}


.en{
	width:42%;
	float:left;
	color:#FFF;
	text-align:left;
	margin:8px 4%;
}


.visible{
opacity:1;
color:#FFF;
}

.reproductor{
	float:none;
	background-color:#999 0.5;
	width:100px;
}


}