/* #region MAIN LAYOUTS -> TREE / NORMAL / MAIN */
@media (min-width:0px) and (max-width: 499px) {
    #zcontent {
        padding: 6px !important;
    }
}
#zcontent {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow-y: auto;
    padding: 0px;
}
#scrollClient {
    display: flex;
    overflow: hidden;
    flex-direction: column;
    flex-grow: 1;
    border-radius:7px;
}
    #scrollClient.SimpleLayout {
        margin-bottom: 0.5rem;
        box-shadow: 4px 3px 8px 1px #969696;
        -webkit-box-shadow: 3px 4px 10px 0px #969696;
    }
#TreeArea {
    flex: 1 1 initial;
    width: 22rem;
    display: flex;
    flex-direction: column;
    border-right: 1px solid gray;
    position: relative;
    padding-right: 5px;
}
.TreeMenu {
    padding: 0px 5px;
    height: 1.3rem;
    justify-content:space-between;
}
#Left_Tree_Wrapper {
    flex-grow: 1;
    overflow: hidden;
    padding-right: 3px;
    margin-bottom: 7px;
    padding-left: 4px;
    box-shadow: 4px 3px 8px 1px #969696;
    -webkit-box-shadow: 3px 4px 10px 0px #969696;
    border-radius: 7px;
    display: flex;
    border-left: 1px solid lightgray;
}

#Left_Tree {
    overflow: auto;
    display: flex;
    flex-grow: 1;
    margin: 10px 0px;
    position:relative;
}
/* #endregion */

/*.SelectedNode{
    color:red;
}*/

@media (min-width:0px) and (max-width: 499px) {
    #btnExit, header a {
        color: gray !important;
        font-size: x-large !important;
    }
    .dropdown-menu {
        border: none;
        text-align: -webkit-right;
    }
    #inputBuscador {
        flex: 0 0 60% !important;
    }
}


.tree_node_l_1 {
    margin-left: 1rem;
}
.tree_node_l_2 {
    margin-left: 2rem;
}
.tree_node_l_3 {
    margin-left: 1.4rem;
}
.tree_node_l_4 {
    margin-left: 2rem;
}

.tree_node_l_5 {
    margin-left: 1.4rem;
}




#AllYearsTables {
    flex-direction: column;
}

#detail-bottom {
    margin: 1rem 6px 6px 6px;
    overflow: auto;
    flex-grow: 1;
}

.main_info_detail {
    height: 2.3rem;
    padding-top: 0.1rem;
    height: auto;
    padding-left: 6px;
    flex-wrap: wrap;
    gap: 1rem;
}

#ActionText {
    font-variant-caps: all-petite-caps;
    font-size: large;
    margin-right: 1rem;
}

#subtitle_l {
    padding-bottom: 0.3rem;
    font-size: medium;
    align-items: center;
}

.awr {
    padding: 2px 0px 2px 2px;
    margin-right: 1rem;
}

.tree_node {
    display: flex;
    padding: 0.1rem 0rem;
}





.SimpleLayout .MainAreaInside {
    /* background-color: azure; */
    height: 100%;
    max-width: 100%;
    flex-direction: column;
    border: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.MainAreaInside {
    /* background-color: azure; */
    height: 100%;
    max-width: 100%;
    flex-direction: column;
    /* padding: 0px 10px 10px 10px; */
    border-radius: 7px;
    box-shadow: 4px 3px 8px 1px #969696;
    -webkit-box-shadow: 4px 3px 8px 1px #969696;
}

#Mein_Menu {
    border-bottom: 1px lightgray solid;
    padding: 7px 7px 7px 11px;
    border-radius: 0px 4px 0px 0px !important;
    /* background-color: floralwhite; */
}

#employees_tree {
    /*    margin-left: -1.2rem;*/
}

.active_node_head {
    /*    margin: 0.5rem;*/
    /*    padding: 0.2rem 0rem !important;*/

    box-shadow: 4px 3px 8px 1px #969696;
    -webkit-box-shadow: 4px 3px 8px 1px #969696;
}

.section_subtitle {
    padding-left: 15px;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    flex-grow: 0;
    border-radius: 4px 4px 0px 0px;
}

.z_empbody {
    /*background-color: #9BCFE9;*/
    /*border-left: 3px solid #9BCFE9;*/
}




.active_node_body.z_empbody {
    background-color: #9BCFE9;
    border-radius: 0px 0px 3px 3px;
}









.colapsehead.z_elem .colapser {
    border-left: 3px solid #F4A261;
}

.z_clientes.active_node_head {
    border-bottom: solid 3px #E76F51;
    border-top: solid 1px #E76F51;
    border-left: solid 1px #E76F51;
    border-right: solid 1px #E76F51;
}

.z_ubics.active_node_head {
    border-bottom: solid 3px #2A9D8F;
    border-top: solid 1px #2A9D8F;
    border-left: solid 1px #2A9D8F;
    border-right: solid 1px #2A9D8F;
}

.z_empleados.active_node_head {
    border-bottom: solid 3px #264653;
    border-top: solid 1px #264653;
    border-left: solid 1px #264653;
    border-right: solid 1px #264653;
}

.active_node_head.root.z_permisos {
    border-bottom: solid 3px #D9DD92;
    border-top: solid 1px #D9DD92;
    border-left: solid 1px #D9DD92;
    border-right: solid 1px #D9DD92;
}

.active_node_head.root.z_roles {
    border-bottom: solid 3px #ECE4B7;
    border-top: solid 1px #ECE4B7;
    border-left: solid 1px #ECE4B7;
    border-right: solid 1px #ECE4B7;
}

.active_node_head.z_rol {
    background-color: #FFE19C;
}

.active_node_head.z_claim {
    background-color: #EDFFD9;
}



.z_clientes.active_node_body {
    background-color: #ee9781;
}

.z_empleados.active_node_body {
    background-color: red;
}

#empl_table .z_empleado, #Assign_Gestores_list .z_empleado, #tblEmployees .z_empleado {
    background-color: #b9d4df;
}

#empl_table .z_cliente, #Assign_Gestores_list .z_cliente {
    background-color: #ee9781;
}

#empl_table .newNode td, td.newNode {
    background-color: #264653 !important;
    color: white;
}

.colapseBody {
    min-height: 3px;
}
/*.z_empleado {
    background-color: #E76F51;
}
.z_cliente {
    background-color: #E76F51;
}*/
.toggler {
    cursor: pointer;
}



.colapsehead.z_elem {
    /*border-left: 3px solid #F4A261;*/
}
/*https://www.freeject.net/2019/12/color-palette-png-6-color-combinations.html*/
.active_node_head.z_ubic {
    background-color: red;
}

.active_node_head.z_elem {
    background-color: #F4A261;
}

.active_node_head.z_informe {
    background-color: #E9C46A;
}

.active_node_head.z_cliente {
    background-color: #E76F51;
}

.active_node_head.z_empleado {
    background-color: #264653;
    color: white !important;
}

.z_cntnt {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden;
    flex-grow: 1;
}

.colapser, .action_2, .z_cntnt {
    cursor: pointer;
}

.focus_node {
    padding: 5px;
}

.z_emp {
    /*  margin-top:0.5rem;*/
    padding-left: 0px;
    height: 2rem;
}

.z_empbody {
    padding: 0.5rem 0rem;
}

#clients_tree .z_wrapper {
    padding-left: 1.2rem;
}



.z_elem {
    padding-left: 3.6rem;
}

.z_year_wrap, .z_no_info_wrap {
    padding-left: 4.8rem;
}

.z_informe {
    padding-left: 6rem;
}

.z_gest, .z_empleado, .z_cliente {
    padding-left: 2.4rem !important;
}

#employees_tree .z_empleado, #employees_tree .z_rol, #employees_tree .z_claim {
    padding-left: 1.2rem !important;
}

.z_permiso {
    padding-left: 3.6rem;
}

.z_claims {
    padding-left: 2.4rem;
}

#Permisos_Tree .z_claims {
    padding-left: 1.2rem;
}

#Permisos_Tree .z_claim {
    padding-left: 2.4rem !important;
}

.z_emp, .z_ubic, .z_elem, .z_year_wrap, .z_informe, .z_gest, .z_no_info_wrap {
    align-items: center;
    height: 1.7rem;
}
/*ICONS*/

.add_emp_to_mal {
    background-image: url('../images/office-to-maleta.png');
    width: 2rem;
    margin-left: 2rem;
}

.pack {
    background-image: url('../images/icons8-pack-luggage-50.png');
}

.unpack {
    background-image: url('../images/icons8-unpack-luggage-50.png');
}

.a_users {
    background-image: url('../images/icons8-user-account-50.png');
}

.a_gestores {
    background-image: url('../images/icons8-employees.png');
}

.a_cancel {
    background-image: url('../images/icons8-cancel-50.png');
}

.a_add_emp {
    background-image: url('../images/office-to-maleta-plus.png');
    height: 1.5rem;
    width: 3rem;
}

.a_ens_manage {
    background-image: url('../images/icons8-pivot-table-50.png');
}

.a_add_ens {
    background-image: url('../images/add_ens_to_elem.png');
}

.a_add_par {
    background-image: url('../images/add_par_to_elem.png');
}

.a_add_mues {
    background-image: url('../images/add_muestra.png');
}

.a_elem {
    background-image: url('../images/instalacion.png');
    margin-right: 10px;
}

.a_generate_qr {
    background-image: url('../images/icons8-barcode-50.png');
}

/* Icons for tree*/
.z_i_maleta .z_head, .i_maleta, .z_icon.maleta {
    background-image: url('../images/icons8-suitcase-50.png');
}

.z_maleta .z_head {
    background-image: url('../images/icons8-checked-baggage-50.png');
}

.z_maleta_group .z_head {
    background-image: url('../images/icons8-calendar-50.png');
}

.z_ens_group .z_head, .i_ensayos {
    background-image: url('../images/icons8-lab-items-50.png');
}

.z_par_group .z_head, .i_parametros {
    background-image: url('../images/icons8-report-file-50.png');
}

.z_mues_group .z_head {
    background-image: url('../images/grupo_muestras.png');
}

.z_muestra .z_head, .showhide .sh_mues, .i_muestra, .z_icon.muestra, .z_icon.i_muestra {
    background-image: url('../images/icons8-plastic-bottle-50.png');
}

.z_ensayo .z_head, .showhide .sh_ens, .i_ensayo, .z_icon.ensayo {
    background-image: url('../images/icons8-test-tube-50.png');
}

.z_parametro .z_head, .showhide .sh_par, .i_parametro, .z_icon.parametro {
    background-image: url('../images/icons8-dashboard-50.png');
}



#R_ZOtrosZ .fa-registered {
    margin-left: -2rem !important;
}

.ActionLabel {
    font-style: italic;
    font-weight: 300;
}

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

.alert {
    padding: 20px;
/*    background-color: #f44336;
    color: white;*/
}

.warning {
    padding: 20px;
    background-color: #ffe985;
    color: dimgray;
}

.infoMessage {
    padding: 20px;
    background-color: mediumseagreen;
    color: white;
}

.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

    .closebtn:hover {
        color: black;
    }

body.waiting * {
    cursor: progress !important;
}

.myListItem {
    white-space: nowrap;
}

.nested {
    display: none;
}

.active {
    display: block;
}
/* width */
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-left: 1px lightgray solid;
    border-top: 1px lightgray solid;
    border-radius:2px;
}
/* Handle */
::-webkit-scrollbar-thumb {
    background: #979191;
    border-radius: 2px;
}
    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

.clickForward {
    cursor: pointer;
}

.ql-container {
    height: 10px !important;
    border-radius: 0px 0px 7px 7px;
    border-bottom-style: dashed !important;
    border-left-style: dashed !important;
    border-right-style: dashed !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-right-width: 1px !important;
    border-color: gray !important;
}

.newCommentContainer {
    border-bottom-width: 2px !important;
    border-left-width: 2px !important;
    border-right-width: 2px !important;
    border-color: orange !important;
}

.fileUploadedContainer {
    border-bottom-width: 2px !important;
    border-left-width: 2px !important;
    border-right-width: 2px !important;
    border-color: green !important;
}

.ql-toolbar {
    border-radius: 7px 7px 0px 0px;
    border-top-style: dashed !important;
    border-left-style: dashed !important;
    border-right-style: dashed !important;
    border-top-width: 1px !important;
    border-left-width: 1px !important;
    border-right-width: 1px !important;
    border-color: gray !important;
}

.newCommentToolbar {
    border-top-width: 2px !important;
    border-left-width: 2px !important;
    border-right-width: 2px !important;
    border-color: orange !important;
}

.newFileInContext {
    border-color: orange !important;
    border-width: 2px !important;
    display: inherit !important;
}

.fileUploaded {
    border-color: green !important;
    border-width: 2px !important;
}

.fileUploadedToolbar {
    border-top-width: 2px !important;
    border-left-width: 2px !important;
    border-right-width: 2px !important;
    border-color: green !important;
}
/*Reviewed*/

/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.clicable:hover, .InfoLvl:hover {
    font-weight: 700;
}

.fa-sitemap:hover,
.fa-file-alt:hover,
.fa-upload:hover,
.fa-eye:hover,
.fa-history:hover,
.fa-share-square:hover,
.fa-download:hover,
.fa-pen:hover,
.fa-trash-alt:hover {
    /* font-size: larger !important;*/
    /*color: darkgray;*/
    color: #0247498f;
    background-color: #d6e5e599;
}

.fas, .far {
    min-width: 22px !important;
    line-height: 1;
    /*    background-color: #5f9ea08f;*/
    padding: 4px;
    /*    color: white;*/
    /*color: black;*/
    text-align-last: center;
    margin-left: 5px;
    cursor: pointer;
}

#myUL .fas, #myUL .far, #MainArea .fas, #MainArea .far, #ensayo_tree .fas, #ensayo_tree .far, #maleta_tree .fas, #maleta_tree .far {
    line-height: 1;
    background-color: transparent !important;
    min-width: 17px;
    color: #5f666e;
    text-align-last: center;
    margin-left: 0px;
}

    #myUL .fas:hover, #myUL .far:hover, #MainArea .fas:hover, #MainArea .far:hover, #ensayo_tree .fas:hover, #ensayo_tree .far:hover, #maleta_tree .fas:hover, #maleta_tree .far:hover {
        color: #da6873;
    }

#btnExit, header a {
    color: gray !important;
}

    header .active a, header a:hover {
        color: black !important;
        font-weight: 600;
    }

.ZHeader {
    display: flex;
    justify-content: space-between;
    align-items: baseline
}

#btnExit:hover {
    color: darkred !important;
    font-weight: 600;
}

@media (min-width: 993px) and (max-width:3000px) {
    #btnExit, header a {
        font-size: medium !important;
    }
}

@media (min-width:500px) and (max-width: 992px) {
    #btnExit, header a {
        color: gray !important;
        font-size: inherit !important;
    }
}



span .fas, span .far {
    color: white !important;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */

html,
body {
    height: 100vh;
    margin: 0px
}

body {
    margin-bottom: 60px;
    font-size: 0.8125rem;
    display: flex;
    flex-direction: column;
}

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

.footer {
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 30px;
    flex: 0 0 auto;
    background-color: white;
    position: static !important;
}

.lupa {
    background-image: url('/images/searchicon.png');
}

/* Table Styles*/
.myInput {
    /* Add a search icon to input */
    background-position: 0.2rem 0.3rem; /* Position the search icon */
    background-repeat: no-repeat; /*Do not repeat the icon image */
    /*width: 100%;*/ /* Full-width */
    /*font-size: 16px;*/ /* Increase font-size */
    /*padding: 12px 20px 12px 40px;*/ /* Add some padding */
    /*border: 1px solid #ddd;*/ /* Add a grey border */
    /*margin-bottom: 12px;*/ /* Add some space below the input */
}

/* Style the form - display items horizontally */
.form-inline {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
}

    /* Add some margins for each label */
    .form-inline label {
        margin: 5px 10px 5px 0;
    }

    /* Style the input fields */
    .form-inline input {
        vertical-align: middle;
        margin: 5px 10px 5px 0;
        padding: 10px;
        background-color: #fff;
        border: 1px solid #ddd;
    }
.VisualMark {
   border-left: 10px solid #28a745!important;
   margin-left:-10px;
}
.mod_icon {
    font-size: 1.7em;
    display: none !important;
    vertical-align: middle !important;
}

.i_green {
    color: green;
}

.i_red {
    color: red;
}

.table_filter td, th {
  /*  padding: 0.2rem !important;*/
}
#report_first_th th {
    text-align: center;
    padding: 0.3rem !important;
    border-top:none;
}
.report.ico {
    height: 1.9rem;
    width: 1.9rem;
    background-size: 1.9rem!important;
}
#Reports #MainArea {
    margin-left:0.5rem;

    flex-grow:1;
/*    display: none;*/
    padding: 0.3rem !important;
    background-color: white;
/*    box-shadow: 4px 3px 8px 1px #969696;
    -webkit-box-shadow: 4px 4px 9px 2px #969696;
    border-radius: 7px;*/
}
#Reports {
    flex-grow: 1;
    padding: 0.5rem;
    overflow:hidden;
    /*    flex-shrink: 0;
    max-width: 100%;
    border-radius: 7px;
    box-shadow: 4px 3px 8px 1px #969696;
    -webkit-box-shadow: 4px 3px 8px 1px #969696;
    padding: 0px 7px 7px 7px;
    align-items: stretch;
    flex-grow: 1;*/
}
.table_filter {
    margin-bottom: 0px !important;
}

.filterbox {
    border: 1px solid lightgray;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-bottom: 0.2rem;
    padding-top: 0;
    display: none;
}

.table-fixed {
    width: 100%;
}

    .table-fixed tbody {
        max-height: 80px;
        overflow-y: auto;
        width: 100%;
    }

    .table-fixed thead, .table-fixed tbody, .table-fixed tr, .table-fixed td, .table-fixed th {
        display: block;
    }

        .table-fixed tbody td,
        .table-fixed thead tr th {
            float: left;
        }

.droptarget {
    min-height: 50px;
    border: 1px dashed grey;
    border-radius: 7px;
}

.showstatus {
    border: 1px dashed grey;
    border-radius: 7px;
}

input[type="file"] {
    display: none;
}

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
}

@media (min-width: 1200px) {
    #metadata .col-lg-1 {
        flex: 0 0 12.5% !important;
        padding-left: 4px;
        max-width: 12.5% !important;
    }

    #metadata .col-lg-2 {
        flex: 0 0 18.75% !important;
        padding-left: 4px;
        max-width: 18.75% !important;
    }

    #metadata .col-lg-3 {
        flex: 0 0 50% !important;
        padding-left: 4px;
        max-width: 50% !important;
    }

    #metadata .col-lg-4 {
        flex: 0 0 100% !important;
        padding-left: 4px;
        max-width: 100% !important;
    }

    #fullInfoArea > .col-lg-1 {
        flex: 0 0 5.454545% !important;
        padding-left: 4px;
        max-width: 5.454545% !important;
    }

    #fullInfoArea > .col-lg-2 {
        flex: 0 0 9.090909% !important;
        padding-left: 4px;
        max-width: 9.090909% !important;
    }

    #fullInfoArea > .col-lg-3 {
        flex: 0 0 12.727273% !important;
        padding-left: 4px;
        max-width: 12.727273% !important;
    }

    #fullInfoArea > .col-lg-4 {
        flex: 0 0 18.181818% !important;
        padding-left: 4px;
        max-width: 18.181818% !important;
    }

    #fullInfoArea > .col-lg-5 {
        flex: 0 0 38.181818% !important;
        padding-left: 4px;
        max-width: 38.181818% !important;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    #fullInfoArea > .col-md-1 {
        flex: 0 0 6.818182% !important;
        padding-left: 4px;
        max-width: 6.818182% !important;
    }

    #fullInfoArea > .col-md-2 {
        flex: 0 0 11.363636% !important;
        padding-left: 4px;
        max-width: 11.363636% !important;
    }

    #fullInfoArea > .col-md-3 {
        flex: 0 0 15.909091% !important;
        padding-left: 4px;
        max-width: 15.909091% !important;
    }

    #fullInfoArea > .col-md-4 {
        flex: 0 0 20.454545% !important;
        padding-left: 4px;
        max-width: 20.454545% !important;
    }

    #fullInfoArea > .col-md-5 {
        flex: 0 0 34.090909% !important;
        padding-left: 4px;
        max-width: 34.090909% !important;
    }

    #fullInfoArea > .col-md-6 {
        flex: 0 0 65.909091% !important;
        padding-left: 4px;
        max-width: 65.909091% !important;
    }
}

@media (min-width: 768px) and (max-width:1200px) {
    #metadata .col-md-1 {
        flex: 0 0 25% !important;
        padding-left: 4px;
        max-width: 25% !important;
    }

    #metadata .col-md-2 {
        flex: 0 0 37.5% !important;
        padding-left: 4px;
        max-width: 37.5% !important;
    }

    #metadata .col-md-3 {
        flex: 0 0 100% !important;
        padding-left: 4px;
        max-width: 100% !important;
    }
}

@media (max-width: 992px) {
    #fullInfoArea > .col-sm-1 {
        flex: 0 0 11.538462% !important;
        padding-left: 4px;
        max-width: 11.538462% !important;
    }

    #fullInfoArea > .col-sm-2 {
        flex: 0 0 15.384615% !important;
        padding-left: 4px;
        max-width: 15.384615% !important;
    }

    #fullInfoArea > .col-sm-3 {
        flex: 0 0 26.923077% !important;
        padding-left: 4px;
        max-width: 26.923077% !important;
    }

    #fullInfoArea > .col-sm-4 {
        flex: 0 0 34.615385% !important;
        padding-left: 4px;
        max-width: 34.615385% !important;
    }

    #fullInfoArea > .col-sm-5 {
        flex: 0 0 38.461538% !important;
        padding-left: 4px;
        max-width: 38.461538% !important;
    }

    #fullInfoArea > .col-sm-6 {
        flex: 0 0 57.692308% !important;
        padding-left: 4px;
        max-width: 57.692308% !important;
    }

    #fullInfoArea > .col-sm-7 {
        flex: 0 0 84.615385% !important;
        padding-left: 4px;
        max-width: 84.615385% !important;
    }
}

@media (min-width: 0px) and (max-width: 2600px) {
    #tblInstalaciones .col-lg-1 {
        flex: 0 0 2% !important;
        max-width: 2% !important;
    }

    #tblInstalaciones .col-lg-2 {
        flex: 0 0 7% !important;
        max-width: 7% !important;
    }

    #tblInstalaciones .col-lg-3 {
        flex: 0 0 15% !important;
        max-width: 15% !important;
    }

    #tblInstalaciones .col-lg-4 {
        flex: 0 0 20% !important;
        max-width: 20% !important;
    }
}

#fullInfoArea {
    margin-left: 0 !important;
    margin-right: 0 !important;
    background-color: cornsilk;
    padding: 5px 13px 10px 0px;
    padding-bottom: 10px;
    border-radius: 10px;
}

.selectUbic {
    cursor: pointer;
}

.clickcolapser {
    cursor: pointer;
}

@media (max-width: 800px) {
    .indexensmall {
        display: none !important;
    }
}

.informeExiste {
    border: 3px solid green;
}

.informeNuevo {
    border: 3px solid rgb(252, 155, 106);
}

.sinInforme {
    border: 2px dashed gray;
}

.queInforme {
    text-align: center;
    margin-left: 4px;
    margin-bottom: 0px
}

.focusInforme {
    font-weight: 600;
    color: forestgreen;
    border: 2px solid green !important;
}

.focusElement {
    font-weight: 600;
    border: 2px solid #ff8100 !important;
}

.EleLvl, .UbicLvl, .EmpLvl, .InfoLvl {
    cursor: pointer;
}

.moreInfo .InfoLvl {
    background-color: #adb5bd4a;
}
/*.text-dark{
font-size: larger!important;
}*/





header {
    flex: 0 0 auto !important;
}

.EmpLvl {
    background-color: linen;
    padding: 4px 0px;
    border-bottom: 1px solid lightgray;
}

.UbicLvl {
    background-color: aliceblue;
    padding-left: 10px;
}

.EleLvl {
    padding-left: 20px;
    border-bottom: 1px dashed gray;
}

.InfoLvl {
    border-bottom: 1px dotted darkgrey;
    margin-left: 35px;
    background-color: gainsboro;
    padding: 2px 0px 2px 4px;
}

.nomargin {
    margin-right: 0 !important;
}

.RolGroup {
    padding: 25px 30px 0px 30px !important;
}

.ClaimsList {
    background-color: beige;
    margin-top: 8px;
    padding: .5rem .5rem .5rem 2.5rem;
    margin-right: 10px !important;
    margin-left: 0 !important;
}

.highlight {
    background-color: lightcoral;
}

@media (max-width: 800px) {
    .salironsmall {
        align-self: flex-end !important;
    }

    .nombreonsmall {
        flex: 0 0 80% !important;
    }

    .logononsmall {
        flex: 0 0 80% !important;
    }

    .hideonsmall {
        display: none;
    }

    .srinkonsmall {
        width: 10%
    }
}

.dropdown-menu .nav-link {
    padding: 0px;
}

.navbar-light .navbar-nav .nav-link {
    color: rgba(0,0,0,.5);
}

.notVisible {
    visibility: hidden !important;
}

.claimItem {
    margin-left: -1.8rem !important;
}

#metadata .row {
    margin: 0;
}

.zlabel {
    text-align: right;
    padding-right: 5px;
}

.zdiv {
    padding-left: 0px;
    padding-right: 0px;
}

.zdiv, .zlabel {
    padding-top: 10px;
}

.text-toogle[aria-expanded=false] .text-expanded {
    display: none;
}

.text-toogle[aria-expanded=true] .text-collapsed {
    display: none;
}

.yearToggle {
    display: none !important;
}

#elector {
    position: relative;
}

#milista {
    position: absolute;
    border: 1px solid rgba(0,0,0,.125);
}

    #milista div {
        text-align-last: left;
    }

    #milista .list-group-item {
        padding: .25rem 1.25rem;
        border: none;
    }

.table .interactions td {
    padding: 1px !important;
    border-top: none !important;
}

#myGoodCover {
    position: absolute;
    left: 5px;
    width: 99.2%;
    height: 99%;
    background-color: azure;
    display: flex;
    flex-direction: column
}

.inspeccion {
    min-width: 95px;
}

    .inspeccion:hover {
        background-color: aliceblue;
        box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
    }

.maletaHidden {
    height: 0px;
    overflow: hidden;
    /*    margin:0px 8px!important;
    padding:0px 4px!important;*/
}

.maletaVisible {
    height: auto;
    overflow: auto;
    /*    margin:8px;
    padding:4px;*/
}

#DisplayList {
    cursor: pointer;
}

#manage-employees td, #manage-employees th, #gestor_assign td, #gestor_assign th {
    min-width: 8rem;
    text-align: center;
}

    #manage-employees td:first-child, #manage-employees th:first-child, #gestor_assign td:first-child, #gestor_assign th:first-child {
        min-width: 10rem;
        text-align: inherit;
        padding-left: 5px;
    }
/*   CLEAN */
.z_emp, .z_ubic, .z_instalacion, .z_client, .z_empleado {
    /* Por el momento estas clases no tienen ningún estilo aplicado, se utilizan para identificar los DIV que contienen los nodos del arbol instalaciones.*/
    /* Todos los nodos tienen:
        - colapser: (puede ser; flecha derecha, flecha hacia abajo, punto) (La clase colapser se utiliza para expandir o colapsar el contenido de la lista que hay después del nodo)
        - z_head: Indica que es un nodo y se utiliza para colocar el icono del mismo. En los estilos se cargará del modo .z_emp .z_head ->
        - action: se utiliza para que el javascript asocie un método al icono. el Método se informa en data-method y los parámetros en data-x
        - id: Contiene la información de negocio a mostrar. En el ID se pone la clave principal del Objeto precedidad de el nombre tipo + _ por ejemplo emp_4
        - z_act: conjunto de <div> que contiene la lista de acciones que se pueden realizar sobre el instalacion. Se alinea a la derecha del DIV anterior
    */
}

.tree_l_1, .tree_l_2, .tree_l_3, .tree_l_4 {
    /* Clases utilizadas para formatear de distinto modo los distintos niveles del arbol*/
    display: flex;
}

.t_node {
    padding: 5px 5px 5px 0px;
}

.tree_l_1 {
    padding-left: 0rem;
}

.tree_l_2 {
    padding-left: 1rem;
}

.tree_l_3 {
    padding-left: 2rem;
}

.tree_elem {
    margin-left: 3rem !important;
}

.tree_l_4 {
    /* margin-left: 3rem;*/
}





.z_ubics_area, z_clients_area, z_empleados_area {
    /* Clases utilizadas para agrupar instalaciones debajo de un nodo. En el arbol principal agrupamos Ubicaciones, CLientes y Empleados*/
}

.z_node {
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-x: hidden;
    flex-grow: 1;
}

    .z_node:hover {
        font-weight: 700;
    }

.action {
    /* Los Headers con la clase Action son clicables, en consecuencia mostramos el cursor.
        Definimos el tamaño de los iconos de Acción
    */
    cursor: pointer;
}

.tree_l_1 .z_head, .tree_l_2 .z_head, .tree_l_3 .z_head, .tree_l_4 .z_head {
    width: 1.3rem;
    height: 1.2rem;
}

/* ICONS */

/* NODES */

/*.z_ubic_group .z_head {
    background-image: url('../images/ubicaciones33.png');
}

.z_ubic_group .z_head:hover {
    background-image: url('../images/ubicaciones3_alt.png');
}

.z_client_group .z_head {
    background-image: url('../images/clientes.png');
}

.z_client_group .z_head:hover {
    background-image: url('../images/clientes_alt.png');
}

.z_informe .z_head {
    background-image: url('../images/informe.png');
}

.z_informe .z_hea:hover {
    background-image: url('../images/informe_alt.png');
}

.z_empleados_group .z_head {
    background-image: url('../images/empleados.png');
}

.z_empleados_group .z_head:hover {
    background-image: url('../images/empleados_alt.png');
}

.z_empleado .z_head {
    background-image: url('../images/empleadp.png');
}

.z_empleado .z_head:hover {
    background-image: url('../images/empleado_alt.png');
}

.z_cliente .z_head {
    background-image: url('../images/cliente.png');
}

.z_cliente .z_head:hover {
    background-image: url('../images/cliente_alt.png');
}*/

/* ACTIONS*/

#UserAssignments ul {
    list-style: none;
    margin: 5px 20px;
}

#UserAssignments li {
    margin: 10px 0;
}

#manage-employees ul {
    list-style: none;
    margin: 5px 20px;
}

.assign_ubic {
   /* min-width: 10rem;*/
}

    .assign_ubic li {
        margin: 10px 0;
        float: left;
    }

ul.assign_ubic {
    float: right;
}

.h_code {
    font-size: 1.2rem;
    font-weight: bold;
/*    min-width: 4rem;*/
}

.h_name {
    font-size: 1.2rem;
    font-weight: bold;
/*    min-width: 12rem;*/
}

.h_label {
    /*    margin-left: 1rem;*/
    font-size: 1rem;
    font-weight: 400;
}

.h_data {
    margin-left: 0.3rem;
    font-size: 1rem;
    font-weight: 300;
/*    min-width: 5rem;*/
}
.h_data:empty:before {
    content: '---';
}
#Reports .section_subtitle{
   /* display:none!important;*/
}
.Highlight {
    background-color: #FFFF00;
}

.z_m_col1 {
    width: 40rem;
    text-align: center;
}

.z_m_col2, .z_m_coln {
    width: 30rem;
    text-align: center;
}

.assign_ubic {
    background-color: ivory;
}

#Assign_Empresa_list {
    padding: 0px;
}

    #Assign_Empresa_list label {
        font-size: x-large;
        margin-left: 1rem;
    }

.emp_assign_label {
    border-bottom: 1px dashed gray;
}

.Assign_Empresa {
    background-color: ivory;
    margin: 1rem,1rem;
    padding-left: 1rem;
}

.Assign_Ubicacion_List {
    margin-left: 30rem !important;
    border: 1px gray solid;
}

#manage-employees .z_m_col1 {
    width: 20rem;
    text-align: center;
    padding-left: 1rem;
}

#manage-employees .z_m_col2, #manage-employees .z_m_coln {
    width: 20rem;
    text-align: center;
}

#tblInformes td, #tblInformes th, #tblFilterInstalaciones td, #tblFilterInstalaciones th, #filterUbicaciones td, #filterUbicaciones th {
    border: none !important
}

.heading_assigner {
    border-bottom: 1px gray double;
    margin: 10px 10px;
    padding: 0px 10px;
    align-self: end;
    text-align: center;
}

.rows_assigner {
    margin: 10px 10px;
}

.deleted-node {
    background-color: gainsboro !important;
    color: ghostwhite;
    text-decoration: line-through;
    box-shadow: 4px 3px 8px 1px #969696;
    -webkit-box-shadow: 4px 4px 9px 2px #969696;
    margin-bottom: 0.5rem;
    border-radius: 4px 4px 4px 4px;
    overflow: hidden;
}
/* TO CLEAN */
.badge-pill{
    min-width:3.05rem;
}
.z_mues_group, .z_par_group, .z_ens_group {
    margin-left: 3rem;
}

.z_mues_list .colapser, .z_par_list .colapser, .z_ens_list .colapser {
    background-image: none !important;
}

.z_client {
    overflow: hidden;
}

.z_maleta_group .colapser, .z_emp_group .colapser {
    margin-left: 1rem;
}

.z_maleta_list .z_maleta .colapser, .z_emp_list .z_emp .colapser {
    margin-left: 2rem !important;
}

.z_emp_list .z_ubic .colapser {
    margin-left: 3rem !important;
}

.far.fa-dot-circle {
    font-size: x-small;
}

#maleta_tree .z_emp_list {
    margin-left: 1rem;
}

.detail-bottom-left {
    flex: 0 1 auto;
    border-right: 1px solid lightgray;
}

.selected {
    background-color: brown;
}

.icono {
    background-size: contain;
    background-repeat: no-repeat;
    height: 2rem;
    width: 1rem;
    padding-left: 1rem;
    align-self: center;
}

.icono_big {
    height: 3rem !important;
    min-width: 3rem !important;
}

.icono_medium {
    height: 3rem !important;
    min-width: 2rem !important;
}

.icono_small {
    height: 2rem !important;
    width: fit-content;
    align-self: flex-start !important;
}

.first_col {
    min-width: 145px;
}

.check_cell {
    text-align: center;
    vertical-align: baseline;
    min-width: 70px;
}

#gestor_assign tr {
    height: 1.6rem;
}

#gestor_assign .first_col {
    min-width: 60px !important;
    flex-direction: column;
    text-align: center;
}

.check_cell input {
    margin-left: 2px !important;
}

.my_check {
    margin-left: 2px;
    margin-right: 2px;
}

td:not(.foo) {
/*    border: 1px dashed lightgray;*/
    white-space: nowrap;
    position: relative;
/*    padding: 0px;*/
}
/*td {
    border: 1px dashed lightgray;
    white-space: nowrap;
    position: relative;
    padding: 0px;
}*/

td:not(.foo) {
 /*   border: 1px dotted #d4d4c2;*/
}
/*th {
    border: 1px dotted #d4d4c2;
}*/

hr {
    margin-top: 0px;
    margin-bottom: 0px;
}

.z_icon.empresa, .z_icon.ubicacion, .z_icon.instalacion, .z_icon.muestra, .z_icon.i_muestra, .zicon.ensayo, .z_icon.parametro {
    background-size: contain;
    background-repeat: no-repeat;
    height: 2rem;
    min-width: 1.3rem;
    align-self: center;
    padding-left: 1.2rem;
}

#MaletaStructre .form-check-input {
    position: absolute;
    right: 3px;
    top: 3px;
    margin: 0px;
}

#MaletaStructre {
    /* white-space:nowrap;*/
}

.block {
    border: 1px lightgray dashed;
    margin: 4px 4px 0px 4px;
    padding: 0px 0px 4px 4px;
    border-radius: 5px;
    flex-grow: 1;
}

.empresa_detail, .ubicacion_detail, .instalacion_detail, .muestra_detail {
    padding-top: 1.2rem;
    position: relative;
}

.muestra_detail {
    padding-top: 0rem !important;
    padding-right: 20px;
    max-width: 200px;
    padding-left: 1px !important;
}

.ubicacion_detail, .instalacion_detail, .empresa_detail {
    width: 200px;
}

.z_desc {
    white-space: pre-wrap;
}

.tree-line {
    align-items: flex-end;
}

.z_label {
    flex-grow: 1;
}

.instalaciones_zone {
    background-color: #7fffd45c;
    border-radius: 10px;
    padding: 0.2rem 0.3rem 0.6rem;
}

.info_zone {
    background-color: #deb8877d;
    border-radius: 5px;
    padding: 0.2rem 0.5rem;
}

.mesa_pill {
    padding-left: 2.3rem;
    padding-top: 0.2rem;
    padding-bottom: 1.2rem;
    padding-right: 0.2rem;
    margin: 0.2rem;
}

.elem_metrics {
    background-color: azure;
    border-radius: 7px;
    margin: 0.3rem 0.3rem 0.7rem;
}

.info_ensayo_zone {
    border-radius: 4px;
    background-color: aliceblue;
    padding: 0px 0px 0px 0px;
    margin: 6px 4px 1px;
}

.info_label {
    padding: 2px 3px;
}

    .info_label:last-child {
        padding: 2px 3px 5px;
    }

.hideIt {
    display: none !important;
}

.elem_column {
    border: dashed 2px #bb973b61;
    border-radius: 5px;
    margin: 2px;
    padding-bottom: 5px;
}

.colapsed .metrics_wrap {
    min-height: 0px !important;
}

.desk_item div, .desk_item {
    pointer-events: none;
}

.desk_icon {
    pointer-events: all !important;
}

.NewObject {
    visibility: hidden !important;
}

.tableFixHead thead th {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: azure;
}

.tableFixHead table {
    max-height: 100%;
}

.tableFixHead thead {
    z-index: 100;
}

.tableFixHead {
    padding: 0px 10px;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    color: #ffffff;
    text-decoration: none;
    background-color: #428bca;
    outline: 0;
}
.pdfobject {
    border-radius: 7px;
}
.exper {
    overflow-x: hidden;
    width: 100%;
}

td, th {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#tblInformes td:nth-child(3), #tblInformes th:nth-child(3) {
    width: 5rem !important;
}

#tblInformes td:nth-child(4), #tblInformes th:nth-child(4) {
    width: 5rem !important;
}

#tblInformes td:nth-child(6), #tblInformes th:nth-child(6) {
    width: 4rem !important;
}

#tblInformes td:nth-child(7), #tblInformes th:nth-child(7) {
    width: 2rem !important;
}

#tblInformes td:nth-child(9), #tblInformes th:nth-child(9) {
    width: 7rem !important;
}

#tblInformes td:nth-child(10), #tblInformes th:nth-child(10) {
    width: 3rem !important;
}

#tblInformes td:nth-child(11), #tblInformes th:nth-child(11) {
    width: 3rem !important;
}

#tblInformes td, #tblInformes th {
    padding: 0.5rem 0rem;
}

#manage-clientes td, manage-clientes th {
    height: 2rem;
}

.table_header {
    background-color: white;
    border-bottom: 3px double lightgray;
}

    .table_header th {
        border-right: 1px dotted lightgray;
        text-align: center;
        align-self: center;
    }

    .table_header div, #checkpanel td, #clienttable td:last-child {
        text-align: center;
        align-self: center;
    }

.front_section_c1 {
    min-width: 15rem;
}

.front_section_c2_hidden {
    max-width: 0rem;
    padding:0px!important;
}

.front_section_c2_visible {
    /*min-width: 10rem;*/
}

.gestMat {
    height: 100%;
    background-position-x: 0.3rem;
    display: flex;
    background-position-y: center;
    align-items: center;
    padding-left: 1.5rem;
}
tr.assign_node {
    height: 2.2rem !important;
}

.mark, mark {
    padding: 0rem !important;
    background-color: #fcf8e3;
}


.ztree {
    flex-grow: 1;
    flex-shrink: 0;
    padding: 0.4rem 0.5rem 0px 0px;
}

.tnode {
    display: flex;
    flex-direction: column;
    margin-left:0.5rem;
}

.SelectedNode {
    box-shadow: 4px 3px 8px 1px #969696;
    -webkit-box-shadow: 4px 4px 9px 2px #969696;
    margin-bottom: 0.5rem;
    border-radius: 4px 4px 4px 4px;
    overflow: hidden;
}

.tnodehead {
    display: flex;
    padding-left: 0.4rem;
    border-left-width: 3px;
    cursor: pointer;
    align-items: center;
}
.SelectedNode > .tnodehead {
    padding-bottom: 0.3rem;
    padding-top: 0.3rem;
}
.endnode{
    width:1.6rem;
}
.toggler {
    width: 2.6rem;
}

.Year .toggler, .end_node {
    width: 1rem !important;
}

.SelectedNode > .tnodebody {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.tnodebody {
    padding-left: 0.5rem;
}



.ico {
    background-size: auto 1.1rem;
    background-repeat: no-repeat;
}

.ztree .ico {
    background-position: 1.2rem;
}
    .ztree .ico.Leaf {
        background-position: 0.4rem;
    }
.end_node:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f129";
}
/* Icon when the collapsible content is shown */
.toggler:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0d7";
}
/* Icon when the collapsible content is hidden */
.toggler.collapsed:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0da";
}
/* Remove */
/*.tnode, .tnodehead, .tnodebody, .tleaf {
    border: 1px solid;
}*/

.toggler {
    cursor:pointer;
}


.uploadMode:hover {
    color: #007bff !important;
}

.zMlabel {
    font-style: italic;
    color: gray;
}
.zMinfo{
    padding-left:1rem;
}
.norightsmessage {
    display: flex;
    height: 100%;
    align-self: end;
    align-items: self-end;
}

#innerFrame {
    height: 100%;
    display: flex;
    width: 100%
}
.mobile_format #MainArea {
    overflow-y: initial;
}
#scrollClient.mobile_format  {
    overflow: initial!important;
}
#scrollClient.mobile_format.nofocus {
    overflow: auto !important;
}
#scrollClient {

}
.mobile_format #example1 {
    overflow: initial!important;
}
.mobile_format #innerFrame {
    flex-direction: column;
    overflow-y: auto;
}
.mobile_format #TreeArea {
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    border-right:none;
    min-height: 2.7rem;
/*    max-height:40vh;*/
}
.mobile_format #tree_resizer, .mobile_format.nofocus #MainArea, .mobile_format #SearchBoxArea, .TreeMenu.mobile_format, .mobile_format #ActionText, .mobile_format .section_subtitle {
    display: none !important;
}
.mobile_format:not(.nofocus) #Left_Tree {
    margin: 0px;
}
.mobile_format:not(.nofocus) .ztree, .mobile_format:not(.nofocus) #Left_Tree_Wrapper, .mobile_format:not(.nofocus) .tnode.Empresa {
    padding: 0px;
    margin: 0px;
}
.mobile_format:not(.nofocus) #Left_Tree_Wrapper {
    border:1px gray solid;
    margin-bottom:6px;
}
.mobile_format #Left_Tree_Wrapper {
    margin-top:3px;
}


#MainArea {
    flex: 2 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.tagarea {

    position: absolute;
    right: 0;
}

#SearchBoxArea {
    flex: 0 0 auto;
    width: 100%;
    background-color: azure;
    margin-bottom: 5px;
    padding: 5px;
    display:flex;
}

.mobile_format .EmpresaBody, .mobile_format .Clientes, .mobile_format .Empleados {
    padding-right: 0.5rem;
}

.mobile_format:not(.nofocus) #detail_closer {
    height: 1.7rem;
    width: 1.7rem;
    top: 0.3rem;
    right: 0.4rem;
    position: absolute;
    background-image: url('../images/close_focus.png');
}

#detail_closer {
    width:0px;
    padding:0px;
    z-index:100;
}