/*ESTILOS CUERPO*/
#cont_principal{
    margin-bottom:50px; 
    min-height: calc(100vh - 110px);
}

/*ESTILOS LOADER*/
.loader{
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../img/pageLoader.gif') 50% 50% no-repeat rgb(249,249,249);
    opacity: .8;
}
.text_loader{
    position:relative;
    background-color:white;
    width:200px;          
    text-align:center;
    padding:10px;  
    margin-left:auto;
    margin-right:auto;  
    top:59%;
    color:#ba0c2f;
    font-weight: bold;
}

/* ESTILOS PARA MODAL DE CONFIRMACION PARA DESACTIVAR USUARIOS */
#cont_confir_modal{
    width: 100%;
    height: 100%;
    z-index: 99998;
    background-color: black;
    opacity: .7;
    position:fixed;
    display:none;
}
#confir_modal{
    width: 30%;
    position: fixed;
    background-color: white;
    position:fixed;
    z-index: 99999;
    top:40%;
    left:35%;
    border-radius: 10px;
    display:none;
    padding:1em;
}
#confir_modal>center>h1{
    color:#c51034;
    margin-top: .5em;
}
#cerrar_confir{
    float:right;
    color:red;
}
#cerrar_confir:hover{
    cursor: pointer;
}
.btn_interior{
    background: none;
    border:none;
    border-radius: 5px;
    background-color: none;
    color:white;
    margin-bottom: .5em;
}
.confirmar{
    background-color: #ba0c2f;
}
.cancelar{
    background-color: grey;
}
.btn_interior:hover{
    border:1px solid black;
}
.confirmar:hover{
    background-color:#c51034;
}
.cancelar{
    background-color:#b1b1b1;
}

/* LINK PARA PAGINA CON TUTORIAL */
#link_help:hover{
    cursor: pointer;
}

/* ESTILOS PARA EL ACORDEON */
.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}
.accordion:after{
    content:'+';
    float: right;
    color:#919191;
}
#all_info .active, .accordion:hover {
    background-color: #ccc;
}
#all_info .active:after{
    content: '-';       
}    
.panel {
    padding: 0 18px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

/* MODAL CON TODOS LOS DATOS */
#modal{
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9995;
    background-color: black;
    display:none;
    opacity: .6;
}
#all_info{
    max-height: 100%;
    border:1px solid #eeeeee;
    margin-top: 2em;
}
.cont_info{
    margin-top: 2em;
}
.cont_int_modal{
    background-color: white;
    width: 80%;
    position:fixed;
    padding:1em;
    top:50%;
    left:60%;
    margin: -19% 0 0 -50%;
    font-weight: 700;
    font-size: 14px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    line-height: 1.42857143;
    border-radius: 10px;
    padding: 2em;
    display:none;
    z-index: 9996;
    min-height: 35%;
    max-height: 80%;
    overflow: auto;
}
.cont_int_titulo{
    text-align: center;
    font-size: 18px;
}
#div_cont_shapes > div > .col-1{
    padding: 1em;
}
#div_cont_shapes > div > .col{
    padding: 1em;
}
#div_cont_shapes > div > div > i{
    color:#2E4053;
    font-size: 18px;
}    
#div_cont_shapes > div:hover > div > i{
    color:#c51034;
}
#div_cont_shapes{
    overflow-x:scroll;
    max-height: 428px;
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left:2em;
}
#div_cont_shapes>div:hover{
    border:1px solid rgb(214, 214, 214);
    cursor: pointer;
}
#div_cont_shapes >div> .col-11{
    padding: 1em;
    padding-left: 5%;
}
#info_actuaciones_acordeon,#actuaciones_acordeon,#info_personal_acordeon,#agregado_acordeon,#div_cont_shapes{
    margin-top: 1em;
    margin-bottom: 1em;
}
#info_personal,#actuaciones,#info_actuaciones,#agregado{
    width: 100%;
}
.cont_tabla_info_actuaciones,.cont_tabla_agregado{
    overflow-y: scroll;
    overflow-x: scroll;
    max-height: 428px;
}
.cont_tabla_actuaciones{
    overflow-x: scroll;
    overflow-y: scroll;
    max-height: 428px;
}
.cont_tabla_datos_personales{
    overflow-x: scroll;
    margin-top:1em;
    margin-bottom:1em;
}
.info_personal_head,.actuaciones_head,.info_actuaciones_head,.agregado_head{
    width:10%;
    background-color: #c51034;
    color:white;
    border-top: 1px solid #ba0c2f;
    border-left: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    border-right: 1px solid #ba0c2f;
    text-align: center;
    padding:1em;
    
}
.info_personal_body,.actuaciones_body,.info_actuaciones_body,.agregado_body{
    width:10%;
    padding: 5px;
    border: 1px solid #eeeeee;
    background-color: white;
}
.titulo_body{
    font-weight: bold;
    font-size: 17px;
    border: 1px solid #eeeeee;
    padding-left: 1em;
    padding-top: .3em;
    padding-bottom: .3em;
    font-family: "Arial";
    font-weight: bold;
}
.contenido_body{
    font-size: 15px;
    padding-left: 1em;
    padding-top: .3em;
    padding-bottom: .3em;
    border: 1px solid #eeeeee;
    font-family: "Arial";
    font-weight: 100;
}
#no_data_found{
    display:none;
    text-align: center;
}

/*BOTONES DE DESCARGA EXCEL*/
.bg_download_bt{
    font-size: 20px;
    color:black;
    width: 1em;
    height: 1em;            
}        
.bg_download_bt:hover{
    cursor:pointer;
    color:#c51034;
}
.bg_download_bt .active{
    color:#c51034;
}
.cont_int_modal .modal_active{
    display:block;
}
.modal_descargas{
    padding:1em;
    width:344px;
    max-width: 344px;
    background-color: white;
    position: absolute;
    left: 2em;
    top:4em;
    border:2px solid #ccc;
    display: flex;
    flex-direction: column;
    display:none;
    z-index: 9998;
}        
#botones_descarga{
    text-align: left;
}
.modal_descargas .titulo{
    text-align: center;
    border-bottom: 1px solid grey;
}
.modal_descargas .mod{
    margin-top: 1em;
}
.xls_custom,.csv_custom,.xlsx_custom{
    border:none;
    border-radius: 5px;
    width: 4.5em;
    height: 1.5em;
    font-size: 15px;
}
.xls_custom{
    background-color: #8cc400;
    color:white;
}
.csv_custom{
    background-color: grey;
    color:white;
}
.xlsx_custom{
    background-color: #00A218;
    color:white;
}
.xls_custom:hover{
    background-color: #557700;
    color:white;
}
.csv_custom:hover{
    background-color: rgb(97, 97, 97);
    color:white;
}
.xlsx_custom:hover{
    background-color: #008113;
    color:white;
}    

/* ESTILOS PARA LA BARRA DE SCROLL */
.cont_int_modal::-webkit-scrollbar,.cont_tabla_actuaciones::-webkit-scrollbar,.cont_tabla_info_actuaciones::-webkit-scrollbar,.cont_tabla_agregado::-webkit-scrollbar,.cont_tabla_datos_personales::-webkit-scrollbar{
    -webkit-appearance: none;
}
.cont_tabla_actuaciones::-webkit-scrollbar,.cont_tabla_info_actuaciones::-webkit-scrollbar,.cont_tabla_agregado::-webkit-scrollbar,.cont_tabla_datos_personales::-webkit-scrollbar,#div_cont_shapes::-webkit-scrollbar{
    -webkit-appearance: none;
    color: #ccc;
}
#div_cont_shapes::-webkit-scrollbar:vertical,.cont_int_modal::-webkit-scrollbar:vertical,.cont_tabla_actuaciones::-webkit-scrollbar:vertical,.cont_tabla_info_actuaciones::-webkit-scrollbar:vertical,.cont_tabla_agregado::-webkit-scrollbar:vertical,.cont_tabla_datos_personales::-webkit-scrollbar:vertical{
    width:10px;
}
#div_cont_shapes::-webkit-scrollbar:horizontal,.cont_tabla_actuaciones::-webkit-scrollbar:horizontal,.cont_tabla_info_actuaciones::-webkit-scrollbar:horizontal,.cont_tabla_agregado::-webkit-scrollbar:horizontal,.cont_tabla_datos_personales::-webkit-scrollbar:horizontal{
    height:10px;
    border:none;
}
.cont_int_modal::-webkit-scrollbar-thumb,.cont_tabla_actuaciones::-webkit-scrollbar-thumb,.cont_tabla_info_actuaciones::-webkit-scrollbar-thumb,.cont_tabla_agregado::-webkit-scrollbar-thumb{
    background-color: #c51034;
    height: 50px;
}
#div_cont_shapes::-webkit-scrollbar-thumb,.cont_tabla_actuaciones::-webkit-scrollbar-thumb,.cont_tabla_info_actuaciones::-webkit-scrollbar-thumb,.cont_tabla_agregado::-webkit-scrollbar-thumb,.cont_tabla_datos_personales::-webkit-scrollbar-thumb{
    background-color: #ccc;
    height: 50px;
}
.cont_int_modal::-webkit-scrollbar-thumb:hover,.cont_tabla_actuaciones::-webkit-scrollbar-thumb:hover,.cont_tabla_info_actuaciones::-webkit-scrollbar-thumb:hover,.cont_tabla_agregado::-webkit-scrollbar-thumb:hover{
    background-color: #d6183e;
    
}
#div_cont_shapes::-webkit-scrollbar-thumb:hover,.cont_tabla_actuaciones::-webkit-scrollbar-thumb:hover,.cont_tabla_info_actuaciones::-webkit-scrollbar-thumb:hover,.cont_tabla_agregado::-webkit-scrollbar-thumb:hover,.cont_tabla_datos_personales::-webkit-scrollbar-thumb:hover{
    background-color: #ccc;
    padding: 5px;
}
.cont_int_modal::-webkit-scrollbar-track,.cont_tabla_actuaciones::-webkit-scrollbar-track,.cont_tabla_info_actuaciones::-webkit-scrollbar-track,.cont_tabla_agregado::-webkit-scrollbar-track,.cont_tabla_datos_personales::-webkit-scrollbar-track{
    background-color: #eee;
}
.cont_tabla_actuaciones::-webkit-scrollbar-track,.cont_tabla_info_actuaciones::-webkit-scrollbar-track,.cont_tabla_agregado::-webkit-scrollbar-track,.cont_tabla_datos_personales::-webkit-scrollbar-track{
    background-color: white;
}
.cont_tabla_actuaciones::-webkit-scrollbar-button:increment,.cont_tabla_info_actuaciones::-webkit-scrollbar-button:increment,.cont_tabla_agregado::-webkit-scrollbar-button:increment,.cont_tabla_datos_personales::-webkit-scrollbar-button:increment{
    display: none;
    background-color: #eee;
}

/*ESTILOS CABECERO DE LA PAGINA*/
#img_cabecero{
    width: 80%; 
    display: block; 
    margin: auto; 
    margin-bottom:50px;
}
#titulo{
    color:#ba0c2f;
    text-align: center;
    margin-bottom: 1em;
    word-wrap: break-word;
}

/* ESTILOS FILTROS */
#msj_error{
    color:red;
    margin-bottom: 1em;
    text-align: center;
}
#error_nombre{
    visibility: hidden;
}
#error_anualidad{
    visibility: hidden;
}
#error_expediente{
    visibility: hidden;
}
#cont_filtros{
    margin-bottom: 2em;
    font-size:15px;
    padding-left: 1em;

}
#filtro_expediente{
    border-left: solid 1px #ba0c2f;
    border-right: solid 1px #ba0c2f;
}
#cont_filtros input{
    width: 100%;
    border-radius: 5px;
    border: 1px solid grey;
    height: 2em;
    padding: 8px;
}
#cont_filtros input:focus{
    border-color:#66afe9;
    outline: none;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
}
#cont_filtros select{
    width: 100%;
    height: 2em;
    border:1px solid grey;
    border-radius: 5px;
}
#cont_filtros select:focus{
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-color:#66afe9;
    outline: none;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
}
#cont_filtros button{
    background-color: #ba0c2f;
    border:none;
    height: 2em;
    border-radius:5px;       
    color:white; 
}
#cont_filtros button:hover{
    background-color: #d6183e;
}

/* ESTILOS BOTONES */
#volver, #reload{
    background-color: #ba0c2f;
    height: 2em;
    width: 5em;
    color:white;
    border-radius: 5px;
    border:none;
    margin-top:5px;
    cursor:pointer;
    font-weight: 400;
    white-space: nowrap;
    font-family: inherit;
    font-size: 18px;
    line-height: 1.3333333;
    margin-bottom: 1em;
}
#volver:hover ,#reload:hover{
    background-color: #c51034;
}
#desactivar{
    background-color: #e0a6b2;
    height: 2em;
    width: 7em;
    color: white;
    border-radius: 5px;
    border:none;
    margin-top:5px;
    cursor:not-allowed;
    font-weight: 400;
    white-space: nowrap;
    font-family: inherit;
    font-size: 18px;
    line-height: 1.3333333;
    float:right;
}

#ver_modal{
    cursor: pointer;
}
#cerrar_modal{
    cursor: pointer;
    color:#c51034;
    font-size: 20px;
    float:right;
}
#cerrar_descargas{
    cursor: pointer;
    color:#ccc;
    font-size: 14px;
    float:right;
}
#cerrar_descargas:hover{
    cursor: pointer;
    color:#c51034;        
    float:right;
}
#cerrar_modal:hover{
    cursor: pointer;
    color:#e0103a;
}

/*ESTILOS DATATABLES*/
/* ESTILOS PARA LA TABLA */
    #cont_datatables{
        width: 100%;
    }
    #listado{
        width: 100%;
    }
    #cabecero_tabla>tr>th{
    background-color: #ba0c2f !important;
    color:white;
}  

/* CONTENIDO DE LA TABLA */
    #ver_modal:hover{
        color:#c51034;
    }
    input[type='checkbox']{
        display:none;
    }
    .label_checkbox{
        display: inline-flex;
        align-items: center;
        cursor:pointer;
        font-family: arial;
    }
    .label_checkbox > .custom_checkbox{
        display: inline-block;
        width:15px;
        height: 15px;
        color:black;
        margin-left: .5rem;
        font-size: 20px;
    }
    .custom_checkbox::after{            
        content:'\2610';
    }
    .label_checkbox:hover > .custom_checkbox::after{
        color:#c51034;     
    }
    .label_checkbox > .seleccionar:checked + .custom_checkbox::after{
        color: #c51034;
        content:'\2612';
    }
/* LENGTH Y SEARCH */
    .dataTables_length{
        margin-bottom: 2em;
    }
    .dataTables_wrapper .dataTables_filter label input{
        border-radius: 5px !important;
        border: 1px solid grey !important;
        height: 2em !important;
    }
    .dataTables_wrapper .dataTables_filter label input:focus{
        border-color:#66afe9 !important;
        outline: none !important;
        box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%) !important;
    }
    .dataTables_wrapper .dataTables_length label select{
        height: 2em !important;
        border:1px solid grey !important;
        border-radius: 5px !important;
    }
    .dataTables_wrapper .dataTables_length label select:focus{
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        border-color:#66afe9 !important;
        outline: none !important;
        box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%) !important;
    }

/* INFORMACION Y PAGINACION */
    .dataTables_info{
        margin-top: 2em;
    }
    .dataTables_paginate{
        margin-top: 2em;
    }
    .dataTables_wrapper .dataTables_paginate span .paginate_button:hover{
        background: none !important ;
        background-color: #ccc !important;
        border:none !important;
        color:white !important;
    }
    .dataTables_wrapper .dataTables_paginate span .paginate_button.current{
        background: none !important ;
        background-color: #c51034 !important;
        color:white !important;
        border:none !important;
    }
    .dataTables_wrapper .dataTables_paginate span .paginate_button.current:hover{
        background: none !important ;
        background-color: #e71d46 !important;
        color:white !important;
        border:none !important;
    }
    .dataTables_wrapper .dataTables_paginate .next:hover,.dataTables_wrapper .dataTables_paginate .previous:hover{
        background: none !important ;
        background-color: #c51034 !important;
        color:white !important;
        border:none !important;
    }
    .dataTables_wrapper .dataTables_paginate .disabled,.dataTables_wrapper .dataTables_paginate .disabled{
        background: none !important ;
        background-color: white !important;
        color:white !important;
        border:none !important;
    }
    .dataTables_wrapper .dataTables_paginate .disabled:hover,.dataTables_wrapper .dataTables_paginate .disabled:hover{
        background: none !important ;
        background-color: white !important;
        color:white !important;
        border:none !important;
    }
/* ESTILOS CHECK SHAPE */
    #indicar_shape_false{
        color:#ba0c2f;
    }
    #indicar_shape_true{
        color:#17c700;
    }
    #shape_row{
        text-align:center;
    }
/* ESTILOS PARA BOTONES */
    .dt-buttons{
        text-align: center !important;
        left:30%;
    }  

/* ESTILOS PARA BOTON COLVIS */
    /*BTN PRINCIPAL*/
        .dataTables_wrapper .buttons-colvis{
            border:none;
            background-color:#c51034 !important;
            padding-top:5px;
            padding-left:10px;
            padding-right:10px;
            padding-bottom:5px;
            color:white;
            transition:.8s;
            font-size:15px;
        }
        .dataTables_wrapper .buttons-colvis:focus{
            background-color:#ce2849 !important;
            background-image:none !important;
            border:none !important;
            text-shadow: none !important;
        }
        .dataTables_wrapper .buttons-colvis:hover{
            background-color:#ce2849 !important;
            background-image:none !important;
            border:none !important;
            text-shadow: none !important;
        }
    
        /* BOTONES INTERNOS SIN CLASE ACTIVE */
            .dataTables_wrapper .dt-button.buttons-columnVisibility{
                background: none !important;
                background-color: #c51034 !important;
                color:white !important;
                outline: none !important;
                text-align: left;
                padding-left: 1em;
                box-sizing: border-box !important;
                border:none;
                box-shadow: none !important;
            }
            .dataTables_wrapper .dt-button.buttons-columnVisibility:hover{
                background-color: #c51034 !important;
                color:white !important;
            }
            .dataTables_wrapper .dt-button.buttons-columnVisibility:focus{
                background-color: #c51034 !important;
                color:white !important;
                border:none !important;
            }

        /* BOTONES INTERNOS CON CLASE ACTIVE */
            .dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility.active{                    
                background: none !important;
                background-color:none !important;
                box-shadow: none !important;
                border:none !important;
                color:black !important;
                text-align: left !important;
                padding-left: 1em;
                box-sizing: border-box !important;
            }
            .dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility.active:hover{
                background-color: #c51034 !important;
                color:white !important;
            } 
            .dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility.active:active{                    
                background-color: #c51034 !important;
                color:white !important;
            }
            .dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility.active:focus{                
                background:none !important;
                border:none !important;
            }
            .dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility .active{
                background: none !important;
                background-color: #ba0c2f;
                color:white !important;
            }

    /* BOTON RESTORE VISIBILITY */
        .dataTables_wrapper .dt-button-collection .dt-button.buttons-colvisRestore{
            background-color: #ba0c2f !important;
            color:white !important;
        }

/*ESTILOS PIE DE PAGINA*/
#footer{
    background-color: #ba0c2f; 
    text-align:left; 
    padding:15px; 
    height: 60px; 
    width: 100%;
    color:white;
}
footer a{
    color:#e1d0d0;
}
footer a:hover{
    color:#e1d0d0;
}

/* @MEDIA */
@media (max-width: 1090px){
    #cont_filtros{
        display: block;

    }  
    .dataTables_wrapper .dataTables_filter{
        margin-bottom: 2em;
    }
    #filtro_nombre,#filtro_anualidad,#filtro_expediente{
        border:none;
        margin-bottom: .5em;
    }
    .cont_int_modal{
        top:20%;
    }    
    .dt-buttons{
        left:10%;
    }    
    #img_cabecero{
        width: 100%;
    }
}
@media(max-width:510px){
    #footer{
        height: 80px;
    }
    
}
@media (max-width:499px){
    .modal_descargas{
        width:245px;
    } 
    #div_cont_shapes{
        font-size: 12px;
    }
    #div_cont_shapes>div>div>i{
        font-size: 30px;
    }
    #confir_modal{
        width: 90%;
        left: 5%;
    }
}
@media(max-width:1040px){
    .dt-buttons{
        left:10%;
    }
}
@media(max-width:770px){
    .dataTables_wrapper .dt-buttons{            
        margin-left:0 !important;
    }  
}
@media (max-width:650px){
    .dt-buttons{
        left:0;
    }
    .dataTables_length{
        margin-bottom: 1em;
    }
}
@media(max-height:720px){
    .cont_int_modal{
        top:10%;
        margin: 0 0 0 -50%;
    }
    #confir_modal{
        top:20%;

    }
}