html{
width: 100%;
font-family: 'Montserrat';
font-size: 14pt;
overflow-x:hidden;
color:#001689/*azulOscuro*/;
}
body{
position: absolute;
margin: 0px;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-color: white;
}
a:link 
{ 
text-decoration:none; 
} 
#entradaIzq{
    float: left;
    background-color:#FFD54F;
    width: 48%;
    height: 100%;
    display: flex;
   align-items: center;
  justify-content: center;
}
#entradaIzq div{text-align: center;}
#entradaIzq img{
width: 70%;
}
#entradaIzq .r-ies{text-align: center;}
#entradaIzq a{
text-align:left;
cursor: pointer;
}
#entradaDer{
    display: flex;
    align-items: center;
  justify-content: center;
    float: left;
    width: 48%;
    height: 100%;
}
#entradaDer .mensaje{
    margin-top: 15px;
    font-size: 70%;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
#entradaDer .mensaje img{
width: 20px;margin-right: 5px;
}
#entradaDer .mensaje:hover{
opacity: 0.6;

}
 .mensajeError,.mensajeRecupera{
    margin-top: 5px;
    margin-bottom: 15px;
    font-size: 70%;
    color: red;
display: none;
justify-content: center;
flex-direction: column;
color: #001689;
}
.mensajeError{
  opacity: 0;
}
.mensajeError h1,.mensajeRecupera h1{
  font-size: 90%;border-bottom: 2px solid;padding-bottom: 5px;
background-image: url(../img/accion_atencion.svg) !important; 
    background-size: 20px;
background-repeat: no-repeat;
background-position: 95% center;
text-align: left;
padding-left: 20px;
padding-right: 30px;
color: #001689
}
.mensajeRecupera{
  display: flex;
  color: #001689;
}
.mensajeError p,.mensajeRecupera p{
  font-style: italic;
  width: 100%;
}
#autentificacion{
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.form{
  display: flex;
  justify-content: center;
align-items: center;
}
.form .campos{
  display: flex;
  justify-content: center;
flex-direction: column;
text-align: center;
}


#cambiarPDClave{
    text-align: center;
    display: none;
    opacity: 0;
}

.centro{margin-bottom: 10px;
  width: 100%;
display: flex;
text-align: center;
justify-content: center;
flex-direction: column;
}
.provincia{
display: flex;
justify-content: center;
flex-direction: column;
font-size: 0.8em;
}
input[type="button"].entrar,input[type="submit"].entrar{
      -webkit-appearance: none;
     -webkit-border-radius: 0;
    display: block;
  text-decoration: none;
    width: 210px;
    height: 35px;
    text-align: center;
    font-size: 0.8em;
    margin-top: 5px;
    margin-bottom: 3px;
    background-color:#FFD54F;
   border-radius:0px; /*Estandar*/
    -webkit-border-radius:0px; /*Safari y Chrome*/
    -moz-border-radius:0px; /*Firefox*/
    -o-border-radius:0px; /*Opera*/
    -ms-border-radius:0px; /*IE 8*/
    border: none;
    text-transform: uppercase;
    transition: 0.3;
    cursor: pointer;
}
#cambiaClave input[type="submit"].entrar{
  opacity: 0.2;
}
input[type="button"].entrar:hover,input[type="submit"].entrar:hover{
opacity: 0.6;
}
input[type="password"].clave,input[type="text"].clave,input[type="text"].user,input[type="text"].clave-sis{
  text-decoration: none;
    padding-top: 4px;
    height: 30px;
    padding-bottom: 4px;
    width: 200px;
    text-align: left;
    font-size: 80%;
    margin-bottom: 15px;
    padding-left: 10px;
    -webkit-border-radius:0px; /*Safari y Chrome*/
    -moz-border-radius:0px; /*Firefox*/
    -o-border-radius:0px; /*Opera*/
    -ms-border-radius:0px; /*IE 8*/
    border:0px;
    border:1px solid #FFD54F;
    display: block;
    color: #001689;
}
input[type="password"].clave,input[type="text"].clave{
  background-image: url(../img/input-pass.svg) !important; /*aquí deberás escribir la ruta de la imagen que utilizarás como flecha del desplegable*/
    background-size: 20px;
background-repeat: no-repeat;
background-position: 95% center;
}
input[type="text"].clave-sis{
  width: 80px;
  cursor: no-drop;
  background-image: url(../img/input-pass_sis.svg) !important; /*aquí deberás escribir la ruta de la imagen que utilizarás como flecha del desplegable*/
    background-size: 20px;
background-repeat: no-repeat;
background-position: 95% center;
}

input[type="text"].user{
  background-image: url(../img/input-user.svg) !important; /*aquí deberás escribir la ruta de la imagen que utilizarás como flecha del desplegable*/
    background-size: 20px;
background-repeat: no-repeat;
background-position: 95% center;
}
input[type="password"].claveError{
  text-decoration: none;
    padding-top: 4px;
    height: 30px;
    padding-bottom: 4px;
    width: 200px;
    text-align: left !important;
    font-size: 80%;
    margin-bottom: 15px;
    background-color:#FDEDEC;
    -webkit-border-radius:0px; /*Safari y Chrome*/
    -moz-border-radius:0px; /*Firefox*/
    -o-border-radius:0px; /*Opera*/
    -ms-border-radius:0px; /*IE 8*/
    border:0px;
    border:1px solid #001689;
    display: block;
     background-color: #E8413A;
        color: #FFFFFF !important;
         background-image: url(../img/accion_atencion.svg);
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: 95% 50%;
}

input{
  color: #001689;
}
input::placeholder{
color: #D0D3D4;
font-style: italic;
}
.nivel-pass{
  font-size: 60%;
  width: 100%;
  text-align: center;
}
.nivel-pass .nivel-pass-text{
  color: red;
  font-style: italic;
  font-size: 0.9em;
}
.item-pass-segura img{
  width: 15px;
  opacity: 0.2;
}
.item-pass-segura{
  display: flex;
  flex-direction: column;
  font-style: italic;
}
.item-pass-segura div{
  display: flex;
  justify-content: space-between;}



#autentificacion{
    transition: opacity .4s ease, transform .4s ease;
}

#autentificacion.desaparecer{
    opacity: 0;
    transform: translateY(-40px);
}
#cambiaClave,
#cambiaClave_profesor,
#olvidaClave{
    display: none;
    opacity: 0.2;
    transform: translateY(40px);
    transition: opacity .8s ease, transform .8s ease;
}

#cambiaClave.aparecer,
#cambiaClave_profesor.aparecer,
#olvidaClave.aparecer
{
    opacity: 1;
    transform: translateY(0);
}
   input.campoError{
        background-color: #E8413A;
        color: #FFFFFF;
         background-image: url(../img/accion_atencion.svg);
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: 95% 50%;
   }