@import url('logos-animados/carga-pagina.css');
@import url('logos-animados/carga-elemento.css');
@import url('colores/Personalizado.css');

body {
    color: var(--texto);
}

@font-face {
    font-family: 'HelveticaNeue-BoldExt','Times New Roman', serif;
    src: url('../fonts/HelveticaNeue-BoldExt.otf') format('opentype');
}

@font-face {
    font-family: 'HelveticaNeue-BoldExt','Times New Roman', serif;
    src: url('../fonts/HelveticaNeue-BoldExt.otf') format('opentype');
}

.bold {
    font-family: HelveticaNeue-BoldExt,'Times New Roman', serif !important;
}

.bold {
    /*    font-family: HelveticaNeue-BoldExt,'Times New Roman', serif !important;*/
    font-family: 'Quicksand', sans-serif !important;
}

/* Shared */
.loginBtn {
    box-sizing: border-box;
    position: relative;
    /* width: 13em;  - apply for fixed size */
    margin: 0.2em;
    padding: 0 15px 0 46px;
    border: none;
    text-align: left;
    line-height: 34px;
    white-space: nowrap;
    border-radius: 0.2em;
    font-size: 16px;
    color: #FFF;
}

    .loginBtn:before {
        content: "";
        box-sizing: border-box;
        position: absolute;
        top: 0;
        left: 0;
        width: 34px;
        height: 100%;
    }

    .loginBtn:focus {
        outline: none;
    }

    .loginBtn:active {
        box-shadow: inset 0 0 0 32px rgba(0,0,0,0.1);
    }


/* Facebook */
.loginBtn--facebook {
    background-color: #4C69BA;
    background-image: linear-gradient(#4C69BA, #3B55A0);
    /*font-family: "Helvetica neue", Helvetica Neue, Helvetica, Arial, sans-serif;*/
    text-shadow: 0 -1px 0 #354C8C;
}

    .loginBtn--facebook:before {
        border-right: #364e92 1px solid;
        background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/14082/icon_facebook.png') 6px 6px no-repeat;
    }

    .loginBtn--facebook:hover,
    .loginBtn--facebook:focus {
        background-color: #5B7BD5;
        background-image: linear-gradient(#5B7BD5, #4864B1);
    }


/* Google */
.loginBtn--google {
    /*font-family: "Roboto", Roboto, arial, sans-serif;*/
    background: #DD4B39;
}

    .loginBtn--google:before {
        border-right: #BB3F30 1px solid;
        background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/14082/icon_google.png') 6px 6px no-repeat;
    }

    .loginBtn--google:hover,
    .loginBtn--google:focus {
        background: #E74B37;
    }


label {
    font-weight: bolder;
    font-size: large;
}

html {
    font-weight: bolder;
    /*font-size: .8rem;*/
    background-color: var(--fondo);
    color: var(--texto);
}

/*.breadcrumb {
    padding-top: 1rem;
}*/

.decoracion {
    position: relative;
}


    .decoracion::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: 400px;
        background-image: url(/Archivos/Sistema/abajo_derecha.png);
        background-repeat: no-repeat;
        background-position: calc(100% + 110px) calc(100% + 88px);
        opacity: 0.2;
        z-index: -1;
    }

.main-container {
    min-height: 100vh;
}


.input {
    font-size: .8rem !important;
}



div {
    font-weight: bolder;
}

.button {
    box-shadow: 0px 7px lightgrey;
    margin: 3px;
    margin-bottom: 8px;
}

    .button.is-danger {
    }

.e-atc-popup ul li.e-category {
    background-color: #e7e6e6;
}

.footer {
    background-color: transparent;
}

.danger-bg {
    background-color: #ffe08a;
    min-width: 150px !important;
    padding-left: 5px;
    color: #4c4329 !important;
    border-radius: 20px !important;
    text-align: center;
}
/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

.footer {
    padding-left: 52px !important;
}
/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}

.footer {
    padding: 0;
}


.table {
    width: 100%;
    border-collapse: collapse;
}

.is-delgado {
    padding-bottom: 0px;
    padding-top: 0px;
    padding-left: 3px;
}

.resaltar {
    color: #1abc9c !important;
}

.e-active {
}

    .e-active a {
    }

.e-groupdroparea {
    background: var(--table) !important;
}


.menu_two {
    border: none !important;
}

.menu_three {
    border: none !important;
}

.notification-area {
    z-index: 100;
    max-width: 350px;
    position: fixed;
    bottom: 25px;
    right: -40px;
}

    .notification-area .notification {
        margin-bottom: 1.5rem;
        border-radius: 55px;
        padding-right: 55px;
    }

.clickeable-notification:hover {
    cursor: pointer;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
supported by Chrome and Opera */
}


/*input[type="radio"], input[type=checkbox] {
zoom: 2.0;
}*/
.noclikeable {
    pointer-events: none;
    cursor: default;
}

.nuevolink {
    margin-bottom: 10px;
    width: 100%;
    padding-bottom: 10px;
    text-align: right;
}

.checkbox {
    transform: scale(2);
}


.checkbox-big {
    /*transform: scale(2);*/
}

.table td, .table th {
    padding: 5px 10px;
    text-align: center;
    vertical-align: middle;
}

/*.modal-background{
z-index:100;
}
.modal-card {
z-index: 110;
}*/
label {
    /* fix vertical align issues */
    display: inline-block;
    vertical-align: top;
    margin-top: 10px;
}

.e-grid .e-editcell, .e-grid .e-form-container, .e-grid .e-externalformedit, .e-grid .e-tabletd, .e-grid .e-rowcell {
    font-size: 0.8rem;
}

.e-grid .e-headercell, .e-grid .e-grouptopleftcell {
    background: var(--table);
    color: var(--link) !important;
}

.e-grid .e-headercelldiv {
    font-size: 0.8rem;
    text-align: center !important;
    /*font-size:large;*/
    white-space: break-spaces !important;
}

e-ul {
    font-size: 0.8rem;
    /*font-family: 'HelveticaNeue Light','Times New Roman', serif;*/
    font-family: 'Quicksand', sans-serif !important;
}

select {
    /*font-family: 'HelveticaNeue Light','Times New Roman', serif;*/
    font-family: 'Quicksand', sans-serif !important;
    width: 100%;
    font-size: 0.8rem;
    border-radius: 8px;
    border: 1px solid rgb(100,100,100);
    /*min-height:20px;*/
}



.e-ddl .e-in-wrap, .e-ddl-popup, .e-ddl .e-options, .e-ddl-popup .e-atc.e-search {
    border-color: rgb(0, 0, 0);
    border-top: none;
    border-left: none;
    border-right: none;
}

.input, .textarea {
    border-color: rgb(100,100,100);
    box-shadow: none;
}

/*HAS VALIDATIONS:*/
.has-validation-required {
}

.has-validation-numbers-only {
}

.has-validation-letters-only {
}

.has-validation-no-spaces {
}

.has-validation-upper-letters-only {
}

.has-validation-email {
}

.has-validation-curp {
}

.has-validation-rfc {
}

.has-validation-phone {
}

.has-validation-limit-10 {
}

.has-validation-limit-25 {
}

.has-validation-limit-50 {
}

.has-validation-limit-100 {
}

.has-validation-limit-500 {
}

.has-validation-file-pdf-only {
}

.has-validation-file-images-only {
}

.has-validation-file-pdfimages-only {
}

.has-validation-file-excel-only {
}


.button.is-danger {
    background-color: #e74c3c00;
    color: rgba(0, 0, 0, 0.8) !important;
}

    .button.is-danger:hover {
        background-color: var(--alerta);
    }

.button.is-success {
    background-color: #4caf50;
    color: rgba(0, 0, 0, 0.8) !important;
}

.button.is-secondary {
    border: 3px solid var(--principal);
    background-color: white;
    color: var(--principal);
}

    .button.is-secondary:hover {
        border: 1.5px solid var(--principal_hover);
        background-color: var(--principal);
        color: white;
    }

.file-name {
    width: 100%;
    max-width: 100%;
}

.e-ddl {
    width: 100%;
}

.e-btn.e-select {
    border-color: #c4c4c4;
    font-family: 'Quicksand', sans-serif !important;
    font-weight: bold;
    font-size: 0.8rem;
}

.e-ccButton {
    width: 120px !important;
}

.e-btn.e-select:hover {
}

.e-columnChooserListDiv label {
    font-size: 1rem !important;
}


.e-btn .e-select .e-widget .e-txt .e-corner {
    width: 60px !important;
}

.e-gridcontent {
    /*height:auto !important;*/
}

.min-box {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.title.is-danger {
    color: var(--alerta);
}

.title {
    color: var(--titulos);
}

.danger-bg {
    /*background-color: var(--danger);*/
    min-width: 150px !important;
    padding-left: 5px;
    border-radius: 4px;
    color: var(--titulos);
}

.connectedSortable {
    border-color: var(--border);
    border-top: dotted 1px;
    border-bottom: dotted 1px;
    border-left: dotted 1px;
    border-right: dotted 1px;
    min-height: 300px;
    max-height: 600px;
    overflow: scroll;
}

.sortable-primary {
    background-color: var(--principal);
    color: var(--titulos);
    padding-left: 5px;
    cursor: pointer;
    /*border-radius: 5px;*/
    margin-bottom: 5px;
}

.sortable-info {
    background-color: var(--info);
    color: var(--titulos);
    padding-left: 5px;
    cursor: pointer;
    /*border-radius: 5px;*/
    margin-bottom: 5px;
}

.has-validation-required {
}

.has-validation-numbers-only {
}

.has-validation-letters-only {
}

.has-validation-no-spaces {
}

.has-validation-upper-letters-only {
}

.has-validation-email {
}

.has-validation-curp {
}

.has-validation-rfc {
}

.has-validation-phone {
}

.has-validation-limit-10 {
}

.has-validation-limit-25 {
}

.has-validation-limit-50 {
}

.has-validation-limit-100 {
}

.has-validation-limit-500 {
}

.has-validation-file-pdf-only {
}

.has-validation-file-images-only {
}

.has-validation-file-pdfimages-only {
}

.has-validation-file-excel-only {
}

.label-text-bold {
    border-bottom: none;
    /*border-top: 1px solid var(--principal);*/
    width: 100%;
    /*text-align: center;*/
    color: var(--principal);
    font-size: 1.0.8rem;
    padding-left: 3%;
    color: var(--principal) !important;
}

.min-box {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.circle {
    position: relative;
    background-color: var(--error);
    height: 20px;
    color: white;
    float: left;
    padding-top: .5px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    width: 20px;
    margin: 0 auto;
}

.badge {
    right: 0px;
    background-color: red;
    position: absolute;
    border-radius: 50%;
    color: white;
    font-size: 13px;
    height: 24px;
    min-width: 24px;
    margin-left: 13px;
    margin-top: 3px;
    overflow: hidden;
    padding: 6px 5px 0 3px;
    text-align: center;
}

.badge-number {
    position: relative;
    top: -5px;
}

.desabilitado {
    background-color: gray !important;
}



.not-active {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}

    .not-active .button {
        background-color: #7a878f !important;
    }

    .not-active .input {
        border-color: #7a878f !important;
    }

.modal {
    z-index: 100;
    padding-top: 75px;
}


.table.is-narrow {
    width: auto;
}

.is-numerical {
    text-align: -webkit-right !important;
}

input.is-numerical {
    padding-right: 5px;
    text-align: -webkit-right;
}
/*.defaultformat {
font-family: HelveticaNeue Light;
font-size:10rem;
}*/
.table tr.is-selected {
    background-color: var(--principal);
}

.ayuda {
    font-style: oblique;
    font-weight: normal;
}

.e-grid.e-wrap .e-columnheader .e-headercelldiv, .e-grid.e-wrap .e-rowcell, .e-grid.e-wrap.e-responsive .e-rowcell, .e-grid .e-columnheader.e-wrap .e-headercelldiv, .e-grid .e-gridcontent.e-wrap .e-rowcell, .e-grid.e-responsive .e-gridcontent.e-wrap .e-rowcell {
    white-space: normal;
}



.is-debug {
    /*border: dashed 1px rgb(0,0,0,0.3) !important;*/
    display: none;
}

.tools {
    margin-top: -40px;
    margin-bottom: 10px;
    width: 100%;
    text-align: right;
    align-content: flex-end;
}





.flowBox {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}

    .flowBox > div {
        min-width: 220px;
        padding: 10px;
        flex-grow: 1;
        max-width: 400px;
        flex-basis: 25%;
    }



.flowBoxNarrow {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}

    .flowBoxNarrow div {
        padding: 10px;
        flex-grow: 1;
        max-width: 400px;
    }

.flowBoxMax {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}

    .flowBoxMax div {
        min-width: 220px;
        padding: 10px;
        flex-grow: 1;
    }

.changeDisponible {
    /*max-height: 30px;*/
    padding-top: 2px;
    /*height: -webkit-fill-available !important;*/
    padding-left: 5px;
    padding-right: 5px;
    font-size: 16px;
    height: 30px !important;
    text-align: center;
    cursor: pointer;
    max-width: 100%;
    color: #333;
    border: 2px solid transparent;
    margin-left: 3px;
    margin-right: 3px;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
supported by Chrome and Opera */
    /*background: rgb(230, 232, 233) none repeat scroll 0% 0%;*/
}

.noselectable {
    user-select: none;
}


.leyenda_grafica {
    color: white;
    margin: 3px;
    border-radius: 13px;
    padding: 4px;
    padding-right: 6px;
    padding-left: 6px;
}

.grid_indicadores {
    display: grid;
    grid-template: auto auto / auto auto;
}

.indicador {
    font-size: 34px;
    /*font-family: fantasy,'Times New Roman', serif;*/
    font-family: 'Quicksand', sans-serif !important;
    font-style: oblique;
}

.subindicador {
    font-size: 25px;
    /*font-family: fantasy,'Times New Roman', serif;*/
    font-family: 'Quicksand', sans-serif !important;
    font-style: oblique;
}

.tipo {
    font-size: 12px !important;
    font-weight: bold;
}

.test {
    column-span: span 2;
}

.button.is-info {
    box-shadow: 0px 7px #0b719c;
    margin-bottom: 10px;
    /*  border: 2px solid #ffffff63;*/
}

.Atajo {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
    width: 104%;
    align-content: space-around;
}

    .Atajo .atajo_link {
        display: flex;
        color: white;
        margin: 0px;
        text-align: -webkit-center;
        padding: 14px;
        padding-bottom: 17px;
        border-radius: 8px;
        margin-bottom: 3px;
        border: none;
        min-width: 235px;
    }


        .Atajo .atajo_link:hover {
            background-color: lightgray;
            color: black;
        }

.switch[type=checkbox].is-info:checked + label::before, .switch[type=checkbox].is-info:checked + label:before {
    background: #2e3858;
}

.Atajo .atajo_link .large-icon {
    display: block;
    align-content: flex-start;
    font-size: 27px;
}

.Atajo .atajo_link span {
    white-space: normal;
}

.is-title {
    background-color: #eaeaea;
}

.tool-btn {
    /*font-size:1.3rem;*/
    background-color: gray;
    padding: 10px;
    padding-bottom: 8px;
    padding-top: 6px;
    border-radius: 6px;
    color: white;
    background-color: gray;
    margin-right: 4px;
}


.is-editar {
    background-color: #1abc9c;
    box-shadow: 0px 7px #16a085;
    color: white;
    border: none;
}


.tool-btn.editar {
    background-color: slategray;
    box-shadow: none;
    border-radius: 6px;
}

.tool-btn.detalles {
    /*background-color: #082a6a;*/
    background-color: var(--principal);
    box-shadow: none;
    border-radius: 6px;
}

.tool-btn.eliminar {
    background-color: transparent;
    box-shadow: none;
    color: #082a6a;
    border-radius: 6px;
}

.tool-btn.editar:hover {
    background-color: lightgray;
}

.tool-btn.detalles:hover {
    background-color: lightgray;
    color: black;
}

.tool-btn.eliminar:hover {
    background-color: #c0392b;
}

.tool-btn.asignar {
    background-color: #dba634;
    border-radius: 50px;
}

    .tool-btn.asignar:hover {
        background-color: #a06d15;
    }

.no-margin {
    margin-bottom: 0px !important;
}

.e-rte-toolbar-icon {
    font-family: 'ej-webfont' !important;
}

.e-toolbar {
    font-family: 'ej-webfont' !important;
}

.e-toolbaricons {
    font-family: 'ej-webfont' !important;
}

.e-resIcon {
    font-family: 'ej-webfont' !important;
}

.e-btn-span {
    display: -webkit-box !important;
}

.flowBoxPad {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}

    .flowBoxPad > div {
        min-width: 220px;
        padding: 10px;
        flex-grow: 1;
        max-width: 400px;
        margin: 20px;
        background-color: white;
        border-radius: 6px;
        box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
        color: #4a4a4a;
        display: block;
        padding: 1.25rem;
    }

.checkbox-big {
    margin-right: 5px;
    margin-left: 10px;
}

.checkbox-grande {
    transform: scale(2);
    margin-right: 5px;
    margin-left: 10px;
}

.file-input {
    left: -100px;
}

.button.is-info {
    background-color: var(--principal);
    box-shadow: 0px 7px #16a085;
    /*color: white !important;*/
}

    .button.is-info a {
        color: white !important;
        font-weight: bolder;
    }

    .button.is-info:hover {
        background-color: var(--principal_hover);
    }


.button.is-informacion {
    background-color: #1ca7e2;
    box-shadow: 0px 7px #0b719c;
    color: white !important;
    border: none;
}

    .button.is-informacion a {
        color: white !important;
        font-weight: bolder;
    }

    .button.is-informacion:hover {
        background-color: #0b719c;
    }


.div_no_validado_email {
    position: fixed;
    right: 0px;
    z-index: 10000;
}

.subtitle {
    color: var(--texto_contraste);
    font-weight: bold;
}

#weatherWidgetInner {
    background-color: var(--principal) !important;
    color: var(--texto) !important;
}


.breadcrumb a {
    align-items: center;
    color: var(--migajas);
    display: flex;
    justify-content: center;
    padding: 0 0.75em;
}

    .breadcrumb a:hover {
        color: #363636;
    }

.breadcrumb li {
    color: var(--migaja-activo);
}

    .breadcrumb li.is-active a {
        color: var(--migaja-activo );
    }

.ui-accordion-header {
    color: var(--principal_hover);
}

    .ui-accordion-header p {
        color: var(--principal_var1);
    }

input[type='checkbox'] {
    transform: scale(2);
}

input[type='radio'] {
    transform: scale(2);
}

.e-toolbar {
    font-family: Segoe UI,Helvetica Neue,Ubuntu,Arial !important;
    font-family: 'Quicksand', sans-serif !important;
}

.e-grid .e-alt_row {
    /*background: #cfd0d2;*/
}

.e-grid .e-rowcell {
    border-width: 0px 0px 2px 0px;
    padding: .7em;
    line-height: 14px;
    white-space: nowrap;
    width: auto;
    vertical-align: middle;
}

/*-----------------------SECCION PARA RESPONSIVOS------------------------------*/
@media only screen and (max-width: 1650px) {
    .imagen_degradado {
        height: 110px !important;
        /*display: none;*/
    }
}

@media only screen and (max-width: 1240px) {
    .imagen_degradado {
        display: none;
    }
}

.show_on_mobile {
    display: none;
}


@media only screen and (max-width: 660px) {
    .hidde_on_mobile {
        display: none;
    }

    .show_on_mobile {
        display: block;
    }

    /*.body-content {*/
    /*padding-left: 10px;*/
    /*padding-left: 15px !important;
    }*/

    /*   nav {
        margin-left: 59px;
    }*/

    #LbEntradas {
        font-size: xx-large !important;
    }

    #LbSalidas {
        font-size: xx-large !important;
    }

    #LbBalance {
        font-size: xx-large !important;
    }

    #Titulo {
        font-size: x-large !important;
    }

    #TituloIndicardor {
        font-size: xxx-large !important;
    }
}

@media only screen and (max-width: 500px) {
    .nuevolink {
        margin-top: 0px;
    }

    .tools {
        margin-top: 0px;
    }
}



.avatar-medium {
    width: 70px;
    border-radius: 20%;
}


.eti_tags {
    height: auto;
}

    .eti_tags input {
        margin-right: 5px;
        margin-left: 10px;
        pointer-events: none;
        cursor: default;
    }



a {
    color: var(--migajas);
}

    a:hover {
        color: var(--alerta_hover);
    }


    a:visited {
        color: var(--alerta_hover);
    }

.menu_link {
    padding: 13px;
    margin: 0px;
}

    .menu_link:hover {
        border: none !important;
    }

.menu a {
    color: var(--links-menu);
    background-color: transparent;
    font-weight: bolder !important;
}

    .menu a:visited {
        color: var(--links-menu);
    }


.breadcrumb a {
    color: var(--migajas);
}

.button-narrow {
    margin: 0px;
    padding: 0px;
}

.no-shadow {
    box-shadow: 0px 0px #16a085 !important;
}

div, td, th, span, a, aside, figure, p, nav {
    /*debug*/
    /*border: dashed 1px rgb(125,125,125,0.5) !important;*/
}

.buttonCheck input {
    pointer-events: none;
}

.link_subrayado::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #000;
    transition: width .3s;
}

.link_subrayado:hover::after {
    s width: 100%;
    /*//transition: width .3s;*/
}

#menuFooter {
    z-index: -1;
}

.content-widget {
    color: var(--titulos) !important;
    /* border: 1px solid black; */
}

.logo {
    width: 43%;
}

.box .title {
    color: var(--principal);
}


.tool-btn {
    color: white;
}

    .tool-btn:visited {
        color: white;
    }

.is-description {
    padding: 10px;
}

.e-datetime-wrap {
    background-color: transparent !important;
}

.Secundario .menu_link {
    background-color: var(--principal_var6);
}

.breadcrumb a:hover {
    color: var(--migaja-activo);
}


.simple_table {
    width: 100%;
}

    .simple_table th, .simple_table td {
        border: 1px solid black;
        padding: 3px;
        padding-left: 9px;
        padding-right: 9px;
        border-collapse: collapse;
    }

    .simple_table th, .simple_tabletd {
        padding: 15px;
        text-align: left;
    }

.simple_tabletable tr:nth-child(even) {
    background-color: #eee;
}

.simple_table tr:nth-child(odd) {
    background-color: #fff;
}

.simple_table th {
    background-color: var(--principal);
    color: var(--texto_contraste);
}

.animacion-down {
}

.hidden {
    display: none;
}


@keyframes girar {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes animacion-down {
    70% {
        transform: translateY(5%);
    }

    100% {
        transform: translateY(0%);
    }
}

.animacion-down {
    animation-name: animacion-down;
    animation-duration: .5s;
    animation-delay: .5s;
    transform: translateY(-100%);
    -webkit-animation-fill-mode: forwards; /* Chrome 16+, Safari 4+ */
    -moz-animation-fill-mode: forwards; /* FF 5+ */
    -o-animation-fill-mode: forwards; /* Not implemented yet */
    -ms-animation-fill-mode: forwards; /* IE 10+ */
    animation-fill-mode: forwards;
}


.simple_table {
    width: 100%;
}

    .simple_table th, .simple_table td {
        border: 1px solid black;
        padding: 3px;
        padding-left: 9px;
        padding-right: 9px;
        border-collapse: collapse;
    }

    .simple_table th, .simple_tabletd {
        padding: 15px;
        text-align: left;
    }

.simple_tabletable tr:nth-child(even) {
    background-color: #eee;
}

.simple_table tr:nth-child(odd) {
    background-color: #fff;
}

.simple_table th {
    background-color: var(--principal);
    color: var(--texto_contraste);
}


.preloader {
    width: 130px;
    margin-left: -65px;
    margin-top: -65px;
    height: 130px;
    border: 3px solid var(--principal);
    border-top: 3px solid var(--texto);
    border-radius: 50%;
    animation-name: girar;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 50%;
    transform: translate(-50%,-50%);
}

.preloader-min {
    width: 60px;
    margin-left: -30px;
    margin-top: -30px;
    height: 60px;
}

.logo_loader {
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 50%;
    transform: translate(-50%,-50%);
}



.cargando {
    width: 85px;
    margin-left: 0;
    margin-top: -74px;
    height: 85px;
    border: 3px solid var(--fondo);
    border-top: 3px solid var(--titulos);
    border-radius: 50%;
    animation-name: girar;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}


.loader_div {
    background-color: transparent;
    height: 100%;
    height: -webkit-fill-available;
    text-align: center;
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
}

    .loader_div .preloader {
        position: relative;
        top: unset;
        transform: none;
        left: unset;
        transform: none;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .loader_div .logo_loader {
        position: relative;
        top: unset;
        transform: none;
        left: unset;
        transform: none;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

.logo_mini {
    width: 47px;
    padding-top: 8px;
    background-color: white;
    border-radius: 10px;
}

.logo {
    WIDTH: auto !important;
}

.button {
    /*height: auto;*/
}


.chat_leer {
    display: none !important;
}

.mensaje-contenedor-enviado .mensaje {
    background-color: #a1e6bc;
}

.input_editor_imagen_chat {
    position: absolute;
    top: -500px;
}

#debig3 {
    display: none;
}

nav {
}

.lista_miembros {
    overflow-y: scroll;
    height: inherit;
    padding-bottom: 57px;
}

footer {
    display: none;
}

.miembro_div {
    background-color: #f3efe8;
    grid-template: 'a b c e' 'a b d e';
    grid-template-rows: 35px 35px;
    grid-template-columns: 70px auto 30px 20px;
    margin-bottom: 10px;
    display: grid;
    color: black;
}

    .miembro_div img {
        height: 70px;
        border-radius: 50%;
        grid-area: a;
    }

    .miembro_div p {
        grid-area: b;
    }

    .miembro_div button {
        grid-area: c;
    }

.title-eliminar {
    padding-top: 10px;
}

.boton-cerrar-eliminar-usuarios {
    width: 34px;
    padding-top: 1px;
    padding-bottom: 26px;
    height: 30px;
    float: right;
    right: 0px;
    position: relative;
}

.emoji-menu {
    position: relative;
    /* right: 0px; */
    float: right;
    top: -287px;
    s
}

.emoji-picker-icon {
    cursor: pointer;
    float: right;
    position: relative;
    right: 3px;
    top: -42px;
    font-size: 20px;
    opacity: 0.7;
    z-index: 100;
    transition: none;
    color: black;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.mensaje-contenedor-enviado {
    text-align: -webkit-right;
    text-align: -moz-right;
}

.mensaje-contenedor-recibido {
}

.mensaje-contenedor-sistema {
    text-align: -webkit-center;
    text-align: -moz-center;
}

.mensaje {
    color: black;
    border: 1px solid black;
    padding: 10px;
    padding-bottom: 0px;
    margin: 4px;
    font-size: 15px;
    margin: 10px;
    border-radius: 10px;
    width: fit-content;
    width: -moz-fit-content;
}

.mensaje-contenedor-recibido .mensaje {
}

.mensaje-contenedor-sistema .mensaje {
}

.conversacion {
    display: grid;
    background-color: white;
    grid-template: 'imagen nombre_usuario hora' 'imagen ultimo_mensaje sin_leer';
    grid-template-columns: 80px auto 70px;
    color: var(--texto);
    border-bottom: 1px solid gray;
    cursor: pointer;
}

.imagen {
    grid-area: imagen;
    padding: 10px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
}

.nombre_usuario {
    grid-area: nombre_usuario;
    overflow-x: hidden;
    white-space: nowrap;
    color: var(--principal_hover);
    font-size: 17px;
}

.hora {
    grid-area: hora;
    text-align: -webkit-right;
    text-align: -moz-right;
    padding-right: 5px;
}


.ultimo_mensaje {
    grid-area: ultimo_mensaje;
    overflow-x: hidden;
    white-space: nowrap;
    overflow-y: hidden;
    height: 56px;
    color: darkgrey;
}

.sin_leer {
    grid-area: sin_leer;
    background-color: yellowgreen;
    border-radius: 50%;
    text-align: -webkit-right;
    padding-right: 8px;
    padding-left: 5px;
    padding-top: 2px;
    width: 24px;
    margin-left: 42px;
    height: 24px;
    color: white;
}

.layout_chat {
    width: 100%;
    /*    display: grid;
    grid-template: 'a1 b1';
    grid-template-columns: 400px auto;
    grid-template-rows: 1fr;*/
}

@media only screen and (max-width: 900px) {
    .layout_chat {
        grid-template: 'a1' 'b1';
        grid-template-columns: auto auto;
        grid-template-rows: 1fr 2fr;
    }

    .fullwindow {
        height: 700px;
    }
}

#chats {
    border: 2px solid gray;
    grid-area: a1;
    overflow-y: auto;
    overflow-x: hidden;
    border-radius: 20px;
    margin-right: 20px;
}

.chat_body {
    grid-area: b1;
    border: 2px solid gray;
    border-radius: 20px;
}

.chat_miembros {
    overflow-y: hidden;
    float: right;
    position: relative;
    background-color: #ffffff;
    right: 400px;
    width: 400px;
    top: -2px;
    margin-bottom: -9999px;
    display: none;
    z-index: 10;
    margin-right: -400px;
    color: var(--texto_contraste);
}

.chat_body_conversacion {
    height: 100%;
    display: grid;
    border-radius: 20px;
    grid-template: 'chat_imagen chat_nombre agregar_persona' 'chat_imagen miembros miembros' 'chat_mensajes chat_mensajes chat_mensajes' 'chat_textarea chat_textarea chat_enviar';
    grid-template-columns: 80px auto 80px;
    grid-template-rows: 40px 50px auto 60px;
    background-color: white;
}

.agregar_persona {
    grid-area: agregar_persona;
    border-top-right-radius: 20px;
    color: var(--titulos);
    background-color: var(--principal);
}

.miembros {
    overflow-y: auto;
    grid-area: miembros;
    color: var(--links-menu);
    background-color: var(--principal);
}

.chat_nombre {
    grid-area: chat_nombre;
    background-color: var(--principal);
    color: var(--links-menu);
    font-size: 20px;
    padding-left: 24px;
}

.chat_imagen {
    grid-area: chat_imagen;
    color: var(--titulos);
    border-top-left-radius: 20px;
    background-color: var(--principal);
}

.chat_mensajes {
    grid-area: chat_mensajes;
    overflow: auto;
    height: 100%;
    min-height: 140px;
    max-height: -webkit-fill-available;
    max-height: -moz-available;
}

.chat_textarea {
    grid-area: chat_textarea;
}

.chat_enviar {
    grid-area: chat_enviar;
}

.chat_bloqueado_enviar {
    grid-area: chat_enviar;
    display: none;
    border-bottom-right-radius: 20px;
}

.chat_bloqueado {
    grid-area: chat_textarea;
    display: none;
    border-bottom-left-radius: 20px;
}

.layout_buscar {
    width: 100%;
    display: grid;
    grid-template: 'a1 b1';
    grid-template-columns: 240px auto;
    grid-template-rows: 1fr;
}

.msj_name {
    font-weight: normal;
    font-style: italic;
    color: black;
    font-size: 12px;
}

.msj_date {
    font-weight: normal;
    font-style: italic;
    color: black;
    font-size: 10px;
}


.filtros {
    width: 220px;
    /*background-color: red;*/
    border: 2px solid gray;
    grid-area: a1;
}

.tabla_alumno {
    grid-area: b1;
    border: 2px solid gray;
    /*background-color: blue;*/
}

.chat_menu {
    float: right;
    position: relative;
    background-color: #b1b1b1;
    right: 350px;
    top: 40px;
    width: 350px;
    margin-right: -350px;
    display: none;
    color: var(--texto);
}

    .chat_menu li {
        padding: 6px;
        text-align: center;
        padding-bottom: 22px;
        color: var(--texto_contraste);
        border: 1px solid #666;
        height: 35px;
    }

.editor_nombre_chat {
    border: none;
    text-align: -webkit-center;
    width: 100%;
}

.chat_menu li:hover {
    background-color: #ccc;
    cursor: pointer;
}

#chat_enviar {
    background-color: lightgray;
}

.emoji-wysiwyg-editor {
    background-color: lightgray;
}

.sin-margen {
    margin: 0px !important;
    padding: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
}


.button {
    box-shadow: none;
    margin: 3px;
    border-radius: 8px;
    background-color: #dedede;
}

    .button.is-info {
        box-shadow: none;
        color: var(--links-menu) !important;
    }

.variante1 {
    /*background-color: #082a6a;*/
    background-color: var(--principal);
    color: white;
}

    .variante1:hover {
        background-color: var(--principal) !important;
        color: #e0e0e0;
    }

.variante2 {
    /*background-color: #1a3d7a;*/
    background-color: var(--principal);
    color: white;
    opacity: 0.8;
}

    .variante2:hover {
        /*background-color: #1c4e9a !important;*/
        background-color: var(--principal) !important;
        color: #e0e0e0;
        opacity:1;
    }

.variante3 {
    /*background-color: #2c508a;*/
    background-color: var(--principal);
    color: white;
    opacity:0.6;
}

    .variante3:hover {
        /*background-color: #2e61aa !important;*/
        background-color: var(--principal) !important;
        opacity: 1;
        color: #e0e0e0;
    }

.variante4 {
    /*background-color: #3e639a;*/
    background-color: var(--principal) ;
    color: white;
    opacity:0.5;
}

    .variante4:hover {
        /*background-color: #4074ba !important;*/
        background-color: var(--principal) !important;
        opacity: 1;
        color: #e0e0e0;
    }

.variante5 {
    /*background-color: #5076aa;*/
    background-color: var(--principal);
    color: white;
    opacity:0.4;
}

    .variante5:hover {
        /*background-color: #5287ca !important;*/
        background-color: var(--principal) !important;
        opacity: 1;
        color: #e0e0e0;
    }

.variante6 {
    background-color: #6289ba;
    color: white;
}

    .variante6:hover {
        background-color: #649ada !important;
        color: #e0e0e0;
    }

.variante7 {
    background-color: #749cca;
    color: white;
}

    .variante7:hover {
        background-color: #76adea !important;
        color: #e0e0e0;
    }

.variante8 {
    background-color: #86afda;
    color: white;
}

    .variante8:hover {
        background-color: #88c0fa !important;
        color: #e0e0e0;
    }

.variante9 {
    background-color: #98c2ea;
    color: white;
}

    .variante9:hover {
        background-color: #9ad3fa !important;
        color: #e0e0e0;
    }

.variante10 {
    background-color: #aaaaaa;
    color: black;
}

    .variante10:hover {
        background-color: #bcbcbc !important;
        color: #333333;
    }


.e-rowcell {
    padding-bottom: 15px !important;
    padding-top: 15px !important;
    font-weight: bold !important;
}

.avatar {
    width: 40px;
    border-radius: 25%;
}

.content_div {
    padding: 10px;
}


.widget {
    cursor: move;
    padding: 1px;
    /*font-size: 20px;*/
    grid-row: span 1;
    grid-column: span 1;
    /*  border: 3px solid var(--border);*/
    box-shadow: #0000006e 3px 4px 2px 0px;
    background-color: #ffffff;
    overflow-y: hidden;
    color: var(--texto);
    border-bottom-right-radius: 35px;
    background-image: url(../../Content/images/backgroundCircle.png);
    background-size: 100px;
    background-repeat: no-repeat;
    background-position-y: bottom;
    border: 2px solid #ffffff;
    border-radius: 8px;
}

.widgetPagos {
    /*max-width: 380px;*/
    width: 285px;
    margin: 10px;
}

.flexContainer {
    width: 100%;
    display: flex;
    flex-flow: column;
    flex-direction: column;
    flex-wrap: wrap;
    flex-direction: row;
}

.cell_avatar {
    text-align: center !important;
    padding: 2px !important;
}

.menu_link {
    width: 96%;
    background-color: transparent;
    justify-content: left;
    border: none;
    box-shadow: none !important;
    border-radius: 0px;
    /*border: 2px solid #00000052;*/
    border-radius: 50px;
    padding-top: 5%;
    padding-bottom: 5%;
    font-weight: 100;
    margin-top: -3px !important;
}

    .menu_link:hover {
        color: var(--titulos) !important;
        background: var(--principal_hover);
        border-left: 3px solid var(--titulos);
    }

#menu {
}

.menu {
    color: white;
    font-size: 1rem;
}

.icon-title {
    font-size: 30px;
    margin-right: 20px;
}

.expand-icon {
    font-size: 2rem;
}

.divContraer {
    display: none;
    text-align: -webkit-right;
}

.onlyOnExpand {
    display: none;
}

.onlyOnexpanSpan {
    display: none;
    padding-left: 5px;
}

.NotOnlyOnExpanSpan i {
    position: absolute;
    right: 0px;
    top: 13px;
}

.onlyOnexpanSpan i {
    position: absolute;
    right: 0px;
    top: 13px;
}

.logo {
    height: 120px;
    margin-left: 5%;
    border-radius: 7px;
    padding: 7px;
}

.itemMenuAlineado {
    padding-left: 5%;
}

.itemAvatar {
    text-align: center;
    font-weight: 100;
}

    .itemAvatar img {
        border-radius: 50%;
        width: 50%;
    }

.large-icon {
    font-size: 13px;
}




.subMenu-Expanded {
    left: 240px !important;
}

.secundaria {
    padding-left: 20px;
}

#ContenedorDeMenus {
    background-color: var(--principal);
    border-top-right-radius: 40px;
}

    #ContenedorDeMenus::-webkit-scrollbar {
        /*display: none;*/
    }


.subMenu {
    background-color: var(--principal_var1);
    display: none;
    padding-left: 14px;
}


.floatMenu {
    display: block !important;
    position: fixed;
    background-color: var(--principal);
    left: 50px;
    margin-top: -50px;
    width: 270px;
    padding-left: 0px;
}



.Secundario {
    background-color: var(--principal_var6);
}

#menu_phone {
    border-bottom-right-radius: 33px;
    display: none;
    z-index: 1111;
}

#menu_phone_in_menu {
    display: none;
}


@media only screen and (max-width: 660px) {
    #menu {
        display: none;
    }

    #menu_phone_in_menu {
        display: block;
    }

    #menu_phone {
        background: var(--principal);
        display: block;
        position: fixed;
        width: 50px;
        color: var(--texto);
    }

        #menu_phone a {
            color: white !important;
        }

            #menu_phone a i {
            }

    .iconomenu {
        display: none;
    }
}

.TagsClases {
    float: right;
    position: sticky;
    margin-top: -194px;
}

.tagExamenes {
    background-color: #9b59b6;
    padding: 5px;
    padding-left: 10px;
    border-radius: 12px;
    color: white;
    margin: 3px;
}

.input, .textarea {
    border-radius: 6px !important;
    padding-left: 15px;
    background-color: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
}

input {
    max-width: 400px;
    z-index: 1 !important;
    background-color: transparent !important;
}

.tagTareas {
    background-color: #f39c12;
    padding: 5px;
    padding-left: 10px;
    border-radius: 12px;
    color: white;
    margin: 3px;
}

.e-select {
    border-radius: 20px;
    background: none !important;
    background-color: transparent;
}

select {
    border-radius: 8px;
    font-weight: bold !important;
    padding-left: 15px;
    background-color: transparent;
    border-top: none;
    border-left: none;
    border-right: none;
}

option {
    font-weight: bold !important;
    padding-left: 15px;
}

.e-in-wrap {
    border-radius: 8px !important;
    border-color: rgb(100, 100, 100) !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

.notification.is-info {
    background-color: #3498db;
}

.notification.is-danger {
    background-color: #e74c3c;
}

.notification.is-success {
    background-color: #1abc9c;
}

.file-cta {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}


.file-cta {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.file-name {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.changeDisponible, .change_No_Disponible {
    border-radius: 6px;
}



.zoom {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

    .zoom:hover {
        opacity: 0.7;
    }

/* The Modal (background) */
.modalImage {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
    margin: auto;
    display: block;
    /*width: 100%;
  max-width: 700px;*/
}

/* Caption of Modal Image */
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/* Add Animation */
.modal-content, #caption {
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale(0)
    }

    to {
        -webkit-transform: scale(1)
    }
}

@keyframes zoom {
    from {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}

/* The Close Button */
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

    .close:hover,
    .close:focus {
        color: #bbb;
        text-decoration: none;
        cursor: pointer;
    }

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px) {
    .modal-content {
        width: 100%;
    }
}




.ui-state-active {
    background: var(--principal) !important;
    color: var(--links-menu) !important;
}

    .ui-state-active p {
        background: var(--principal) !important;
        color: var(--links-menu) !important;
    }

/* Tooltip container */
.has-tooltip {
    /* position: relative;
    display: inline-block;*/
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

    /* Tooltip text */
    .has-tooltip .tooltiptext {
        visibility: hidden;
        width: 220px;
        background-color: black;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        /* Position the tooltip text - see examples below! */
        position: absolute;
        z-index: 1;
    }

    /* Show the tooltip text when you mouse over the tooltip container */
    .has-tooltip:hover .tooltiptext {
        visibility: visible;
    }

input:disabled:hover {
    cursor: wait !important;
}

.celda_calendario {
    height: 80px;
    padding: 10px;
}

.calendar_tag {
    background-color: var(--principal);
    width: 26px;
    height: 26px;
    border-radius: 50%;
}

#agenda_tools_min {
    display: none;
}

#agenda_Oferflow_tabla {
    display: block;
}

#layout_tools {
    align-items: center;
}

.top-tols-style a {
    color: var(--links-menu) !important;
}

/* ADAPTACIONES APP MOVIL MENOS DE 594 SE ACTIVA MENU MOVIL*/
@media only screen and (max-width: 594px) {
    #agenda_Oferflow_tabla {
        display: none;
    }

    #agenda_tools_min {
        display: block;
    }

    #body-content {
        margin-left: 0px !important;
    }

    .is-help {
        font-size: .7rem;
    }

    .body {
        font-size: .8rem;
    }

    body {
        font-size: .8rem;
    }

    .button, .input, .textarea, .select select, .file-cta, .file-name, .pagination-previous, .pagination-next, .pagination-link, .pagination-ellipsis, label, td, th {
        font-size: .8rem !important;
    }

    .calendar_tag {
        width: 14px;
        height: 14px;
    }

    .celda_calendario {
        height: 40px;
        width: 14.25%;
        padding: 5px !important;
    }

    #layout_tools {
        display: none !important;
    }

    .subtitle {
        font-size: 1rem !important;
    }

    .title {
        font-size: 1.3rem !important;
    }

    .breadcrumb {
        margin-top: -14px;
        padding-top: 0px;
    }

    .column_body {
        height: 111px;
    }

    .column_aula {
        display: none;
    }

    .column_activa {
        display: block !important;
    }

    .column_header {
        min-height: 50px !important;
    }

    #ContenedorDeMenus {
        background-color: var(--principal);
        border-top-right-radius: 0px;
    }

    #menuHead {
        background-color: var(--principal);
    }


    .itemAvatar {
        flex-direction: row-reverse;
        display: flex;
    }

    #bienvenido_menu {
        margin-top: 6px;
    }

    #img_perfil_menu {
        border-radius: 50%;
        width: 30%;
        margin-left: 10px;
        height: max-content;
    }

    .menu_link {
        padding-top: 10px;
        margin-top: 0px !important;
    }
    /*    @media only screen and (max-width: 594px){
        .buttonRetract {
            color: aliceblue;
        }
    }*/
    @media only screen and (max-width: 418px) {
        .layout_chat {
            grid-template-columns: 250px auto;
        }
    }

    .indicadorAbiertoOCerrado {
        top: 5px !important;
    }

    .floatMenu {
        /*left: 60px;
        width: 270px;*/
    }

    .subMenu-Expanded {
        left: 190px !important;
        width: 190px;
        padding-top: 10px;
    }

    /*  .body-content {
        margin-right: 5px !important;
    }*/
}

.modal-escoolkardex {
    display: none;
    padding-top: 75px;
}

.modal-escoolkardex-background {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    z-index: 50;
    padding: 0;
    box-sizing: border-box;
    background-color: rgba(0,0,0,0.75);
}

.modal-escoolkardex-card {
    width: 350px;
    max-height: calc(100vh - 40px);
    border: 0px;
    border-radius: 15px;
    background-color: white;
    /*    position: fixed;
    top: 3%;
    left: 30%;
    margin: -25px 0 0 -25px;*/
    z-index: 51;
}

.modal-card-head-escoolkardex,
.modal-card-foot-escoolkardex {
    align-items: center;
    background-color: whitesmoke;
    display: flex;
    flex-shrink: 0;
    justify-content: flex-start;
    padding: 20px;
    position: relative;
}


.modal-card-head-escoolkardex {
    border-bottom: 1px solid #dbdbdb;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}


.modal-card-foot-escoolkardex {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-top: 1px solid #dbdbdb;
}

    .modal-card-foot-escoolkardex .button:not(:last-child) {
        margin-right: 10px;
    }

.modal-card-body-escoolkardex {
    -webkit-overflow-scrolling: touch;
    background-color: white;
    flex-grow: 1;
    flex-shrink: 1;
    overflow: auto;
    padding: 20px;
}

.footer-escoolkardex {
    background-color: #fafafa;
    padding: 3rem 1.5rem 6rem;
}

.DivBotones {
    text-align: right;
}

@media only screen and (max-width: 600px) {
    .modal-escoolkardex-card {
        left: 27%;
    }
}

@media only screen and (max-width: 430px) {
    .modal-escoolkardex-card {
        left: 0%;
    }
}

@media only screen and (max-width: 380px) {
    .modal-escoolkardex-card {
        left: 0%;
    }
}

@media only screen and (max-width: 365px) {
    .modal-escoolkardex-card {
        width: 0px;
    }
}

.Submenu_link {
    width: 96%;
    background-color: transparent;
    justify-content: left;
    border: none;
    box-shadow: none !important;
    border-radius: 0px;
    border-radius: 50px;
    padding-top: 5%;
    padding-bottom: 5%;
    font-weight: 100;
    text-wrap: wrap;
    text-align: start;
}

    .Submenu_link:hover {
        color: var(--titulos) !important;
        background: var(--principal_hover);
        /*border-left: 3px solid var(--titulos);*/
    }

.menu_link_title {
    width: 96%;
    background-color: transparent;
    justify-content: left;
    border: none;
    box-shadow: none !important;
    border-radius: 0px;
    /*border: 2px solid #00000052;*/
    border-radius: 50px;
    padding-top: 5%;
    padding-bottom: 5%;
    font-weight: 100;
    margin-top: -3px !important;
}

.circulo {
    width: 40px;
    height: 40px;
    background-color: var(--principal_hover);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 15px;
    font-family: Arial, sans-serif;
    vertical-align: middle;
}

@media (max-width: 800px) {
    .e-grid.e-responsive .e-gridcontent td:before {
        text-wrap: wrap !important;
    }
}

td.e-selectionbackground {
    background: var(--principal) !important;
}

input.button.is-info {
    background-color: var(--principal) !important;
}

.box .min-box {
    border-bottom: 0.5px solid #8f939b;
}

.ui-widget-content {
    background-color: transparent !important;
}

input.button.is-etiqueta {
    background-color: var(--principal_var2) !important;
    color: white;
}