body {
    background-color: #f1f3fa;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #666666;
    margin-top: 100px;
}
* {
    margin: 0px;
    padding: 0px;
    outline: none;
}
img { border: none; margin: 0; padding: 0; }
#datos {
    float: left;
    width: 120px;
    margin-left: 10px;
    margin-right: 10px;
    padding-right: 5px;
    padding-left: 10px;
    border-right-width: 1px;
    border-left-width: 1px;
    border-right-style: solid;
    border-left-style: solid;
    border-right-color: #666666;
    border-left-color: #666666;
}
#logo {
    margin-left: 110px;
    width: 130px;
}

.banner-registro{
    /* float: left; */
    /* width: 475px;*/
    height: 87px;
    background: transparent url(../img/header_logo.png) repeat-x top center;
}

.banner-registro-login{
    /* float: left; */
    /* width: 475px;*/
    height: 60px;
    background: transparent url(../../img/logoEnlace.svg) no-repeat scroll center top;
    margin-top: 20px;
}

.msg-campos-obligatorios{
    font-size: 10px;
    color: #999;
    border-top: 1px solid #BBB;
    margin: 20px 40px 5px;
    width: 400px;
    padding: 4px 0 !important;
}
#submit-recuperar{
    display: block;
    color: #FFF;
    background-color: #3598dc;
    cursor: pointer;
    border: 1px solid #3598dc;
    white-space: nowrap;
    padding: 8px 18px;
    font-size: 12px;
    text-decoration: none;
    float: right;
}
#recuperar-modal p{
    padding: 10px 20px 0px 40px;
}

#recuperar-modal p label{
    display: block;
    color: #333365;
    font-size: 11px;
}

#recuperar-modal p input{
    width: 290px;
    height: 20px;
    border-width: 1px;
    border-color: #CCC;
    border-style: solid;
}

#recuperar-modal p span{
    font-size: 10px;
    color: #999;
}

#recuperar-modal p li{
    font-size: 10px;
    color: #999;
}


#contenedor_login .imgTop {
    margin: 0 auto;
    position: relative;
    display: block;
    width: 300px;
    padding: 20px 0;
}
#contenedor_login {
    margin: auto;
    width: 330px;
    background-color: #FFF;
    font-family: "Open Sans",sans-serif;
}
#contenedor_login span.mensaje_recuperar{
                                         
}
#caja_info {
    margin: auto;
    width: 255px;
    text-align: center;
    padding-top: 35px;
    padding-bottom: 20px;
}

#corte_izq {
    float: left;
    height: 194px;
    width: 12px;
    background-image: url(../img/login_corte_izq.png);
    background-repeat: no-repeat;
}
#corte_der {
    float: left;
    height: 194px;
    width: 12px;
    background-image: url(../img/login_corte_der.png);
    background-repeat: no-repeat;
}
#contenedor_contenido {
    float: left;
    width: 449px;
    height: 194px;
    background-image: url(../img/login_fondo.png);
    background-repeat: repeat-x;
}
#contenedor_formulario {
    float: left;
    height: 194px;
    width: 160px;
}
#contenedor_info {
    float: left;
    height: 186px;
    width: 288px;
    /* border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #999999; */
}
#titulo {
    font-size: 16px;
    color: #222;
    padding-top: 15px;
    padding-bottom: 20px;
    font-weight: 600;
}
#btn_entrar {
    margin: auto;
    width: 138px;
    padding-top: 0px;
}
.texto_destacado {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #0076be;
}
.escribir {
    width: 81% !important;
}

.opciones {
    padding-top: 5px;
    padding-bottom: 5px;
}
.login {
    width: 135px;
    padding-top: 0px;
    margin-left: 15px;
}


#contenedor_login input.rut {
    width:183px;
}

.mail {
    width: 122px;
}

#contenedor_login div input.dv {
    width: 14px;
    margin-right: 0px;
}

.ingresar {    
    color: #FFF;
    background-color: #3598dc;
    cursor: pointer;
    border: 1px solid #3598dc;
    white-space: nowrap;
    padding: 8px 18px;
    font-size: 12px;
    float: right;
}

.btn_volver{
    margin-left:15px;
}
#contenedor_login form{
    height: 300px;
    padding: 0 25px 0px 25px;
}

#contenedor_login form div, .formbottom div{
    float:left;
    width: 100%;
    position: relative;
}
#contenedor_login div i{
    float:left;
    position:  absolute;
    font-size:  14px;
    line-height: 30px;
    margin-left: 10px;
    color: #999;
    left: 0px;
}
#contenedor_login div input{
    padding: 7px 12px 7px 28px;
    background-color: #fff !important;
    border: 1px solid #c2cad8;
    margin-right: 10px; 
    border-left: 2px solid #3598dc;
    width: 58%;
}
#contenedor_login div input.dv{
	float: right !important;
	padding: 7px 12px 7px 15px;
}

#contenedor_login div input.escribir{
    width:238px !important;
}
form label.error {
    background-color: red;
    bottom: -20px;
    color: #fff;
    font-size: 12px;
    padding: 1px 4px 1px 4px;
    position: absolute;
    z-index: 2;
    text-align: left;
    width: 272px;
    font-weight: bold;
    left: 0px;
}

.clave{
    margin-bottom: 10px; 
    padding-left:25px !important; 
    width: 90% !important;
    border-left: 2px solid #3598dc !important;
}

.mensaje{
	font-size: 13px; 
	color: #333; 
	line-height: 30px;
}

.g-recaptcha{
    margin: 0px 0px 0px -10px;
    position: relative;
    width: 280px;
    transform: scale(0.93);
    margin: 15px auto;
    margin-left: -10px;

}

div.formbottom {
    height: 68px; 
    padding: 10px 25px;
}

/********** ****MENSAJES ************************************************************************/
ul.psy_error, ul.psy_success, ul.psy_info, ul.psy_warning { margin: 0 0 10px 0; padding: 15px 80px; background-position: 15px center; background-repeat: no-repeat; }
ul.psy_error li, ul.psy_success li, ul.psy_info li, ul.psy_warning li { list-style-type: square; }
ul.psy_error { border-top: 2px solid #ff3333; border-bottom: 2px solid #ff3333; background-color: #ffdddd; background-image: url(../img/msg_error.png); }
ul.psy_error li { color: #cc0000; }
ul.psy_success { border-top: 2px solid #4f8a10; border-bottom: 2px solid #4f8a10; background-color: #dff2bf; background-image: url(../img/msg_success.png); }
ul.psy_success li { color: #3e6c0c; }
ul.psy_info { border-top: 2px solid #00529b; border-bottom: 2px solid #00529b; background-color: #bde5f8; background-image: url(../img/msg_info.png); }
ul.psy_info li { color: #00529b; }
ul.psy_warning { border-top: 2px solid #b06a00; border-bottom: 2px solid #b06a00; background-color: #feefb3; background-image: url(../img/msg_warning.png); }
ul.psy_warning li { color: #8e5600; }
/********** FIN MENSAJES ************************************************************************/

/*====================================================================================================================
MEDIA QUERY PARA TELÉFONOS
======================================================================================================================*/
@media (max-device-width: 667px) and (orientation: portrait){
	#contenedor_login{
		margin-top: 150px !important;
	}

	#contenedor_login form {
	    height: 870px !important;
        padding: 0 70px 0px 80px;
	}

	 #contenedor_login div input{
		width: 70% !important;
		height: 70px;
		padding: 7px 12px 7px 66px;
		margin-bottom: 25px;
		font-size: 40px !important;
    }

    #contenedor_login .imgTop {
        width: 90% !important;
        padding: 60px 0px 30px 0px;
        margin-bottom: 30px;
    }

    #contenedor_login div i{
        margin-top: 3px !important;
    	font-size: 35px !important;
    	padding: 40px 5px 7px 8px !important;
    }
    #contenedor_login div input.rut{
        float: none !important;
    }
     #contenedor_login div input.dv{
    	margin-bottom:25px;
        margin-left: 0px;
    	float: none !important;
		padding:7px 0px 7px 15px !important;
		width: 15% !important;
    }
    #contenedor_login div input.escribir{
        width: 95% !important;
        margin-bottom: 63px
        padding-right: 0px !important;
        padding-left: 65px;
    }
    #contenedor_login span.mensaje_recuperar{
        font-size: 39px !important;                                 
    }

    #contenedor_login div.mensaje{
        padding-top: 65px !important;
    }

    #contenedor_login div.rut_completo{
        width:103%;
    }

    #contenedor_login div.pass{
        width:97%;
        margin-bottom: 0px !important;
    }

    #titulo{
        margin:25px 0px 30px 0px;
        font-size: 48px;
    }

    .ingresar {
    	height: 100px;
    	font-size: 40px !important;
        margin-top:-24px !important;
        margin-right: -10px !important;
    }

    .mensaje{
    	font-size: 25px !important;
    	width: 100%;
    }

    #submit-recuperar {
        font-size: 20px;
    }

    .clave{
    	padding: 7px 12px 7px 66px !important;
    }
    .btn_volver{
        margin-left:0px;
    }
    #contenedor_login div.g-recaptcha {
        width: 0% !important;
    }
    .g-recaptcha{
        transform: scale(2.8) !important;
        margin-bottom: 77px !important;
        margin-top: 70px !important;
    }

   div.formbottom {
        height: 282px !important; 
        padding: 10px 72px !important;
    }

    #contenedor_login .btn_volver{
        margin-left:50px !important;
        margin-right: 25px !important;
    }

    form label.error{
        bottom: -16px !important;
        font-size: 30px !important;
        width: 98% !important;
    }

    label#pass{
        bottom: 0px !important;
        width: 103%;
    }
    

}

@media (max-device-width: 667px){
	body {
		margin-top: 0px;
	}
    #contenedor_login{
        margin: auto;
        height: 100% !important;
        width: 100% !important;
        background-color: #FFF;
        font-family: "Open Sans",sans-serif;
    }

    #contenedor_login form{
    	height: 352px;
    }
   
    #contenedor_login div i{
        margin-top: 15px;
        padding: 0px 5px 7px 0px;
    }
    #contenedor_login div input{
		width: 79%;
    }
    #contenedor_login div.rut_completo{
        width:102%;
    }
    #contenedor_login .imgTop {
        width: 50%;
        padding: 30px 0px 0px 0px;
        margin-bottom: 30px;
    }
    #contenedor_login div input.rut{
        width: 79%;
    }

    #contenedor_login div.rut_completo input.dv{
    	margin-top:15px;
    	float: none !important;
		padding:7px 12px 7px 27px;
		width: 8%;
    }
    #contenedor_login div.pass{
        margin-bottom: -45px;
    }
    #contenedor_login div input.escribir {
        width: 96% !important;
        padding-right: 0px;
        margin-bottom: 45px;
    }

    #titulo {
        font-size: 30px;
    }

    #submit-recuperar {
        font-size: 20px;
    }

    .ingresar {
	    color: #FFF;
	    background-color: #3598dc;
	    cursor: pointer;
	    border: 1px solid #3598dc;
	    white-space: nowrap;
	    padding: 8px 18px;
	    font-size: 20px;
	    float: right;
	    margin-top:0px;
        margin-right: 10px;
	}
	.escribir {
	    width: 94% !important;
	}

    #contenedor_login .btn_volver{
        margin-left:10px;
        margin-right: 0px;
    }
	#contenedor_login div.mensaje{
        padding-top: 12px;
		font-size: 18px;
		width: 100%;
	}
    #contenedor_login form div, .formbottom div{
        width:100%;
    }

    
    #contenedor_login div.g-recaptcha {
        width: 0% !important;
    }
    .g-recaptcha{
        transform: scale(1.1);
        margin-bottom: 21px;
        margin-top: 19px;
        margin-left: 0px;
    }

    div.formbottom {
        height: 105px; 
        padding: 10px 25px;
    }

    #contenedor_login span.mensaje_recuperar {
        font-size:20px;
    }

    form label.error{
        bottom: -24px;
        font-size: 15px;
        width: 96%;
    }
    label#pass{
        bottom: 22px;
        width: 98%;
    }
}
/*====================================================================================================================
MEDIA QUERY PARA IPAD
======================================================================================================================*/
@media(min-device-width: 768px) and (max-device-width: 1024px){
	#contenedor_login{
		width:35%;
		margin: auto;
	}
	#contenedor_login form{
		height: 323px;
	}
	#contenedor_login div input.escribir{
		width: 85% !important;
    }

    #contenedor_login div.pass{
        margin-bottom: 0px;
    }

    #contenedor_login div.dv{
    	margin-top:0px;
    	float: right !important;
		padding: 7px 12px 7px 28px;
		width: 7% !important;
    }

    #contenedor_login div.escribir {
	    width: 94% !important;
	}
	#contenedor_login div.ingresar {
	    color: #FFF;
	    background-color: #3598dc;
	    cursor: pointer;
	    border: 1px solid #3598dc;
	    white-space: nowrap;
	    padding: 8px 18px;
	    font-size: 12px;
	    float: none;
	    width: 100%;
	    margin-top:15px;
	}

    .btn_volver{
        margin-left:12px;
    }

    #contenedor_login div input.dv{
        width: 26px;
    }

    #contenedor_login div.g-recaptcha {
        width: 0% !important;
    }
    .g-recaptcha{
        transform: scale(0.97) !important;
        margin-bottom: 30px !important;
        margin-top: 10px !important;
        margin-left: 0px;
    }
}

@media (max-device-width: 1024px) and (min-device-width: 768px) and (orientation: landscape){
    .g-recaptcha{
        transform: scale(1.01) !important;
    }    

    #contenedor_login div input.dv{
        width: 35px;
    }
}

@media(max-device-width: 1002px) and (min-device-width: 668px){
    #contenedor_login div input.dv{
        width: 13px;
    }
}