.preloader {
    position: fixed;
    z-index: 99999;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-size: auto;
    background-color: #FFFFFF;
    /*background-color: #202124;*/
    background-image: url(/siat/assets/img/GD.svg);
    background-image: url(/siat/ExResources/Img/LogoEntidad/7bb66bd0-8070-437f-8171-6ca6a2468c4e.png);
    /* background-image: url(/siat/ExResources/Img/LogoEntidad/Logo.png); */
    background-repeat: no-repeat;
    background-position: 50% 50%;
    opacity: 1;
}
/*@media (prefers-color-scheme: light) {
    .preloader {
        background-color: #FFFFFF;
    }
}*/
/*@media (prefers-color-scheme: dark) {
    .preloader {
        background-color: #505050;
    }
}*/
@media only screen and (max-width: 992px) {
    .page-wrapper .page-header {
        position: fixed;
    }
    ol.breadcrumb.m-0{
        display:none;
    }
    .subheader {
        margin-top: 37px;
    }
    /*footer.page-footer.stiky-bottom{
        display:none;
    }*/
}
.stiky-bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
}
.input-group-text {
    display: block;
    min-width: 150px;
    text-align: right;
}
.iconUpload {
    display: block;
    min-width: 40px !important;
    text-align: right;
}
.swal2-container {
    z-index: 5000;
}
#MDL_CapturarResultado_divInterno > div > div.modal-body > div:nth-child(3) > form > bootstrap-decorator > div > div {
    height: 350px !important;
}
.dataTables_empty {
    color: var(--theme-primary);
    font-size: 1rem;
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
}
.dataTables_wrapper .dataTables_filter input {
    border-radius: 5px !important;
}
.dataTables_wrapper .dataTables_filter input {
    border-radius: 5px !important;
}
.form-control:focus {
    border-color: var(--theme-primary) !important;
}
.panel-tag {
    padding: 1rem 1rem;
    margin-bottom: 2rem;
    border-left: 3px solid var(--theme-primary);
    background: rgba(var(--theme-rgb-primary),.1);
    opacity: 0.8;
    font-weight: 400;
    font-size: 0.875rem;
    border-radius: 0px 8px 8px 0px;
}

.mod-skin-dark:not(.mod-skin-light) .panel-tag {
    background: rgba(29, 201, 183, 0.15);
    background: rgba(var(--theme-rgb-primary), 0.15);
    color: #ffffff;
}

.swal2-icon.swal2-question {
    border-color: var(--theme-primary-200);
    color: var(--theme-primary-600);
}
.header-btn[data-class='mobile-nav-on'] {
    border-color: var(--theme-primary-500);
    background-color: var(--theme-primary-900);
    background-image: -webkit-gradient(linear, left bottom, left top, from(var(--theme-primary-500)), to(var(--theme-primary-900)));
    background-image: linear-gradient(to top, var(--theme-primary-500), var(--theme-primary-900));
    color: #fff;
    width: 3.875rem;
}

.btn-info {
    color: #fff;
    background-color: var(--theme-primary-500);
    border-color: var(--theme-primary-500);
    -webkit-box-shadow: 0 2px 6px 0 rgba(var(--theme-rgb-primary), 0.5);
    box-shadow: 0 2px 6px 0 rgba(var(--theme-rgb-primary), 0.5);
}

    .btn-info:hover {
        color: #fff;
        background-color: var(--theme-primary-900);
        border-color: var(--theme-primary-900);
    }

.swal2-styled.swal2-confirm {
    border: 0;
    border-radius: 0.25em;
    background: initial;
    background-color: var(--theme-primary-600);
    color: #fff;
    font-size: 0.875em;
}
.vertical-alignment-helper {
    display: table;
    height: 100%;
    width: 100%;
    pointer-events: none; /* This makes sure that we can still click outside of the modal to close it */
}
.vertical-alignment-helper .vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events: none;
}
.vertical-align-center .modal-content {
        /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
        width: inherit;
        max-width: inherit; /* For Bootstrap 4 - to avoid the modal window stretching full width */
        height: inherit;
        /* To center horizontally */
        margin: 0 auto;
        pointer-events: all;
}
.igt-icon {
    min-width: 30px;
    text-align: center;
    cursor: pointer;
}
.noselect {
    /*cursor: default;*/
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
    supported by Chrome, Edge, Opera and Firefox */
}

div#hdr-Opcionales {
    cursor:pointer;
}

#carouselLogin.carousel.pointer-event {
    /* -ms-touch-action: pan-y;
    pointer-events: none;*/
    -ms-touch-action: none;
    touch-action: none;

}
.page-sidebar {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 1;
}
.page-header {
    padding: 0 2rem;
    z-index: 10;
}
.shortcut-menu {
    z-index: 20;
}
html body video {
    position: absolute;
    overflow-x: hidden;
    z-index: 30;
    max-width: 100%;
    min-width: 100%;
    min-height: 100%;
    background: url('/siat/assets/template/img/backgrounds/clouds.png') no-repeat;
    left: 0px;
    top: 0px;
    width: 100vw;
    height: 100vh;
    background-size: cover;
    background-color: #FFFFFF;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    opacity: 1;
    -webkit-transition: 1s opacity;
    transition: 1s opacity;
}
video#bgvid {
    min-width: max-content;
    contain: strict;
    position: fixed;
    overflow: hidden;
}

/*#questioninfo:hover {
    background-color: yellow;
}*/
#questioninfo + #dropdown-menu {
    display: block;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.9s ease-in;
}
#questioninfo:hover + #dropdown-menu {
    display: block;
    visibility: visible;
    opacity: 1;
}
#questioninfo + #dropdown-toggle:active {
    /*Without this, clicking will make it sticky*/
    pointer-events: none;
}

.swal-folio {
    justify-content: flex-start;
    width: 40em;
    max-height: 500px;
    overflow-y: hidden;
}
#questioninfo {
    color: red;
    cursor: pointer;
    text-decoration: underline blue;
}

/*https://www.scriptol.com/css/tooltip.php */
.tooltipe {
    text-decoration: underline !important;
    position: relative;
    color: red !important;
}

    .tooltipe > span {
        display: none;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        color: black;
        background: white;
    }

        .tooltipe > span > img {
            float: left;
            width: 70px;
            height: auto;
            margin: 0px 500vw 200vh 0;
        }
        .tooltipe:hover > span {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 9999999;
            width: auto;
            max-width: 40px;
            min-height: 50px;
            max-height: 50px;
            border: 1px solid black;
            margin-top: 12px;
            margin-left: 32px;
            overflow: hidden;
            padding: 8px;
        }


.tooltipImg {
    text-decoration: underline !important;
    position: relative;
    cursor:help;
    color: red !important;
}
.tooltipImg span {
    display: none;
    
}
.tooltipImg:hover span {
    /*top: -11vh;*/
    /*left: -6vw;*/
    top:16px;
    left:-55px;
    display: block;
    position:absolute;
    /*float: left;*/
    z-index: 999;
    background: white;
    overflow: hidden;
    min-width: 70px;
    min-height: 72px;
    max-height: 82px;
    width: 4vw;
    height: 10vh;
    border-radius: 5px;
    border: 1px solid black;
}

.tooltipImg:hover span img {
    min-width: 70px;
    width: 7vw;
    position: relative;
    border-radius: 6px;
}
.rpt-header {
    height: 10px;
    cursor:pointer;
    
}
#MDL_Mail-header {
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    padding: .5rem 1.25rem !important;
}
.modal.show .modal-dialog {
    -webkit-transform: none;
    transform: none;
    /*height: 95vh;*/
}
#iframehtml {
    border-width: 0;
    width: 100%;
    /*height: 58vh;*/
    /*height: 70vh;*/
    /*height:fit-content;*/
    height: -webkit-fill-available;
}
.containerframe {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-top: 1px dotted #000000;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
}
.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: none;
}

.note-editable[contenteditable=false] {
    /*background-color: hsla(0,0%,50.2%,.11); */
    background-color: white !important;
}

.first {
    font-size: 22px;
    color: var(--theme-info-500);
    opacity: 1;
    transition: 0.3s;
}
.nth {
    font-size: 22px;
    color: var(--theme-info-500);
    opacity: 0;
    transition: 0.3s;
}

#span-mail-icon:hover > i.first{
    opacity: 0;
}

#span-mail-icon:hover > i.nth {
    opacity: 1;
    transform: scale(1.07);
    transition: 0.3s;
}

#span-mail-icon:nth-child(2) {
    font-size: 22px;
    color: var(--theme-info-500);
    opacity: 1;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    border: 1px solid transparent;
    background: transparent;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    outline: none;
    background-color: transparent;
    box-shadow: inset 0 0 0 transparent;
}
table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
    background-color: transparent;
}
table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
    background-color: transparent;
}
table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
    background-color: rgb(var(--theme-rgb-primary),.05);
}
table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover {
    background-color: rgb(var(--theme-rgb-primary),.2)
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.5em;
    padding: 0.3em .5em; 
    padding: inherit; 
    margin-left: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    /*cursor: hand;*/
    color: #333 !important;
    border: 1px solid transparent;
    border-radius: 2px;
}
.dataTables_wrapper .dataTables_paginate .pagination .page-item > .page-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 1.85rem;
    min-width: 1.85rem;
    padding: 0.5rem;
    font-size: 0.825rem;
    line-height: 0.825rem;
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before, table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
    /*color: var(--theme-primary);
    color: var(--warning);*/
    color: var(--theme-danger);
    font-size: 15px;
}

/*
.nav-menu li.active > a {
    color: white;
    background-color: rgba(255, 255, 255, 0.04);
    -webkit-box-shadow: inset 3px 0 0 #886ab5;
    box-shadow: inset 3px 0 0 #886ab5;
    font-weight: 400;
}
.nav-menu li.active:not(.open) > a:before {
    content: '\f413';
    font-family: 'nextgen-icons';
    position: absolute;
    top: calc(50% - 5px);
    right: 11px;
    font-size: 7px;
    height: 10px;
    width: auto;
    color: #24b3a4;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
    */
/*.nav-menu li.active a b em:before {
    content: "\f106";
    font-family: 'nextgen-icons';
    color: yellow;
    font-size: 22px;
}*/
/* 
.nav-menu li.open.active a > b, .nav-menu li.active a > b {
    transform: rotate(180deg);
    background-color: YELLOW;
}
*/
div#MDL_NuevoDestinatario {
    height: auto;
}

#scaled-frame {
    width: 1000px;
    height: 2000px;
    border: 0px;
}

#scaled-frame{
    zoom: 0.75;
    -moz-transform: scale(0.75);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.75);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.75);
    -webkit-transform-origin: 0 0;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    #scaled-frame {
        zoom: 1;
    }
}
.close-white {
    color: #ccc;
    text-shadow: none;
}
.close-white:not(:disabled):not(.disabled):hover, .close-white:not(:disabled):not(.disabled):focus {
    opacity: 1;
}
/*.tableYear {
    position: relative;
    z-index: 998;
    top: -10px;
    left: -520px;
    top: -1vh;
    left: -27vw;
}
.tableMonth {
    position: relative;
    z-index: 999;
    top: 0;
    left: 0;
}*/

/*https://codepen.io/OscarGarcia/pen/wGYwRy*/

/*hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}*/


.mailbox-box, .mailbox-subject, mailbox-fwds {
    text-align: center;
    vertical-align: middle;

}
td.mailbox-box, td.mailbox-name.ng-binding, td.mailbox-subject, td.mailbox-fwds, td.mailbox-date.ng-binding {
    vertical-align: middle;
}



/*icons password*/
.input-group-append.clean
{
    margin:0;
}
.mod-skin-dark:not(.mod-skin-light) .bg-white:not([class*='popover']) {
/*    background-color: #383b44 !important;
    color: #ffffff;*/
    border-radius: 5px;
}
/*
    .input-group-append {
    background-color:aqua!important;
    width:22px;
}
    .input-group-append:after {
    display: flex;
    align-items: center;
    padding:1px;
    margin-left:2px;
    font-family: "Font Awesome\ 5 Free";
    font-weight: 400;
    content: "\f06e";
}
    .input-group-append:active:after {
        background-color:red!important;
        display: flex;
        align-items: center;
        font-family: "Font Awesome\ 5 Free";
        font-weight: 400;
        content: "\f070";
    }
    <div class="form-group">
    <label class="form-label">Password</label>
    <div class="input-group">
        <div class="form-row row align-items-center">
            <div class="col-12 col-lg-12">
                <div class="input-group bg-white shadow-inset-2">
                    <div class="input-group-prepend">
                        <span class="input-group-text igt-icon bg-transparent border-right-0">
                            <i class="fal fa-key"></i>
                        </span>
                    </div>
                    <input id="passworddemo" ng-model="LCtrl.USR.aPW" type="password" class="form-control border-left-0 border-right-0 bg-transparent pl-0 ng-valid ng-not-empty ng-dirty ng-valid-parse ng-touched noselect" placeholder="Contrase�a Actual" value="">
                    <div class="input-group-append"></div>
                </div>
            </div>
        </div>
    </div>
</div>
*/
/*input#pass1:invalid:focus {*/
    /*border-bottom: 1px solid red !important;*/
    /*color: var(--theme-warning-300);
    
}*/