@font-face {
    font-family: 'Avenir';
    src: url('../fonts/Avenir Roman.ttf') format('truetype');
}

@font-face {
    font-family: 'Avenir Black';
    src: url('../fonts/Avenir-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Avenir Light';
    src: url('../fonts/Avenir-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Avenir Medium';
    src: url('../fonts/Avenir-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Avenir MediumOblique';
    src: url('../fonts/Avenir-MediumOblique.ttf') format('truetype');
}

@font-face {
    font-family: 'Avenir Oblique';
    src: url('../fonts/Avenir-Black.ttf') format('truetype');
}


.accordion-button:not(.collapsed) {
    color: white;
    font-weight:bold;
    background-color: #FF8000;
}



.password-icon {
    float: right;
    position: relative;
    margin: -22px 10px 0 0;
    cursor: pointer;
}

.noborder:focus {
    outline:none;
}

a {
    text-decoration: none !important;
}

html {
    position: relative;
    min-height: 100%;
    
}

body {
    margin-bottom: 60px;
    font-family: Dubai ;
}

.dataTableFontSize{
    font-size: 12px;
}

.fg-bachoco {
    color:#FF8000  !important
}

.bg-bachoco {
    background-color: #FF8000 !important
}

.bg-login {
    /* Aquí el origen de la imagen */
    background-image: url("../image/background-login.jpg");
    /* Fijar la imagen de fondo este vertical y
    horizontalmente y centrado */
    background-position: center center;
    /* Esta imagen no debe de repetirse */
    background-repeat: no-repeat;
    /* COn esta regla fijamos la imagen en la pantalla. */
    background-attachment: fixed;
    /* La imagen ocupa el 100% y se reescala */
    background-size: cover;
    /* Damos un color de fondo mientras la imagen está cargando  */
    background-color: white;
}

.bg-topbar {
    background-color: #ffffff;
}

.bg-blue-spc {
    background-color: #223A76;
}

.myCheck::before {
    border-color: #ec3745 !important;
    background: #ec3745 !important;
}

.c-default {
    cursor: default !important;
}

.circulo {
    height: 40px;
    width: 40px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
}

.circulo2 {
    height: 40px !important;
    width: 40px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
}



.card-border {
    border-radius: 10px !important;
}

.card-border-header {
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
}

.h-appbar {
    height: 70px !important;
}

.dot {
    height: 25px;
    width: 25px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
}

.acceso-rapido-black {
    background-color: #2B3040;
    color: white;
}

div.acceso-rapido-black:hover {
    background-color: white;
    color: #2B3040;
    -webkit-transition: all 1s ease 0s;
    -moz-transition: all 1s ease 0s;
    -ms-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
    transition: all 1s ease 0s
}

.acceso-rapido-red {
    background-color: #ec3745;
    color: white;
}

div.acceso-rapido-red:hover {
    background-color: white;
    color: #ec3745;
    -webkit-transition: all 1s ease 0s;
    -moz-transition: all 1s ease 0s;
    -ms-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
    transition: all 1s ease 0s
}

.acceso-rapido-white {
    background-color: white;
    color: #2B3040;
}

div.acceso-rapido-white:hover {
    background-color: #2B3040;
    color: white;
    -webkit-transition: all 1s ease 0s;
    -moz-transition: all 1s ease 0s;
    -ms-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
    transition: all 1s ease 0s
}

.bg-black-custom {
    background-color: #2B3040 !important;
}

    .bg-black-custom + i :hover {
        background-color: white !important;
        color: #2B3040 !important;
    }

.bg-red-custom {
    background-color: #ec3745 !important;
}

.bg-salmon {
    background-color: #d85b66 !important;
}

.bg-calendar-salmon {
    background-color: #d85b66 !important;
    opacity: 0.3;
    color: white;
    font-weight: bold;
}

.fc .fc-daygrid-day.fc-day-today {
    background-color: rgba(216, 91, 102, 0.15);
    background-color: var(--fc-today-bg-color, rgba(216, 91, 102, 0.15));
    color: #2B3040 !important;
}

#external-events {
    /* position: fixed;
    z-index: 2;
    top: 20px;
    left: 20px;*/
    /* width: 150px;*/
    padding: 0 10px;
    border: 0;
    background: white;
}

    #external-events .fc-event {
        cursor: move;
        margin: 3px 0;
    }

.fg-salmon {
    color: #d85b66 !important;
}

.bd-salmon {
    border-color: #d85b66 !important;
}

.bd-red {
    border-color: #ec3745 !important;
}

.calendar-content .day.selected::after {
    border-top: 20px solid #ec3745 !important;
    border-left: 20px solid transparent;
    right: 0;
    top: 0;
}

.left-0 {
    left: 0 !important;
}

.dropdown-toggle::before {
    border-color: white !important;
}

.navview .navview-menu .dropdown-toggle::after {
    border-color: transparent transparent white transparent;
}

.navview .navview-menu .dropdown-toggle.active-toggle::after {
    border-color: transparent transparent white transparent;
}

.fg-menu {
    color: #a6b0cf !important;
}

.dropdown-toggle::before {
    border-color: white !important;
}

.cambiar {
    color: #a6b0cf !important;
    transition: all 0.7s ease;
}

    .cambiar:hover {
        color: white !important;
        transition: all 0.7s ease;
        background-color: #2B3040 !important;
    }

.selected::after {
    position: absolute;
    display: block;
    border-top: 28px solid #ec3745 !important;
    border-left: 28px solid transparent;
    right: -1px;
    content: "";
    top: -1px;
    z-index: 100;
}

.bg-gray-custom {
    background-color: #F4F4F8 !important;
}

.bg-blue-custom {
    background-color: #D6DBF7 !important;
}

.fg-black-custom {
    color: #2B3040 !important;
}

.fg-red-custom {
    color: #ec3745 !important;
}

.fg-blue-custom {
    color: #D6DBF7 !important;
}

.fg-gray-custom {
    color: #F4F4F8 !important;
}

.bd-black-custom {
    border-color: #2B3040 !important;
}

.bd-red-custom {
    border-color: #ec3745 !important;
}

.bd-gray-custom {
    border-color: #F4F4F8 !important;
}

.bg-purple-custom {
    background-color: #541f49 !important;
}

.fg.bg-purple-custom {
    color: #541f49 !important;
}

.bg-orange-custom {
    background-color: #e87947 !important;
}

.fg-orange-custom {
    color: #e87947 !important;
}

.bg-yellow-custom {
    background-color: #fecd0d !important;
}

.fg-yellow-custom {
    color: #fecd0d !important;
}

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

.btn-tabla {
    color: #ffffff;
    background-color: #223a76;
}

.btn-tabla:hover {
    background-color:snow;
    color: #223a76 !important;
}

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

.h-login {
    min-height: 100vh;
}

.h-navview {
    height: 100vh !important;
}

.h-actividades {
    min-height: 50vh !important;
}

.h-login-datos {
    min-height: 60vh;
}

.h-login-opciones {
    min-height: 88vh;
}

.color-input-login {
    background-color: #e43033 !important;
    color: black;
}

h-ingresar {
    max-height: 10vw;
}

.input-clear-button {
    -webkit-transform: scale(1) !important;
    opacity: 1 !important;
}

.input-reveal-button {
    -webkit-transform: scale(1) !important;
    opacity: 1 !important;
}

/*custom styles datatables*/
.sorting {
    background-color: #222222 !important;
    color: white !important;
}

.sorting_asc {
    background-color: #e2e2e2 !important;
    color: #222222 !important;
}

.table tfoot th {
    background-color: #133F7D !important;
    color: white !important;
}

.table thead th {
    background-color: #FF8000 !important;
    color: white !important;
}

.dataTables_wrapper .dataTables_paginate {
    width: 100% !important;
}

.dataTables_paginate {
    justify-content: center !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: black !important;
    border: 0 !important;
    background-color: #ec3745;
    background: #ff8000 !important;
}

    .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
        color: #ec3745 !important;
        border: 0 !important;
        background: #FF8000 !important;
    }

        .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
            color: white !important;
            border: 1px solid #979797;
            background-color: white;
        }


/*.dataTables_paginate .current {
    color: white !important;
    background-color: #556ee6 !important;
}*/
/*custom styles datatables*/

/*custom styles dialogs*/
.square, .closer, .js-dialog-close, .dialog-title {
    background-color: #222222 !important;
    color: white !important;
}


.st-icon-red {
    background-color: #ec3745 !important;
    color: white !important;
    padding: 8px !important;
    border-radius: 3px;
}

.st-icon-black {
    background-color: #222222 !important;
    color: white !important;
    padding: 8px !important;
    border-radius: 3px;
}

.st-icon-gray {
    background-color: #e2e2e2 !important;
    color: white !important;
    padding: 8px !important;
    border-radius: 3px;
}

.social-box .header .title {
    font-size: 16px !important;
}

/* Sticky footer styles


/**/
.icon-box .icon {
    height: 150px !important;
    width: 150px !important;
}

.icon-box {
    height: 150px !important;
}


/*-------------------estilos home------------------------------- */

/*-------------------estilos breadcrumb------------------------------- */
.fs-bc-izq {
    font-size: calc(1em) !important;
}

.fs-bc-der {
    font-size: calc(1em - 0.1vw) !important;
}
/*-------------------estilos breadcrumb------------------------------- */


/*-------------------tarjeta------------------------------- */
.titulo-tarjeta {
    font-size: calc(1em + 0vw);
    color: white;
}

.subtitulo-tarjeta {
    font-size: calc(1em - 0.3vw);
    color: white;
}

.nombre-tarjeta {
    font-size: calc(1em - 0.3vw);
    color: black;
    font-weight: bold;
}

.puesto-tarjeta {
    font-size: calc(1em - 0.5vw);
    color: black;
}

.btn_tarjeta {
    font-size: calc(1em - 0.4vw);
    color: white;
}

.profile-foto {
    height: 80px;
    width: 80px;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
    left: 20px;
    top: 94px;
    padding: 8px;
    background: white;
    position: absolute;
}

/*-------------------tarjeta------------------------------- */

/*-------------------info rápida------------------------------- */

.titulo-info {
    font-size: 12px;
    color: black;
    font-weight: bold
}

.numero-info {
    font-size: 28px;
    color: black;
    font-weight: bold;
}

/*-------------------info rápida------------------------------- */





/*-------------------estilos home------------------------------- */



/*-------------------------------------------------- */
html {
    font-size: 14px;
}


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

    .hide {
        display: none !important;
    }

    .fc .fc-toolbar-title {
        font-size: 1em;
        margin: 0;
    }
}

@media (max-width: 576px) {


    /*-------------------estilos breadcrumb------------------------------- */
    .fs-bc-izq {
        font-size: calc(1em - 0.3vh) !important;
    }

    .fs-bc-der {
        font-size: calc(1em - 0.7vh) !important;
    }
    /*-------------------estilos breadcrumb------------------------------- */
}

.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;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
}

.footer {
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
}

/*@media (max-width: 1024px){*/
/* -------------------estilos home------------------------------- */

/*-------------------estilos breadcrumb-------------------------------*/
/*.fs-bc-izq {
        font-size: calc(1em + 1vh) !important;
    }
    }

    .fs-bc-der {
        font-size: calc(1em + 0.8vh) !important;
    }*/
/*-------------------estilos breadcrumb------------------------------- */


/*-------------------tarjeta-------------------------------*/
/*.titulo-tarjeta {
    font-size: calc(1em + 0.8vw) !important;
}

    .subtitulo-tarjeta {
        font-size: calc(1em + 0.5vw) !important;
    }

    .nombre-tarjeta {
        font-size: calc(1em + 0.6vw) !important;
    }

    .puesto-tarjeta {
        font-size: calc(1em + 0.3vw) !important;
    }

    .btn_tarjeta {
        font-size: calc(1em + .7vw) !important;
    }

.profile-foto {
    height: calc(1em + 12vw);
    width: calc(1em + 12vw);
    left: 30px;
    top: 130px;
}*/

/*-------------------tarjeta------------------------------- */

/*-------------------info rápida-------------------------------*/

/*.titulo-info {
        font-size: 20px;
    }

    .numero-info {
        font-size: 36px;
    }

    .circulo2 {
        height: 70px !important;
        width: 70px;
        font-size:34px !important;
    }*/

/*-------------------info rápida------------------------------- */





/*-------------------estilos home-------------------------------*/
/*}*/

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a {
    background: #2e3548;
    color: #fff !important;
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu ul li.mm-active .active i {
    color: #FF8000 !important;
}

/*nuevos estilos*/
.navbar-header .dropdown .show.header-item {
    background: #FF8000 !important;
    color: #FFF;
}

body[data-sidebar=dark] .vertical-menu {
    background: #ffffff !important;
}

/*topbar*/
body[data-sidebar=dark] .navbar-brand-box {
    background: #ffffff !important;
}

/*texto menu lateral sin activar*/
body[data-sidebar=dark] #sidebar-menu ul li a {
    color: dimgrey;
    font-size: 16px;
}

    body[data-sidebar=dark] #sidebar-menu ul li a:hover {
        transition: color 1s ease-out 100ms;
        color: #FF8000 !important;
    }

        body[data-sidebar=dark] #sidebar-menu ul li a:hover i {
            transition: color 1s ease-out 100ms;
            color: #FF8000;
        }
    

/*texto dropdown activo*/

body[data-sidebar=dark] .mm-active > a {
    color: #00357c !important;
}
    body[data-sidebar=dark] .mm-active > a i {
        color: #00357c !important;
    }


/*titulos menu*/
body[data-sidebar=dark] .menu-title {
    color: #1E1B18;
}


/*icono texto activo menu vertical*/
body[data-sidebar=dark] .mm-active .active i {
    color: #FF8000 !important;
}

/*texto menu vertical activo*/
body[data-sidebar=dark] .mm-active .active {
    color: #FF8000 !important;
}

/*tamaño texto submenu*/
#sidebar-menu ul li ul.sub-menu li a {
    font-size: 14px;
}

body[data-sidebar=dark] .mm-active {
    color: #FF8000 !important;
}

    body[data-sidebar=dark] .mm-active > i {
        color: #FF8000 !important;
    }

.fg-pagina-bread {
    color: #FF8000;
}

.fg-pag-actual {
    color: #FF8000 !important;
    font-weight: bold;
}


/*estilos select2*/
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[role=group] .select2-results__group {
    color: #FF8000;
    font-weight: bold;
}

/*estilos tarjetas*/
.card {
    background-color: #fff;
    border-radius: 10px;
    border: none;
    position: relative;
    margin-bottom: 30px;
    box-shadow: 0 0.46875rem 2.1875rem rgba(90,97,105,0.1), 0 0.9375rem 1.40625rem rgba(90,97,105,0.1), 0 0.25rem 0.53125rem rgba(90,97,105,0.12), 0 0.125rem 0.1875rem rgba(90,97,105,0.1);
}

.l-bg-cherry {
    background: linear-gradient(to right, #493240, #f09) !important;
    color: #fff;
}

.l-bg-blue-dark {
    background: linear-gradient(to right, #373b44, #4286f4) !important;
    color: #fff;
}

.l-bg-green-dark {
    background: linear-gradient(to right, #0a504a, #38ef7d) !important;
    color: #fff;
}

.l-bg-orange-dark {
    background: linear-gradient(to right, #a86008, #ffba56) !important;
    color: #fff;
}

.card .card-statistic-3 .card-icon-large .fas, .card .card-statistic-3 .card-icon-large .far, .card .card-statistic-3 .card-icon-large .fab, .card .card-statistic-3 .card-icon-large .fal {
    font-size: 100px;
}

.card .card-statistic-3 .card-icon {
    text-align: center;
    line-height: 50px;
    margin-left: 15px;
    color: #000;
    position: absolute;
    right: -5px;
    top: 20px;
    opacity: 0.1;
}

.card .card-statistic-3 .card-icon-large i {
    font-size: 100px;
}

.card .card-statistic-3 .card-icon-large svg {
    width: 100px;
    height: 100px;
    font-size: 100px;
}

.l-bg-cyan {
    background: linear-gradient(135deg, #289cf5, #84c0ec) !important;
    color: #fff;
}

.l-bg-green {
    background: linear-gradient(135deg, #23bdb8 0%, #43e794 100%) !important;
    color: #fff;
}

.l-bg-orange {
    background: linear-gradient(to right, #f9900e, #ffba56) !important;
    color: #fff;
}

.l-bg-cyan {
    background: linear-gradient(135deg, #289cf5, #84c0ec) !important;
    color: #fff;
}

/*estilos tarjetas*/