:root {
    --color1: #032b57 !important; /*Azul oscuro*/
    --color2: #179c94 !important; /*Verde azul */
    --color3: #1c5c61 !important; /*Azul marino*/
    --color4: #b3ff00 !important; /*Verde limon */
    --color5: #8eb817 !important; /*Ocre */
    --color6: #007934 !important; /*Verde Aceituna */
    --color7: #2d8188 !important; /*Azul marino claro */


    --color1H: #021932 !important; /*Azul oscuro mas */
    --color5H: #5f7b10 !important; /*Ocre oscuro*/
    --color6H: #024e23 !important; /*Verde Aceituna oscuro */
}

/* Base Nivel de colores

#ff0000 MUY ALTO
#ff8128 ALTO
#fbff01 MEDIO
#0a780a BAJO
#47c55c MUY BAJO

*/

/*
<div class="card" id="">
    <div class="card-body">
        <div class="table-responsive">
            <div class="row">
                <div style="width: 200px; height: 100px; background: #006937"></div>
                <div style="width: 200px; height: 100px; background: #00665F"></div>
                <div style="width: 200px; height: 100px; background: #142749"></div>
                <div style="width: 200px; height: 100px; background: #BAFF00"></div>
                <div style="width: 200px; height: 100px; background: #A8D42E "></div>
            </div>
        </div>
    </div>
</div>
*/

@font-face {
    font-family: 'Microgramma Bold';
    src: url('../assets/Fuentes/Microgramma/Microgramma Bold.ttf') format('truetype');
}

.hidden {
    display: none !important;
}

.page-link .page-item.active {
    background-color: #032B57;
    border-color: #032B57;
}

.btn {
    border-radius: 4px;
}

.buttons-html5, .buttons-print {
    color: #fff;
    background-color: #032B57;
    border-color: #032B57;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: 4px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #032B57;
    color: #fff;
}

.imagenes-animadas {
    background-image: var(--fondo1);
    overflow: hidden;
    background-attachment: fixed;
    animation: efectoImagenes 30s infinite;
    z-index: 2;
}


@keyframes efectoImagenes {

    0% {
        background-image: var(--fondo1);
    }

    20% {
        background-image: var(--fondo2);
    }

    40% {
        background-image: var(--fondo3);
    }

    60% {
        background-image: var(--fondo4);
    }

    80% {
        background-image: var(--fondo5);
    }

    100% {
        background-image: var(--fondo1);
    }
}

#particles-js {
    width: 100%;
    height: 100%;
    background-size: inherit;
    background-position: bottom right;
    position: fixed;
    top: 0px;
    z-index: 1;
}

/* ================================================================================ */
/* ESTILOS LAYOUT ================================================================== */


/* Top header derecho (el que contiene grado y nombre funcionario) */
#main-wrapper[data-layout="vertical"] .topbar .navbar-collapse[data-navbarbg="skin1"] {
    /*background: linear-gradient(101deg, #011526d9 14%, #233b5fc9 91%) !important;*/
    /*    background: linear-gradient(10deg, rgba(3,43,87,1) 25%, rgb(0 106 141) 62%, rgba(23,156,148,1) 97%) !important;
*/ /*    background: linear-gradient(5deg, #00572e 20%, #064432 49%, #142749f2 80%) !important; */
}

/* Top header izquierdo (el que contiene escudo y encabezado PONAL) */
#main-wrapper[data-layout="vertical"] .topbar .top-navbar .navbar-header[data-logobg="skin1"] {
    /*    background: #00572e !important;*/
    background: #032b57 !important;
}

/* Menu izquierdo */
.left-sidebar[data-sidebarbg="skin1"] {
    /*    background: linear-gradient( 77deg, rgba(3,43,87,1) 25%, rgb(0 77 108) 62%, rgb(14 119 117) 97%) !important;*/
    background: linear-gradient(101deg, #011526d9 14%, #233b5fc9 91%) !important;
}

/* Footer izquierdo */
.sidebar-footer {
    background: #032b57 !important;
    /*    background: #032b57 !important; 
*/
    /*        background: linear-gradient(337deg, #014e2a 14%, #064432 26%, #142749f2 80%) !important;
*/
}

/* Footer derecho (Con aÃ±o de version) */
.footer {
    background: #032b57;
    /*    background: linear-gradient(10deg, rgba(3,43,87,1) 25%, rgb(0 106 141) 62%, rgba(23,156,148,1) 97%) !important;
*/
    /*    background: linear-gradient(35deg, #014e2a 20%, #064432 49%, #142749f2 80%) !important;
*/
}


.bg-azul {
    background: linear-gradient(101deg, #011526d9 14%, #233b5fc9 91%) !important;
    /*    background: linear-gradient(68deg, rgb(3 20 87 / 80%) 25%, rgb(0 106 141) 62%, rgba(23,156,148,0.7) 97%) !important;
*/ /* background: linear-gradient(68deg, rgb(3 20 87 / 80%) 25%, rgb(0 106 141) 62%, rgba(23,156,148,0.7) 97%) !important;*/
}

.bg-success {
    /*    background-color: #032b57 !important;
*/ background: linear-gradient(304deg, #032b57 10%, #286561 68%) !important;
}


/*.iconGiro {
    transition: .5s;
    -moz-transition: .5s;
    -webkit-transition: .5s;
    -o-transition: .5s;
}*/

/*.iconGiro:hover {
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
    }*/


.letraMenu, .letraSubMenu {
    font-size: 12px !important;
}

li.sidebar-item:hover .letraMenu {
    scale: 1.2;
    left: 15px !important;
}

li.sidebar-item:hover i {
    /*    margin-left: 5px !important;
*/ /*transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);*/
}

li.sidebar-item:hover .letraSubMenu {
    scale: 1;
    left: 0 !important;
}

a.sidebar-link.letraSubMenu {
    padding: 4px 5px 4px 12px !important;
}

    a.sidebar-link.letraSubMenu:hover {
        scale: 1.1;
        left: 5px !important;
    }

.sidebar-link {
    padding: 3px 5px 3px 5px !important;
}

.sidebar-nav .has-arrow::after {
    top: 16px !important;
}

.sidebar-nav ul .sidebar-item .sidebar-link i {
    font-size: 18px !important;
}

.btnFooterLay {
    border: 1px solid;
    border-radius: 50%;
    padding: 6px;
}

.left-sidebar .sidebar-footer {
    border-top: 1px solid #011526d9;
}

a.link {
    opacity: 0.7;
    padding: 10px !important;
}

    a.link:hover {
        color: #ffffff;
        scale: 1.2;
        opacity: 1;
    }


/* ================================================================================ */

ul .first-level {
    padding: 0px 0px 0px 0px !important;
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link {
    background-color: rgb(0 0 0) !important;
}

/* Colocar negrita a la etiqueta <label> que hacen de titulos de los campos del sistema */
label {
    font-weight: 500 !important;
}

/*FIN MONEDA GIRATORIA ==========================================================*/
#texto_principal {
    margin-top: -15px;
    margin-bottom: -23px;
    text-shadow: 6px 4px 4px #6f99cd69;
    font-family: 'Francois One', sans-serif;
    font-weight: bold !important;
    font-size: 2.5vw;
    line-height: 3vw;
    background: -webkit-linear-gradient(left top, #032B57, #234c60);
    background: linear-gradient(to bottom right, #032B57, #234c60);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.textoPrincipal {
    text-shadow: 6px 4px 4px #6f99cd69;
    font-family: 'Francois One', sans-serif;
    font-weight: bold !important;
    font-size: 2.5vw;
    line-height: 3vw;
    background: -webkit-linear-gradient(left top, #032B57, #234c60);
    background: linear-gradient(to bottom right, #032B57, #234c60);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


/*INICIO RADIOBUTTONS VISTA CREAR RIESGOS ==========================================================*/

/* Radio button */
.radiobtn {
    display: none;
}

.buttons {
    margin-left: -40px;
}

    .buttons li {
        display: block;
    }

        .buttons li label {
            padding-left: 30px;
            position: relative;
            left: -25px;
        }

            .buttons li label:hover {
                cursor: pointer;
            }

        .buttons li span {
            display: inline-block;
            position: relative;
            top: 5px;
            border: 2px solid #ccc;
            width: 18px;
            height: 18px;
            background: #fff;
            border-radius: 15px;
        }

.radiobtn:checked + span::before {
    content: '';
    border: 2px solid #fff;
    position: absolute;
    width: 14px;
    height: 14px;
    background-color: #087b90;
    border-radius: 15px;
}

.filaRadioButton li {
    display: table-cell;
    padding-left: 3px;
    padding-right: 3px;
}
/*FIN RADIOBUTTONS VISTA CREAR RIESGOS ==========================================================*/
/*===============================================================================================*/

/*==============================================================================================*/
/*INICIO BOTON NUEVO ===========================================================================*/
.btn-nuevo {
    color: #fff !important;
    background-color: var(--color7);
    border-color: var(--color7);
    filter: drop-shadow(0px 5px 4px #585858);
    transition: .2s;
}

    .btn-nuevo:hover {
        color: #fff;
        background-color: var(--color2);
        border-color: var(--color2);
        filter: drop-shadow(0px 5px 8px #585858);
        transform: scale(1.05);
        transition: .2s;
    }

    .btn-nuevo:focus, .btn-nuevo.focus {
        color: #fff;
        background-color: var(--color2);
        border-color: var(--color2);
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

    .btn-nuevo.disabled, .btn-nuevo:disabled {
        color: #fff;
        background-color: #316649;
        border-color: #316649;
    }

    .btn-nuevo:not(:disabled):not(.disabled):active:focus, .btn-nuevo:not(:disabled):not(.disabled).active:focus,
    .show > .btn-nuevo.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }
/*FIN BOTON NUEVO ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON DAMERO ===========================================================================*/

.btn-damero {
    color: #052fc7;
    background-color: #b3ff00;
    border-color: #b3ff00;
    font-weight: 500;
}

    .btn-damero:hover {
        color: #fff;
        background-color: #4e9f0f;
        border-color: #4e9f0f;
    }

    .btn-damero:focus, .btn-damero.focus {
        color: #343a40;
        background-color: #b3ff00;
        border-color: #b3c783;
        font-weight: 500;
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

    .btn-damero.disabled, .btn-damero:disabled {
        color: #fff;
        background-color: #316649;
        border-color: #316649;
    }

    .btn-damero:not(:disabled):not(.disabled):active, .btn-damero:not(:disabled):not(.disabled).active,
    .show > .btn-damero.dropdown-toggle {
        color: #fff;
        background-color: #204430;
        border-color: #1c3b2a;
    }

        .btn-damero:not(:disabled):not(.disabled):active:focus, .btn-damero:not(:disabled):not(.disabled).active:focus,
        .show > .btn-damero.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
        }
/*FIN BOTON DAMERO ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON DAMERO GRANDE=====================================================================*/

.btn-dameroGrand {
    color: #032b57;
    background-color: #b3ff00;
    border-color: #b3ff00;
    font-weight: 700;
    width: 18vw;
    height: 10vh;
    margin: 5px;
    border-radius: 10px;
    border-color: #032b57;
    font-size: 16px;
    display: inline;
    box-shadow: inset 0px 15px 20px 0px #fbff0f;
}

    .btn-dameroGrand:hover {
        color: #fff;
        background-color: #032b57;
        border-color: #032b57;
        box-shadow: inset 0px 5px 20px 0px #fff;
        transform: scale(1.05);
        overflow: hidden;
    }

    .btn-dameroGrand:focus, .btn-dameroGrand.focus {
        color: #343a40;
        background-color: #b3ff00;
        border-color: #b3c783;
        font-weight: 500;
    }

    .btn-dameroGrand.disabled, .btn-dameroGrand:disabled {
        color: #fff;
        background-color: #316649;
        border-color: #316649;
    }

    .btn-dameroGrand:not(:disabled):not(.disabled):active, .btn-dameroGrand:not(:disabled):not(.disabled).active,
    .show > .btn-dameroGrand.dropdown-toggle {
        color: #fff;
        background-color: #204430;
        border-color: #1c3b2a;
    }

        .btn-dameroGrand:not(:disabled):not(.disabled):active:focus, .btn-dameroGrand:not(:disabled):not(.disabled).active:focus,
        .show > .btn-dameroGrand.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
        }
/*FIN BOTON DAMERO GRANDE ======================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON NUEVO GRANDE=====================================================================*/

.btn-nuevoGran {
    color: #ffffff;
    font-weight: 600;
    width: 18vw;
    height: 10vh;
    margin: 10px;
    border-radius: 10px;
    font-size: 17px;
    display: inline;
    transition: .2s;
    background: linear-gradient(23deg, rgb(41 163 104 / 94%) 25%, rgb(9 136 132) 62%, rgb(21 113 141) 97%) !important;
    /* background: linear-gradient(12deg, rgb(0 169 157) 25%, rgb(9 140 167) 62%, rgb(79 103 148) 97%) !important;*/
    filter: drop-shadow(6px 6px 5px #767676)
}

    .btn-nuevoGran:hover {
        transform: scale(1.1);
        color: #daff77;
        transition: .2s;
        filter: drop-shadow(12px 12px 15px #414141);
        background: linear-gradient(12deg, rgb(16 138 173) 38%, #01c165de 93%) !important;
        /* background: linear-gradient(12deg, rgb(0 159 197) 25%, rgb(9 102 157) 62%, #0a3992 97%) !important; */
    }

    .btn-nuevoGran:focus, .btn-nuevoGran.focus {
        color: #343a40;
        background-color: #b3ff00;
        border-color: #b3c783;
        font-weight: 500;
    }

    .btn-nuevoGran.disabled, .btn-nuevoGran:disabled {
        color: #fff;
        border-color: #ffffff00;
        opacity: 1;
        background: linear-gradient(12deg, rgb(194 194 194) 25%, rgb(167 167 167) 62%, rgb(116 116 116) 97%) !important;
        filter: drop-shadow(6px 6px 5px #767676)
    }

        .btn-nuevoGran.disabled:hover, .btn-nuevoGran:disabled:hover {
            transform: scale(0.9);
            color: #fff;
            border-color: #ffffff00;
            opacity: 1;
            background: linear-gradient(12deg, rgb(194 194 194) 25%, rgb(167 167 167) 62%, rgb(116 116 116) 97%) !important;
            filter: drop-shadow(6px 6px 5px #fffdfd);
        }

    .btn-nuevoGran:not(:disabled):not(.disabled):active, .btn-nuevoGran:not(:disabled):not(.disabled).active,
    .show > .btn-dameroGrand.dropdown-toggle {
        color: #fff;
        background-color: #204430;
        border-color: #1c3b2a;
    }

        .btn-nuevoGran:not(:disabled):not(.disabled):active:focus, .btn-nuevoGran:not(:disabled):not(.disabled).active:focus,
        .show > .btn-nuevoGran.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
        }
/*FIN BOTON NUEVO GRANDE ======================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON GREEN ===========================================================================*/

.btn-green {
    color: #fff;
    background-color: var(--color6);
    border-color: var(--color6);
    filter: drop-shadow(0px 5px 4px #585858);
    transition: .2s;
}

    .btn-green:hover {
        color: #fff;
        background-color: var(--color6H);
        border-color: var(--color6H);
        filter: drop-shadow(0px 5px 8px #585858);
        transform: scale(1.05);
        transition: .2s;
    }

    .btn-green:focus, .btn-green.focus {
        color: #fff;
        background-color: var(--color6H);
        border-color: var(--color6H);
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

    .btn-green:not(:disabled):not(.disabled):active, .btn-green:not(:disabled):not(.disabled).active,
    .show > .btn-green.dropdown-toggle {
        color: #fff;
        background-color: var(--color6H);
        border-color: var(--color6H);
    }

        .btn-green:not(:disabled):not(.disabled):active:focus, .btn-green:not(:disabled):not(.disabled).active:focus,
        .show > .btn-green.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
        }
/*FIN BOTON GREEN ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON LISTAS ===========================================================================*/

.btn-lista-edit {
    color: #67757c;
    background-color: #ffffff;
    border-color: #ffffff;
    margin: 1px;
    font-size: 13px;
    padding: 5px 5px 5px 5px;
    min-width: 22vw;
    text-align: left;
}

.btn-lista {
    color: #053b7a;
    background-color: #ffffff;
    border-color: #ffffff;
    font-weight: 500;
    margin: 1px;
    font-size: 12px;
    padding: 2px 5px 2px 5px;
    min-width: 22vw;
    text-align: left
}

    .btn-lista:hover, .btn-lista-edit:hover {
        color: #fff;
        background-color: #087b90;
        border-color: #087b90;
        font-weight: 500;
    }

    .btn-lista:focus, .btn-lista.focus, .btn-lista-edit:focus, .btn-lista-edit.focus {
        color: #fff;
        background-color: #087b90;
        border-color: #087b90;
        font-weight: 500;
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

/*FIN BOTON LISTAS ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON LISTAS DANGER ===========================================================================*/

.btn-lista-danger {
    color: #053b7a;
    background-color: #ffffff;
    border-color: #ffffff;
    font-weight: 500;
    margin: 1px;
    font-size: 12px;
    padding: 2px 5px 2px 5px;
    min-width: 22vw;
    text-align: left
}

    .btn-lista-danger:hover {
        color: #fff;
        background-color: red;
        border-color: red;
        font-weight: 500;
    }

    .btn-lista-danger:focus, .btn-lista-danger.focus {
        color: #fff;
        background-color: red;
        border-color: red;
        font-weight: 500;
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

/*FIN BOTON LISTAS ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON NARANJA ===========================================================================*/

.btn-orange {
    color: #fff;
    background-color: #f07b32;
    border-color: #f07b32;
    font-weight: 500;
}

    .btn-orange:hover {
        color: #fff;
        background-color: #d8a07c;
        border-color: #d8a07c;
    }

    .btn-orange:focus, .btn-orange.focus {
        color: #fff;
        background-color: #7f3d13;
        border-color: #7f3d13;
        font-weight: 500;
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

/*FIN BOTON NARANJA ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON TRASH ===========================================================================*/

.btn-trash {
    color: gray;
    background-color: #f5f4f4;
    border-color: #e9ecef;
    font-weight: 500;
}

    .btn-trash:hover {
        color: red;
        background-color: white;
        border-color: red;
    }

    .btn-trash:focus {
        color: white;
        background-color: red;
        border-color: red;
        font-weight: 500;
    }

/*FIN BOTON TRASH ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON DANGER MINI ===========================================================================*/

.btn-nuevoMini {
    color: #fff !important;
    background-color: #087b90;
    border-color: #087b90;
    padding: 3px 8px 3px 8px;
}

    .btn-nuevoMini:hover {
        color: #fff;
        background-color: #169a94;
        border-color: #169a94;
    }

    .btn-nuevoMini:focus, .btn-nuevoMini.focus {
        color: #fff;
        background-color: #169a94;
        border-color: #169a94;
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

/*==============================================================================================*/
/*INICIO BOTON DANGER MINI ===========================================================================*/

.btn-dangerMini {
    color: #fff;
    background-color: #d61f1f;
    border-color: #d61f1f;
    padding: 3px 8px 3px 8px;
}

    .btn-dangerMini:hover {
        color: #fff;
        background-color: #b51a1a;
        border-color: #a91919;
    }

    .btn-dangerMini:focus, .btn-dangerMini.focus {
        color: #fff;
        background-color: #b51a1a;
        border-color: #a91919;
        box-shadow: 0 0 0 0.2rem rgba(220, 65, 65, 0.5);
    }
/*==============================================================================================*/
/*INICIO BOTON NEUTRO ===========================================================================*/

.btn-neutro {
    color: #ffffff00;
    background-color: #ffffff00;
    border-color: #ffffff00;
    font-weight: 500;
    width: 100%;
}

/*FIN BOTON NEUTRO ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON ANGOSTO PARA LOS BG-SUCCESS =====================================================*/

.btn-bg-success {
    padding: 2px 10px 2px 10px;
}

/*FIN BOTON ANGOSTO PARA LOS BG-SUCCESS ========================================================*/
/*==============================================================================================*/


/*==============================================================================================*/
/*INICIO BOTON OCRE ===========================================================================*/
.btn-ocre {
    color: #fff !important;
    background-color: var(--color5);
    border-color: var(--color5);
    filter: drop-shadow(0px 5px 4px #585858);
    transition: .2s;
}

    .btn-ocre:hover {
        color: #fff;
        background-color: var(--color5H);
        border-color: var(--color5H);
        filter: drop-shadow(0px 5px 8px #585858);
        transform: scale(1.05);
        transition: .2s;
    }

    .btn-ocre:focus, .btn-ocre.focus {
        color: #fff;
        background-color: var(--color5H);
        border-color: var(--color5H);
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

    .btn-ocre.disabled, .btn-ocre:disabled {
        color: #fff;
        background-color: #316649;
        border-color: #316649;
    }

    .btn-ocre:not(:disabled):not(.disabled):active:focus, .btn-ocre:not(:disabled):not(.disabled).active:focus,
    .show > .btn-ocre.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }
/*FIN BOTON OCRE ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON ACCION ===========================================================================*/

.btn-action {
    color: #fff;
    background-color: var(--color1);
    border-color: var(--color1);
    filter: drop-shadow(0px 5px 4px #585858);
    transition: .2s;
}

    .btn-action:hover {
        color: #fff;
        background-color: var(--color1H);
        border-color: var(--color1H);
        filter: drop-shadow(0px 5px 8px #585858);
        transform: scale(1.05);
        transition: .2s;
    }

    .btn-action:focus, .btn-action.focus {
        color: #fff;
        background-color: var(--color1H);
        border-color: var(--color1H);
        box-shadow: 0 0 0 .2rem rgba(41,75,112,.5);
    }

    .btn-action.disabled, .btn-action:disabled {
        color: #fff;
        background-color: #032b57;
        border-color: #032b57;
    }

    .btn-action:not(:disabled):not(.disabled):active, .btn-action:not(:disabled):not(.disabled).active, .show > .btn-action.dropdown-toggle {
        color: #fff;
        background-color: var(--color1H);
        border-color: var(--color1H);
    }

        .btn-action:not(:disabled):not(.disabled):active:focus, .btn-action:not(:disabled):not(.disabled).active:focus, .show > .btn-action.dropdown-toggle:focus {
            box-shadow: 0 0 0 .2rem rgba(41,75,112,.5);
        }
/*FIN BOTON OCRE ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON WHITE ===========================================================================*/
.btn-white {
    color: #032b57 !important;
    background-color: white;
    border-color: white;
    filter: drop-shadow(0px 5px 4px #585858);
    transition: .2s;
}

    .btn-white:hover {
        color: white !important;
        background-color: var(--color3);
        border-color: var(--color3);
        filter: drop-shadow(0px 5px 8px #585858);
        transform: scale(1.05);
        transition: .2s;
    }

    .btn-white:focus, .btn-white.focus {
        color: white !important;
        background-color: var(--color3);
        border-color: var(--color3);
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }

    .btn-white.disabled, .btn-white:disabled {
        color: white !important;
        background-color: #b9bebb;
        border-color: #b9bebb;
    }

    .btn-white:not(:disabled):not(.disabled):active:focus, .btn-white:not(:disabled):not(.disabled).active:focus,
    .show > .btn-white.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(80, 125, 100, 0.5);
    }
/*FIN BOTON WHITE ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON CANCEL ===========================================================================*/
.btn-cancel {
    color: #fff;
    background-color: #d61f1f;
    border-color: #d61f1f;
    filter: drop-shadow(0px 5px 4px #585858);
    transition: .2s;
}

    .btn-cancel:hover {
        color: #fff;
        background-color: #b51a1a;
        border-color: #a91919;
        filter: drop-shadow(0px 5px 8px #585858);
        transform: scale(1.05);
        transition: .2s;
    }

    .btn-cancel:focus, .btn-cancel.focus {
        color: #fff;
        background-color: #b51a1a;
        border-color: #a91919;
        box-shadow: 0 0 0 .2rem rgba(220,65,65,.5);
    }

    .btn-cancel.disabled, .btn-cancel:disabled {
        color: #fff;
        background-color: #d61f1f;
        border-color: #d61f1f;
    }

    .btn-cancel:not(:disabled):not(.disabled):active, .btn-cancel:not(:disabled):not(.disabled).active, .show > .btn-cancel.dropdown-toggle {
        color: #fff;
        background-color: #a91919;
        border-color: #9e1717;
    }

        .btn-cancel:not(:disabled):not(.disabled):active:focus, .btn-cancel:not(:disabled):not(.disabled).active:focus, .show > .btn-cancel.dropdown-toggle:focus {
            box-shadow: 0 0 0 .2rem rgba(220,65,65,.5);
        }
/*FIN BOTON CANCEL ==============================================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO BOTON RADIO ==============================================================================*/

.btn-radio {
    color: #71777d;
    background-color: #ffffff;
    border-color: #e9ecef;
}

    .btn-radio:hover {
        color: #fff;
        background-color: #032b57;
        border-color: #545b62;
    }

    .btn-radio:focus, .btn-radio.focus {
        color: #fff;
        background-color: #5a6268;
        border-color: #545b62;
        box-shadow: 0 0 0 .2rem rgba(130,138,145,.5);
    }

    .btn-radio.disabled, .btn-radio:disabled {
        color: #fff;
        background-color: #6c757d;
        border-color: #6c757d;
    }

    .btn-radio:not(:disabled):not(.disabled):active, .btn-radio:not(:disabled):not(.disabled).active, .show > .btn-radio.dropdown-toggle {
        color: #fff;
        background-color: #087b90;
        border-color: #087b90;
    }

        .btn-radio:not(:disabled):not(.disabled):active:focus, .btn-radio:not(:disabled):not(.disabled).active:focus, .show > .btn-radio.dropdown-toggle:focus {
            box-shadow: 0 0 0 .2rem rgba(130,138,145,.5);
        }

/*BOTON GRIS MINI ===========================================================================*/

.btn-gray {
    color: #fff;
    background-color: gray;
    border-color: gray;
    padding: 3px 8px 3px 8px;
}
/*==============================================================================================*/
/* Colocar negrita a la etiqueta <label> que hacen de titulos de los campos del sistema */
label {
    font-weight: 500 !important;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #5eb531;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider2 {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #5eb531;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "No";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    text-align: center;
    color: red;
}

.slider2:before {
    position: absolute;
    content: "Si";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    text-align: center;
    color: #5eb531;
}

input:checked + .slider {
    background-color: red;
    left: 10px;
}

input:checked + .slider2 {
    background-color: #ff0000;
    left: 10px;
}

input:disabled + .slider, input:disabled + .slider2 {
    background-color: #bfb2b2;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
    color: #5eb531;
    content: "Si";
}

input:checked + .slider2:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
    color: red;
    content: "No";
}

/* Rounded sliders */
.round1, .round2 {
    line-height: 26px;
    width: 59px;
    height: 34px;
}

.slider.round1, .slider2.round2 {
    border-radius: 34px;
}

    .slider.round1:before, .slider2.round2:before {
        border-radius: 50%;
    }



/*FIN CONFIGURACION NEGRITA LABEL===============================================================*/
/*==============================================================================================*/
/*==============================================================================================*/
/*INICIO DIAGRAMA CALOR ========================================================================*/

/*    Configuracion Diagrama de calor
*/ #containerDiagramaEspecifico, #containerDiagramaGeneral {
    width: 100%;
    height: 200%;
    margin: 0;
    padding: 0;
}

.badge-green {
    color: #fff;
    background-color: #34a24b;
    border-color: #34a24b;
}

.bg-success-mini {
    padding: 5px 5px 5px 5px;
    /*    background-color: #0376ab !important;
*/ background-color: var(--color7) !important;
}

.bg-success-miniGray {
    padding: 5px 5px 5px 5px;
    background-color: #e9ecef !important;
}

.bg-success-miniGreen {
    padding: 5px 5px 5px 5px;
    background-color: #4ead67 !important;
}

.bg-success-miniColor {
    padding: 5px 5px 5px 5px;
    background-color: #0376ab !important;
    background: rgb(190,255,0);
    background: linear-gradient(186deg, rgba(139, 217, 47, 1) 6%, rgba(92, 183, 90, 1) 26%, rgb(60 128 135) 61%);
}

.bg-success-miniMarino {
    padding: 5px 5px 5px 5px;
    background-color: #169a94 !important;
}

@media (max-width: 1600px) {
    .profile-img {
        width: 30px !important;
    }
}

.anchoColumna tbody td:nth-child(3) {
    width: 55%;
}

.centrathtable thead th {
    text-align: center;
}

.centrarCampo tbody td:nth-child(4) {
    text-align: center;
}

/* =============================================================== */


.circular {
    background-image: url('../img/logos/ArcoLoader1.svg');
    height: 190px;
    transform-origin: center center;
    width: 190px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    filter: drop-shadow(0px 0px 0px #fff);
    background-repeat: no-repeat;
    z-index: 999993;
}

.circular1 {
    background-image: url('../img/logos/CentroLoader.svg');
    height: 135px;
    transform-origin: center center;
    width: 135px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    filter: drop-shadow(0px 0px 7px #000);
    z-index: 999995;
}

.circular2 {
    background-image: url('../img/logos/ArcoLoader2.svg');
    height: 170px;
    transform-origin: center center;
    width: 170px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
     filter: drop-shadow(0px 0px 10px #000); 
    z-index: 999993;
}

/*------ Loader IE10 o > -------*/
.loader_decad {
    overflow: hidden;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    z-index: 100660;
}

.loader_dialog {
    position: absolute;
    top: 40%;
    left: 50%;
    margin-top: -100px;
    margin-left: -100px;
}

.loader_back {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: 0.5;
    filter: alpha(opacity=50);
    z-index: 100600;
}

/*---- animaciÃ³n loader ----*/
.loader {
    border: 5px solid #59421F;
    border-top: 5px solid #EADA8D;
    border-radius: 50%;
    width: 180px;
    margin: 0 auto;
    height: 180px;
    animation: spin 4s linear infinite;
}

.path {
    /* stroke-dasharray: 1, 200; */
    /* stroke-dashoffset: 0; */
    /* animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite; */
    /* stroke-linecap: round; */
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124px;
    }
}

@keyframes color {
    100%, 0% {
        stroke: #d62d20;
    }

    40% {
        stroke: #0057e7;
    }

    66% {
        stroke: #008744;
    }

    80%, 90% {
        stroke: #ffa700;
    }
}

.preloader {
    background: linear-gradient(304deg, #005e32bf 9%, #032b5766 124%) !important;
}

/*==============================================================================================*/
/*INICIO GRAFICOS TIPO FLECHA DE AVANCE ========================================================*/

.chevron1 {
    clip-path: polygon(75% 0%, 85% 50%, 75% 100%, 0% 100%, 10% 50%, 0% 0%);
    width: 11vw;
    height: 50px;
    background: #d4dada;
}

.punta {
    width: 0;
    height: 0;
    border-left: 1vw solid #d4dada;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    padding-right: 0px;
}

.cuerpo {
    width: 13vw;
    height: 50px;
    background: #d4dada;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cola {
    width: 0;
    height: 0;
    border-left: 1vw solid transparent;
    border-top: 25px solid #d4dada;
    border-bottom: 25px solid #d4dada;
    padding-left: 0px;
}

.contenedorFlecha {
    display: flex;
}

.textoFlecha {
    color: #899fab;
    font-weight: 600;
    font-size: 0.7vw;
    line-height: 3vw;
    margin-bottom: 4px;
}

.btnSelectorActivo {
    width: 13%;
    margin: 0.5%;
    font-size: .8vw;
    padding: 6px 0px 6px 0px;
}

    .btnSelectorActivo::after {
        background-color: black;
    }

    .btnSelectorActivo.active {
        margin: 0.5% 0.5% 0% 0.5%;
        font-size: 1.05vw;
        background-color: #4ead67;
        border-color: #4ead67;
        border-radius: 4px 4px 0 0;
    }

.tableDiagrama tr td, .tableDiagrama tr, .tableDiagrama th, .tableDiagrama tr th {
    border: 2px solid #ffffff00;
}

/*==============================================================================================*/
/*INICIO PARPADEO DESAPARECER ==================================================================*/

.blink { /* Desaparecer */
    animation-name: parpadeo;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    -webkit-animation-name: parpadeo;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes parpadeo {
    0% {
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        opacity: 1.0;
    }
}

@-webkit-keyframes parpadeo {
    0% {
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }

    100% {
        opacity: 1.0;
    }
}

@keyframes parpadeo {
    0% {
        opacity: 1.0;
    }

    50% {
        opacity: 0.0;
    }


    100% {
        opacity: 1.0;
    }
}

/*==============================================================================================*/
/*INICIO PARPADEO DAMERO =======================================================================*/

.blinkDamero { /* Desaparecer */
    animation-name: parDamero;
    animation-duration: 1.5s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    -webkit-animation-name: parDamero;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}

@keyframes parDamero {
    0% {
        background-color: #032b57; /*Azul oscuro*/
        color: white;
        border-color: #032b57;
    }

    50% {
        background-color: greenyellow; /*Damero*/
        color: darkblue;
        font-weight: 700;
        border-color: greenyellow;
    }

    100% {
        background-color: #032b57; /*Azul oscuro*/
        color: white;
        border-color: #032b57;
    }
}

/*FIN PARPADEO =================================================================================*/
/*==============================================================================================*/

.btnMini, .btnMini:hover {
    padding: 2px 10px;
    filter: drop-shadow(0px 0px 0px #fff0);
    transform: scale(1);
}

.btnMiniRound, .btnMiniRound:hover {
    padding: 2px 10px;
    font-size: 12px;
    border-radius: 13px;
    filter: drop-shadow(0px 0px 0px #fff0);
    transform: scale(1);
}

.btnNotif {
    padding: 0px 5px;
    border-radius: 9px;
    font-size: 11px
}

.td-btnMini {
    vertical-align: middle !important;
    text-align: center !important;
    padding: 3px !important;
}

.tdButton {
    text-align: center !important;
    padding: 4px !important;
    vertical-align: middle !important;
    width: 2%
}

.tdEstado {
    clip-path: polygon(4% 15%, 96% 15%, 96% 85%, 4% 85%);
}

.tdRed {
    background-color: red !important;
    color: white;
}

.tdYellow {
    background-color: yellow !important;
    color: #3d3e19;
}

.tdGreen {
    background-color: red !important;
    color: green;
}

.tdOrange {
    background-color: orange !important;
    color: #3d3e19;
}

.btnReturn {
    vertical-align: top;
    padding-right: 8px;
}

/*-------------------------------------------------------------------*/
/*Estilos nuevo atributo Title azul*/

[data-titleAzul]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

[data-titleAzul]:after {
    content: attr(data-titleAzul);
    background-color: #032b57;
    color: #fff;
    font-size: 14px;
    font-family: "Poppins",sans-serif;
    position: absolute;
    padding: 3px 20px;
    bottom: 2em;
    white-space: nowrap;
    box-shadow: 1px 1px 3px #032b57;
    opacity: 0;
    border: 1px solid #032b57;
    z-index: 99999;
    visibility: hidden;
    border-radius: 10px 10px 0px 10px;
    right: 100%;
}

[data-titleAzul] {
    position: relative;
}

/*-------------------------------------------------------------------*/
/*Estilos nuevo atributo Title Rojo*/
[data-titleRojo]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

[data-titleRojo]:after {
    content: attr(data-titleRojo);
    background-color: red;
    color: #fff;
    font-size: 14px;
    font-family: "Poppins",sans-serif;
    position: absolute;
    padding: 3px 20px;
    bottom: 2em;
    white-space: nowrap;
    box-shadow: 1px 1px 3px #032b57;
    opacity: 0;
    border: 1px solid red;
    z-index: 99999;
    visibility: hidden;
    border-radius: 10px 10px 0px 10px;
    right: 100%;
}

[data-titleRojo] {
    position: relative;
}


/*-------------------------------------------------------------------*/
/*Estilos nuevo atributo Title Ocre para botones a la derecha (R = Right)*/

[data-titleOcreR]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

[data-titleOcreR]:after {
    content: attr(data-titleOcreR);
    background-color: var(--color5);
    color: #fff;
    font-size: 14px;
    font-family: "Poppins",sans-serif;
    position: absolute;
    padding: 3px 20px;
    bottom: 2em;
    white-space: nowrap;
    box-shadow: 1px 1px 3px #032b57;
    opacity: 0;
    border: 1px solid var(--color5);
    z-index: 99999;
    visibility: hidden;
    border-radius: 10px 10px 0px 10px;
    right: 100%;
}

[data-titleOcreR] {
    position: relative;
}

/*-------------------------------------------------------------------*/
/*Estilos nuevo atributo Title Ocre para botones a la derecha (R = Right, D = Down) pero con leyenda abajo*/

[data-titleOcreRD]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

[data-titleOcreRD]:after {
    content: attr(data-titleOcreRD);
    background-color: var(--color5);
    color: #fff;
    font-size: 14px;
    font-family: "Poppins",sans-serif;
    position: absolute;
    padding: 3px 20px;
    bottom: -2em;
    white-space: nowrap;
    box-shadow: 1px 1px 3px #032b57;
    opacity: 0;
    border: 1px solid var(--color5);
    z-index: 99999;
    visibility: hidden;
    border-radius: 10px 0px 10px 10px;
    right: 100%;
}

[data-titleOcreRD] {
    position: relative;
}

/*-------------------------------------------------------------------*/
/*Estilos nuevo atributo Title Ocre para botones a la izquierda (L = Left)*/

[data-titleOcreL]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

[data-titleOcreL]:after {
    content: attr(data-titleOcreL);
    background-color: var(--color5);
    color: #fff;
    font-size: 14px;
    font-family: "Poppins",sans-serif;
    position: absolute;
    padding: 3px 20px;
    bottom: 2em;
    white-space: nowrap;
    box-shadow: 1px 1px 3px #032b57;
    opacity: 0;
    border: 1px solid var(--color5);
    z-index: 99999;
    visibility: hidden;
    border-radius: 10px 10px 10px 0px;
    left: 100%;
}

[data-titleOcreL] {
    position: relative;
}

.span-card-header {
    position: relative;
    top: 12px;
    z-index: 1;
    left: 5px;
    font-size: 18px;
    color: #032b57;
    font-weight: 500;
    background: white;
    padding: 0px 5px;
    border-radius: 10px;
}

.spanCard {
    border: 2px solid #032b57;
    margin: 0;
    min-width: 150px;
    border-radius: 4px;
    width: 100%;
}

[type="checkbox"].filled-in:checked.chk-col-nuevo + label:after {
    border: 2px solid var(--color3);
    background-color: var(--color3);
}

html[dir=rtl] [type="checkbox"]:checked.chk-col-nuevo + label:before {
    border-right: 2px solid transparent;
    border-left: 2px solid #02bec9;
    border-bottom: 2px solid #02bec9;
    top: -5px;
}

[type="checkbox"]:checked.chk-col-nuevo + label:before {
    border-right: 2px solid #02bec9;
    border-bottom: 2px solid #02bec9;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #1083000f !important;
}

.bordeCaja {
    border: 1px solid #d2d8db;
    border-radius: 0 0 5px 5px;
}

.spanBtnGreen {
    background: #37a037;
    color: white;
    font-weight: 400;
    font-size: 0.7vw;
    text-align: center;
    border-radius: 4px;
    padding: 4px 8px;
    margin: 3px 5px;
}

.spanBtnRed {
    background: #d61f1f;
    color: white;
    font-weight: 400;
    font-size: 0.7vw;
    text-align: center;
    border-radius: 4px;
    padding: 4px 8px;
    margin: 3px 5px;
}

.spanBtnYellow {
    background: #fff619;
    color: #67757c;
    font-weight: 500;
    font-size: 0.7vw;
    text-align: center;
    border-radius: 4px;
    padding: 4px 8px;
    margin: 3px 5px;
}

ul.collapse.second-level.in {
    padding: 7px;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

.imgGiro {
    -webkit-animation: 3s rotate linear infinite;
    animation: 3s rotate linear infinite;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

#imgr2 {
    -webkit-animation-direction: reverse;
    animation-direction: reverse;
}

.imgGiroRev {
    -webkit-animation: 8s rotate linear infinite;
    animation: 8s rotate linear infinite;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

.btnToolbarInact {
    color: #ffffff !important;
    background-color: #bdbdbd !important;
}

.btn-blueSea {
    color: #fff;
    background-color: #0f4ebf;
    border-color: #0f4ebf;
}

.btnUnidSinCalif, .btnUnidCalif, .btnUnidAprob {
    font-size: 12px;
    margin: 3px;
}

.select-editable {
    height: auto !important;
    max-height: 260px;
    position: absolute !important;
    width: 100% !important;
    z-index: 1;
    padding: 5px !important;
}

.txtBtnBandeja {
    font-weight: 500;
    text-align: left;
    vertical-align: inherit;
    font-size: 0.7vw;
    padding-right: 7px;
}


/* Modulo Proyectos ----------------------------------------*/

.containerBtnBandeja {
    border: 1px solid #e2e2e2;
    margin-bottom: 5px;
    display: flex;
    align-items: baseline;
    padding: 10px !important;
}

.btnBandeja {
    width: 100%;
    margin: 0px 5px;
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: space-between;
}

a.btn.btn-nuevo.btnBandeja.active {
    background: #4ead67;
    border-color: #4ead67;
}

.cardBottom0 {
    margin-bottom: 0 !important;
}

.btn-tape-proy {
    margin: 3px;
    font-size: .6vw;
    padding: 3px;
    transition: 0.5s ease-in-out;
}

    .btn-tape-proy::after {
        background-color: black;
    }

    .btn-tape-proy.active {
        margin: 5px 2px 0 2px;
        font-size: 0.8vw;
        background-color: #4ead67;
        border-color: #4ead67;
        border-radius: 4px 4px 0 0;
        transition: 0.5s ease-in-out;
    }

/* Modulo indicadores ----------------------------------------*/

.icon-info {
    padding: 0 5px;
    color: #409a24;
    cursor: pointer;
    font-size: 15px;
    font-weight: 700;
}

.card-header-custom {
    background: linear-gradient(101deg, #011526d9 14%, #233b5fc9 91%);
    text-align: center;
}