html{
    height: 100%;
}

body {
    font-family:'Nunito',helvetica;  
    height:100%;
    margin: 0px;
    background-attachment: fixed;
    background: url(/img/login_register/fondo.svg) no-repeat fixed center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
}


.contenido {
    width: 30%;
    background-color: #ffffff;
    padding: 40px;
    border-radius: 30px 0 30px 0;
    -webkit-box-shadow: 17px 14px 68px -33px rgba(0,0,0,1);
    -moz-box-shadow: 17px 14px 68px -33px rgba(0,0,0,1);
    box-shadow: 17px 14px 68px -33px rgba(0,0,0,1);
}

.logo{
    display: flex;
    justify-content: center;
}

.logo img{
    width: 100px;
}

.registrate{
    text-align: center;
    font-weight: bold;
    color: #2e81b9;
}

.new_acount{
    background-color: #2e81b9;
    border-radius: 15px;
    text-align: center;
    color: #ffffff;
    padding: 3px 3px 1px 3px;
}

.new_acount span{
    font-size: 15px;
    font-weight: bold;
}

.new_acount p{
    font-size: 13px;
}

.exist_acount{
    background-color: #F39325;
    border-radius: 15px;
    text-align: center;
    color: #ffffff;
    font-size: 15px;
    padding: 1px 1px 1px 1px;
}


/*FORMULARIO*/
.formulario{
    padding: 0px 0px;
}

.formulario div{
    position: relative;
}

input[type="number"]::-webkit-outer-spin-button, 
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.input_form {
    width:calc(100% - 20px) ;  
    margin-top: 30px;    
    padding: 10px; 
    text-align: left;
    border: 1px solid grey;
    border-radius: 15px;
    display: block; 
}


.input_form:focus{
    border:1px solid #F39325;
    outline:none !important;
    outline-width: 0 !important;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}


input.error{
    border:1px solid #F39325 !important;
}

.formulario .label_form {
    position: absolute;
    font-size: 13px;
    padding-left: 10px;
    color: #2e81b9;        
    margin-top: 10px;
    transition: all 0.2s;
}

.active {
    position: absolute !important;
    top: -30px;
    font-size: 14px !important;
    text-transform: uppercase;

}

.btn_eye{
    background-color: #ffffff;
    color: grey;
    border: 0px;
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    z-index: 2;
}

.btn_form {
    width: 100%;
    height: 30px;
    border-radius: 12px;
    display: block; 
    background-color:  #2e81b9;
    border: 0px;
    font-size: 12PX;
    font-weight: bold;
    text-align: center;
    color: white;
    margin: 20px 0px;
    cursor: pointer;
}
.btn_disabled {
    background-color:  grey;
    cursor: none;
}



.btn_form:focus, .btn_eye:focus{
    outline:none !important;
    outline-width: 0 !important;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}


a{
    text-decoration: none;
}


.iniciar_sesion{
    font-size: 14px;
    text-align: center;
    font-weight: bold;
    color: #37474f;
}

.a_iniciar_sesion{
    color: #4a9acf;
    
}

/*VALIDACIONES*/

label.error{
font-size: 12px;
color: #F39325;
padding-left: 10px;
font-weight: bold;
}


@media only screen and (max-device-width:480px), only screen and (max-width:480px) {
    .contenido { 
        width: 80% !important;        
        padding:30px 15px !important;
    }

    .logo img{
        width: 80px;
    }

    .formulario{
        padding: 0px 10px !important;
    }
    
}