/* Estilos para sección de Login 
 Creado por: Josué González
 Editorial Don Bosco 
 Fecha: 18/10/2018;
*/


/* Estilos iniciales */

@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
@font-face {
	font-family: 'codropsicons';
	src:url('../fonts/codropsicons/codropsicons.eot');
	src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
		url('../fonts/codropsicons/codropsicons.woff') format('woff'),
		url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
		url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
	font-weight: normal;
	font-style: normal;
}



body{
background-image: url('../img/recuperacion2.jpg'); 
background-repeat: no-repeat; 	
width: 1240px;
margin-top: 150px;
background-color: #000;
}

.ubicacion{
position: relative;
top: 313px;
left: 630px;
width: 150px;
}

.alinear{
display: inline-flex;
margin: 10px 10px 10px 10px;
}

.alinear label{
width:100px;
display: inline-flex;
font-family: "Comic Sans MS", cursive, sans-serif;
font-size: 32px;
margin-right: 110px;
}

.titulo{
position: relative;
    top: 10px;
    left: auto;
    width: 100%;
    text-align: center;

}
.titulo_recuperar{
position: relative;
    top: 10px;
    left: auto;
    width: 100%;
    text-align: center;
    color: #fff;

}


.contenedor_recuperar{
overflow: hidden;	
background-color: #34495e;
width:97%;
margin: 0px auto;
height: 400px;
padding: 10px;
position: relative;
top: 0px;

}

.contenedor{
overflow: hidden;
background-color: #34495e;
width:50%;
margin: 0px auto;
height: 500px;
padding: 10px;
position: relative;
top: 100px;

}


.contenedor{

border: #fff 1px solid;

}

.contenedor img {
max-width: 60%;
margin-left: 170px;
margin-right: 170px;
margin-top: 10px;

}


.contenedor_login{
width:70%;	
border: #fff 1px solid;
margin: 0px auto;
position:relative;
top:0px;
height: 230px;


}

.banner_login{
background-color:#ffff;
width:100%;
border: #000 2px solid;
margin: 0px auto;
}


.usuario{
width: 50%;
display: ruby;
position: relative;
top: 45px;
left: 165px;
}

.usuario label {
margin: 0px 30px 0px 0px;

}

.password{
width: 50%;
display: ruby;
position: relative;
top: 45px;
left: 140px;
}

.password label {


	margin: 0px 30px 0px 0px;

	}


.boton{
position: relative;
top: 10px;
left: 130px;

}

.boton_contrasena2{
position: relative;
top: 80px;
width: 100%;
margin-left: auto;
margin-right: auto;
display: flex;
left: -230px;
}

.boton_recuperar{
position: relative;
top: 50px;
width: 74%;
margin-left: auto;
margin-right: auto;
left: 0px;
}


input#ingresar{
color: #fff;
font-family: "Comic Sans MS", cursive, sans-serif;
font-size: 30px;
background-color:#005C63; 
width:282px;
height:50px;
border-radius: 15px;
box-shadow: 4px 3px 0px 0px #808d87;
}
input#regresar{
width:250px;
height:40px;
}
input#cambiar{
width:250px;
height:40px;
margin-left: 10px;
margin-right: 10px;
}


input#usr, #password, #password2{
width:267px;
height:35px;
border: 3px solid black;
}


.posicion{
width: 80%;
position: relative;
top: 50px;
left: -30px;
margin-left: auto;
margin-right: auto;
}


.posicion_login{
width: 100%;
position: relative;
top: 50px;
left: 60px;
margin-left: auto;
margin-right: auto;
}

.posicion_login label{

margin: 10px 10px 10px 10px;	
}

.posicion_login input{
display: block;	
position: relative;
left:170px;
top:-25px;

}
.posicion label{

margin: 10px 10px 10px 10px;	
}

.posicion input{
display: block;	
position: relative;
left:170px;
top:-25px;

}



.posicion select{
display: block;
position: relative;
left:250px;	
top:-20px;

}

.recuperar span{
text-align: center;
width: 80%;

}

.recuperar a {
color: #0c0303;
position: relative;
top: 330px;
left: 834px;
}

.mensaje_error{

text-align: center;
margin-top: 100px;
position: relative;
top: 50px;
color: red;
font-size: 30px;

}