body{
    --color1:#10207a;
    --color1_h:#172ca1;    
    --color2:#7a2010;
    --color2_h:#a82b14;
    --plomo:#686868;
}

/*========== GIF CARGANDO PANTALLA COMPLETA =======*/
.hide{display: none;}
.conten_carga{background-color: rgba(250, 250, 250, 0.9);height: 100%;width: 100%;position: fixed;-webkit-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;z-index: 10000;top: 0px;}
.conten_carga #menajecarga{position: absolute;top: 30%;left: 37%;text-align: center;font-weight: 600;font-size: 35px;width: 500px;}
.conten_carga #carga{border: 3px solid #ccc;border-top-color: var(--color1);height: 100px;width: 100px;border-radius: 100%;position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;-webkit-animation: girar 1.5s linear infinite;-o-animation: girar 1.5s linear infinite;animation: girar 1.5s linear infinite;}
@keyframes girar{from{transform: rotate(0deg);}to{transform: rotate(360deg);}}
/*========== FIN GIF CARGANDO PANTALLA COMPLETA =======*/

.description{float:left;
    background: linear-gradient(to bottom, #10207a, #7a2010);
    color:#fff;
    position:absolute;top:50%;left:50%;transform:translateX(-50%) 
    translateY(-50%);width:100%;height:100%;
}

.conten-form-login{
    background:#fff;
    position:absolute;
    top:50%;
    left:50%;
    transform:translateX(-50%) translateY(-50%);
    color:#000;
    padding: 70px 40px 70px 40px;
    width:400px;
    box-shadow:rgba(0, 0, 0, 0.5) 4px 4px 16px;
    border-radius:5px;
}

.conten-form-login .form-login .men-error{font-weight:600;font-size:15px;text-align:center;color:red;}
.conten-form-login .conten-img{display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:30px;margin-top:10px;}
.conten-form-login .conten-img img{width:210px;height:100px;margin-bottom: 10px;}
.conten-form-login .form-login hr{margin-bottom: 8px;}
.conten-form-login .form-login .conten-social{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: auto;
}
.conten-form-login .form-login .conten-social a{
    text-decoration:none;
    color:var(--color2);
    font-size:17px;
    border-radius:50%;
    margin: 10px;
    margin-top: 0px;
    margin-bottom: 8px;
}
.conten-form-login .form-login .conten-social a:hover{color: var(--color1);}
.conten-form-login .form-login .conten-social .copy{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    color: var(--plomo);
    width: 100%;
    text-align: center;
    margin-bottom: 3px;
    font-size: 12px;
}
.conten-form-login .form-login .conten-social .copy #anio{margin-left: 3px;}
.conten-form-login .form-login .conten-social .copy p{margin-bottom: 0px;}
.conten-form-login .form-login .conten-social .dere{
    color: var(--plomo);
    width: 100%;
    text-align: center;
    font-size: 12px;
    margin-bottom: 0px;
}
.conten-form-login .form-login a i{margin-right:5px;}
.conten-form-login .form-login label{
    width:100%;
    margin-bottom:3px;
    font-size:15px;
    font-weight: 500;
    color:var(--plomo);
}
.conten-form-login .form-login label i{color:var(--plomo);margin-right:5px;}
.conten-form-login .form-login .conten-botones{
    display:flex;
    justify-content:center;
    margin:auto;
    width:100%;
}
.conten-form-login .form-login .conten-botones .ingresar .hide{display: none;}
.conten-form-login .form-login .conten-botones .ingresar{
    color:#fff;
    background:var(--color1);
    border:0px;
    cursor:pointer;
    width:100%;
    margin-top:5px;
    margin-bottom:5px;
    margin-left: 0px;
    margin-right: 0px;
    font-size:18px;
    font-weight: 550;
    padding-left:18px;
    padding-right:18px;
    padding-top:10px;
    padding-bottom:10px;
    border-radius:5px;
}

.conten-sedes{display: none;}
.conten-input input{height: 40px;margin-bottom: 15px;}
.conten-sedes select{height: 40px;margin-bottom: 20px;}
.conten-form-login .form-login .conten-botones .ingresar:hover{background:var(--color1_h);}
.conten-form-login .p{color:#000;font-size:20px;text-align:left;}
@media screen and (max-width:800px){.conten-form-login{width:350px;padding:20px;}
.conten-form-login .conten-img img{height:100px;width:190px;margin-bottom:5px;}
.conten-form-login .form-login label{font-size:15px;}
.conten-form-login .form-login .conten-botones .ingresar{font-size:14px;}}
@media screen and (max-width:400px){.conten-form-login{width:85%;}
.conten-form-login .form-login a{padding-left:10px;padding-right:10px;}
.conten-form-login .form-login a i{font-size:16px;}
.conten-form-login .conten-img{margin-bottom:0px;}
.conten-form-login .conten-img img{width:190px;height:90px;margin-bottom:20px;}
.conten-form-login .form-login label{font-size:13px;}
.conten-form-login .form-login input, .conten-form-login .form-login select{font-size:13px;}
.conten-form-login .form-login .conten-botones{margin-top:0px;}
.conten-form-login .form-login .men-error{font-size:13px;}}
@media screen and (max-width:350px){.conten-form-login{width:88%;padding:20px;}
.conten-form-login .form-login a{padding-left:10px;padding-right:10px;font-size:15px;}
.conten-form-login .form-login a i{font-size:15px;}
.conten-form-login .conten-img img{height:80px;width:160px;}}