﻿/************************ ecoSoftWEB Login ****************************/
video {
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: -100;
}

/*** Contendor global ***/
#ecoSoftWEB_login {
    min-height: 100vh;
    z-index: 100;
}

/*** Formulario de login y sus elementos ***/
#formulario_login {
    height: 100px;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 0 0 120px 120px;
    max-width:500px;
}



#formulario_login small {
    color: #808080;
}

.control-desactivado{
    cursor: not-allowed !important;
    pointer-events: all !important;
}


/*** Cabecera del formulario ***/
#formulario_login > #logotipo {
    width: 100%;
    max-width: 380px;
    text-align: center;
    height: 50px;
    background-color: rgba(20, 182, 205, .75);
    border-radius: 10px 10px 0 0;
}

#formulario_login > #logotipo img {
    max-width: 100%;
    padding: 0 20px;
    margin-top: -95px;
}

/*** Campos, alertas y botón ***/
#formulario_login > .formulario_acceso{ 
    background-color: rgba(255,255,255,.25);
    box-shadow: inset 0 0 20px 0 rgba(255,255,255,.12);
    padding: 25px 25px 15px 25px;
    width: 100%;
    max-width: 380px
}

.formulario_acceso .input-group{
    margin: 15px 0;
}

#formulario_login > .formulario_acceso input:focus {
    outline: none;
    border-color: #ccc;
    box-shadow: none;
}

.formulario_acceso .input-group > .form-control:focus{
    box-shadow: 0 0 8px rgba(0, 0, 0, .25);
}

.formulario_acceso .input-group #PASSWORD,
.formulario_nuevo-usuario .input-group #PASSWORD,
.formulario_nuevo-usuario .input-group #CONFIRM_PASSWORD,
.form_bienvenido .input-group #PASSWORD,
.form_bienvenido .input-group #CONFIRM_PASSWORD,
#form_bienvenido .input-group #PASSWORD,
#form_bienvenido .input-group #CONFIRM_PASSWORD{
    border-right: none;
}

.formulario_acceso .input-group #mostrar-password,
.formulario_nuevo-usuario .input-group #mostrar-password,
.formulario_nuevo-usuario .input-group #mostrar-confirm-password,
.form_bienvenido .input-group #mostrar-password,
.form_bienvenido .input-group #mostrar-confirm-password,
#form_bienvenido .input-group #mostrar-password,
#form_bienvenido .input-group #mostrar-confirm-password{
    background-color: #fff;
    cursor: pointer;
}

.formulario_acceso .input-group i{
    width: 15px;
}

.formulario_acceso div > a{
    color: #fff;
}

.formulario_acceso #entrar > button {
    padding: 8px 12px;
    margin-top: 35px;
    transition: .25s;
}

#entrar > button:hover{
    background-color: #1aa7bb;
    border-color: #1aa7bb;
}

#entrar > button > i{
    margin-right: 6px;
}

.formulario_acceso .alert {
    margin-bottom: 0;
    margin-top: 15px;
    padding: 10px 15px;
}


/*** Pie de formulario ***/
#formulario_login > #pie{
    background-color: rgba(26, 40, 41, .75);
    color: #bbb;
    padding: 15px 25px;
    width: 100%;
    max-width: 380px;
    border-radius: 0 0 10px 10px;
    text-align: center;
}


/*** Adaptación a "versiones moviles/tablets" (responsive) ***/
@media screen and (max-width: 768px) {
    #formulario_login{
        align-items: center;
        justify-content: center;
        padding: 0;
    }
}










/************************ ecoSoftWEB Login (Nuevo usuario) ****************************/
#formulario_login > .formulario_nuevo-usuario{ 
    background-color: rgba(255,255,255,.25);
    box-shadow: inset 0 0 20px 0 rgba(255,255,255,.12);
    padding: 15px 25px;
    width: 100%;
    max-width: 380px;
}

.formulario_nuevo-usuario .input-group {
    margin: 10px 0;
}

.formulario_nuevo-usuario > h3,
.formulario_nuevo-usuario h4 {
    color: #555;
    background-color: #fff;
    margin-top: 0;
    padding: 10px 15px;
    border-radius: 4px;
}

.formulario_nuevo-usuario hr {
    margin: 10px 0;
    border-color: #fff;
    opacity: .25;
}

.formulario_nuevo-usuario .col-md-6 {
    padding: 0 15px;
}

.formulario_nuevo-usuario .crear-info {
    background-color: #fff;
    padding: 20px;
    border-radius: 4px;
    color: #808080;
}

.formulario_nuevo-usuario .crear-info > h4 {
    padding: 0;
}

.formulario_nuevo-usuario .crear-info > h3 {
    margin: 0;
}

.formulario_nuevo-usuario .crear-info hr {
    border-color: #ccc;
}

.formulario_nuevo-usuario .crear-info > *:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}

.formulario_nuevo-usuario .crear-info blockquote {
    border-left: 5px solid #14b6cd;
    background-color: #fafdfd;
    margin-bottom: 5px;
}


/************************ ecoSoftWEB Login (Validación usuario) ****************************/
#ecoSoftWEB_login #formulario_login.validacion-usuario {
    align-items: center;
    justify-content: center;
    padding: 0;
    max-width: 800px;
    margin:0 auto;
    padding:0;
}

#ecoSoftWEB_login #formulario_login > .validacion-usuario {
    max-width: 800px;
}

#formulario_login > .formulario_nuevo-usuario.validacion-usuario .row > .col-md-6:first-child {
    padding-right: 7.5px;
}

#formulario_login > .formulario_nuevo-usuario.validacion-usuario .row > .col-md-6:last-child {
    padding-left: 7.5px;
}

#formulario_login span.dato_error,
#bienvenido span.dato_error{
    background-color: #f0ad4e;
    border-color: #eea236;
    color: #fff;
}






/************************************ Aceptación de contrato *************************************/
#form_AceptacionContrato .x_panel {
    border: none;
    border-radius: 4px;
}

#DocumentoContrato {
    max-height: 425px;
    overflow-y: scroll;
}