@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

/*html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

}*/
/*@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('../fonts/glyphicons-halflings-regular.eot');
    src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg') format('svg');
    
}*/
html, body, #background {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    /*font-family: 'Glyphicons Halflings', Helvetica, Arial, sans-serif;*/
    /*width: 100vw;*/
    /*font-size: 1.0em;*/
    width: 100%;
    min-height: 100vh;
    background-color: #f3f3f4;
}

/*html {
    background-color: #000;
}*/

/*.main > footer {
    height: 3rem;
    max-height: 3rem;
    background-color: #f5f5f5;
    text-align: center;
}

.main > .content {
    height: calc(100vh - 3rem);
    height: calc(100vh - 3rem);
    overflow-y: auto;
}*/
/*.main > .table {
    height: calc(100vh - 3rem);
    height: calc(100vh - 3rem);
    overflow-y: auto;
}*/


/*@media (min-width: 641px) {
    .sidebar {
        max-height: 100vh;
        overflow-y: auto;
    }
}*/


a, .btn-link {
    color: #0366d6;
}

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

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default,
.btn-default:active:focus,
.btn-default:active:hover,
.btn-default.active:hover,
.btn-default.active:focus {
    color: inherit;
    border: 1px solid #d2d2d2;
}

.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) inset;
}

    .btn-default.disabled,
    .btn-default.disabled:hover,
    .btn-default.disabled:focus,
    .btn-default.disabled:active,
    .btn-default.disabled.active,
    .btn-default[disabled],
    .btn-default[disabled]:hover,
    .btn-default[disabled]:focus,
    .btn-default[disabled]:active,
    .btn-default.active[disabled],
    fieldset[disabled] .btn-default,
    fieldset[disabled] .btn-default:hover,
    fieldset[disabled] .btn-default:focus,
    fieldset[disabled] .btn-default:active,
    fieldset[disabled] .btn-default.active {
        color: #cacaca;
    }

/* BASIC */

a {
    color: #92badd;
    display: inline-block;
    text-decoration: none;
    font-weight: 400;
}
/*a:hover {
    color: #92badd;
    display: inline-block;
    text-decoration: underline;
    font-weight: 400;
}*/
.ch_underline:hover {
    text-decoration: underline;
}

.reset-password {
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    display: inline-block;
    margin: 40px 8px 10px 8px;
    color: #cccccc;
}

.resources-section {
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
    margin: 1px 8px 1px 8px;
    color: #cccccc;
}

.card_pos {
    margin-top: 112px;
    margin-left: 25px;
}



/* STRUCTURE */

.wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    min-height: 100%;
    padding: 20px;
}
.p-text-center {
    text-align: center;
}



/* TABS */

h2.inactive {
    color: #cccccc;
}

h2.active {
    color: #0d0d0d;
    border-bottom: 2px solid #5fbae9;
}



/* FORM TYPOGRAPHY*/

input[type=button], input[type=submit], input[type=reset] {
    background-color: #56baed;
    border: none;
    color: white;
    padding: 15px 80px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    text-transform: uppercase;
    font-size: 13px;
    -webkit-box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
    box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    margin: 5px 20px 40px 20px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
        background-color: #39ace7;
    }

    input[type=button]:active, input[type=submit]:active, input[type=reset]:active {
        -moz-transform: scale(0.95);
        -webkit-transform: scale(0.95);
        -o-transform: scale(0.95);
        -ms-transform: scale(0.95);
        transform: scale(0.95);
    }


input[type=text2] {
    background-color: #f6f6f6;
    border: none;
    color: #0d0d0d;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 5px;
    width: 85%;
    border: 2px solid #f6f6f6;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
}
/*ADDED by OSCAR*/
.gray-bg,
.bg-muted {
    background-color: #f3f3f4;
}
/* COLORS */
.text-navy {
    color: #1ab394;
}

.text-primary {
    color: inherit;
}

.text-success {
    color: #1c84c6;
}

.text-info {
    color: #23c6c8;
}

.text-warning {
    color: #f8ac59;
}

.text-danger {
    color: #ed5565;
}

.text-muted {
    color: #888888;
}

.text-white {
    color: #ffffff;
}

/*TABLES*/

.table-responsive {
    /*display: block;*/
    overflow-y: auto;
    max-height: 712px;
    /*overflow-y: auto;*/
    /*max-height: 426px;*/
}

.table > thead > tr > th {
    border-bottom: 1px solid #DDDDDD;
    vertical-align: bottom;
}


.fixedHead table thead th {
    font-size: 16px;
    position: sticky;
    top: -1px;
    z-index: 1;
}


table tbody td {
    border-bottom: 1px solid
}
table tr:hover {
    /*background-color: #f00;*/
    cursor: pointer;
}

/* Just common table stuff. Really. */
.tableFixHead {
    overflow: auto;
    height: 750px;
}
/*Providing thead color*/
th {
    /*background-color: #EEEEEE;*/
    background:#eeeeee;
}


th .aligner {
    display: flex;
    align-items: center;
}

.input-login {
    background-color: #f6f6f6;
    border: none;
    color: #0d0d0d;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 5px;
    width: 85%;
    border: 2px solid #f6f6f6;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
}

input[type=password_test] {
    background-color: #f6f6f6;
    border: none;
    color: #0d0d0d;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 5px;
    width: 85%;
    border: 2px solid #f6f6f6;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
}

.password-container,
.password-confirmation-container {
    /*width: 450px;*/
    width: auto;
    position: relative;
}

    .password-container input[type="password"],
    .password-container input[type="text"],
    .password-confirmation-container input[type="password"],
    .password-confirmation-container input[type="text"] {
        background-color: #f6f6f6;
        width: 85%;
        border: none;
        color: #0d0d0d;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: 5px;
        width: 85%;
        border: 2px solid #f6f6f6;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        /*padding: 12px 36px 12px 12px;*/
        /*box-sizing: border-box;*/
    }

.fa-eye {
    position: absolute;
    font-size: 20px;
    top: 30%;
    right: 12%;
    cursor: pointer;
    color: lightgray;
}

.e-input-eye:before {
    content: '\e345';
    font-family: e-icons;
    font-size: 13px;
}

/* ANIMATIONS */

/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
    0%

{
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
}

100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
}

}

@keyframes fadeInDown {
    0%

{
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
}

100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
}

}

/* Simple CSS3 Fade-in Animation */
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fadeIn {
    opacity: 0;
    -webkit-animation: fadeIn ease-in 1;
    -moz-animation: fadeIn ease-in 1;
    animation: fadeIn ease-in 1;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    animation-duration: 1s;
}

    .fadeIn.first {
        -webkit-animation-delay: 0.4s;
        -moz-animation-delay: 0.4s;
        animation-delay: 0.4s;
    }

    .fadeIn.second {
        -webkit-animation-delay: 0.6s;
        -moz-animation-delay: 0.6s;
        animation-delay: 0.6s;
    }

    .fadeIn.third {
        -webkit-animation-delay: 0.8s;
        -moz-animation-delay: 0.8s;
        animation-delay: 0.8s;
    }

    .fadeIn.fourth {
        -webkit-animation-delay: 1s;
        -moz-animation-delay: 1s;
        animation-delay: 1s;
    }

/* Simple CSS3 Fade-in Animation */
.underlineHover:after {
    display: block;
    left: 0;
    bottom: -10px;
    width: 0;
    height: 2px;
    background-color: #56baed;
    content: "";
    transition: width 0.2s;
}

.underlineHover:hover {
    color: #0d0d0d;
}

    .underlineHover:hover:after {
        width: 100%;
    }



/* OTHERS */

*:focus {
    outline: none;
}

#icon {
    width: 60%;
}

.icon-xs {
    width: 33px;
}

.icon-sm {
    width: 66px;
}

.icon-lg {
    width: 100px;
}

.icon-test {
    width: 100px;
    height: 100px;
}

.td_table {
    text-align: right;
}

.icon-space {
    display: inline-block;
    vertical-align: top;
    position: relative;
    padding: 6px;
    margin: 4px;
    top: -10px;
    /*top: -15px;*/
}

.icon-below_space {
    padding: 8px;
    margin: 6px;
    left: 35px;
}

.lenguage_space {
    position: relative;
    left: 48px;
}

.demo-text {
    clear: left;
    text-align: right;
    vertical-align: top;
    line-height: 25px;
    font-weight: bold;
}

.def-text {
    line-height: 25px;
    font-weight: bold;
    font-size: 1.1rem;
}

span.glyphicon {
    display: inline-block;
    vertical-align: top;
}

.btn-info {
    background-color: #23c6c8;
    border-color: #23c6c8;
    color: #FFFFFF;
}

    .btn-info:hover,
    .btn-info:focus,
    .btn-info:active,
    .btn-info.active,
    .open .dropdown-toggle.btn-info,
    .btn-info:active:focus,
    .btn-info:active:hover,
    .btn-info.active:hover,
    .btn-info.active:focus {
        background-color: #21b9bb;
        border-color: #21b9bb;
        color: #FFFFFF;
    }

    .btn-info:active,
    .btn-info.active,
    .open .dropdown-toggle.btn-info {
        background-image: none;
    }

        .btn-info.disabled,
        .btn-info.disabled:hover,
        .btn-info.disabled:focus,
        .btn-info.disabled:active,
        .btn-info.disabled.active,
        .btn-info[disabled],
        .btn-info[disabled]:hover,
        .btn-info[disabled]:focus,
        .btn-info[disabled]:active,
        .btn-info.active[disabled],
        fieldset[disabled] .btn-info,
        fieldset[disabled] .btn-info:hover,
        fieldset[disabled] .btn-info:focus,
        fieldset[disabled] .btn-info:active,
        fieldset[disabled] .btn-info.active {
            background-color: #26d7d9;
            border-color: #26d7d9;
        }

.landing-page .btn-primary.btn-outline:hover,
.landing-page .btn-success.btn-outline:hover,
.landing-page .btn-info.btn-outline:hover,
.landing-page .btn-warning.btn-outline:hover,
.landing-page .btn-danger.btn-outline:hover {
    color: #fff;
}

.btn-success {
    background-color: #1c84c6;
    border-color: #1c84c6;
    color: #FFFFFF;
}
/* FONT STYLE */
.fw-200 {
    font-weight: 200 !important;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.fw-800 {
    font-weight: 800 !important;
}

.fsize-8 {
    font-size: 8px !important;
}

.fsize-10 {
    font-size: 10px !important;
}

.fsize-12 {
    font-size: 12px !important;
}

.fsize-14 {
    font-size: 14px !important;
}

.fsize-16 {
    font-size: 16px !important;
}

.fsize-18 {
    font-size: 18px !important;
}

.fsize-20 {
    font-size: 20px !important;
}

.fsize-22 {
    font-size: 22px !important;
}

.fsize-24 {
    font-size: 24px !important;
}

.fsize-28 {
    font-size: 28px !important;
}

.fsize-40 {
    font-size: 40px !important;
}

.fsize-48 {
    font-size: 48px !important;
}

.fsize-75 {
    font-size: 75px !important;
}

.fsize-100 {
    font-size: 100px !important;
}

.fsize-140 {
    font-size: 140px !important;
}
/* MARGINS & PADDINGS */
.p-xs {
    padding: 10px;
}

.p-t-xxs {
    padding-top: 5px;
}

.p-l-xs {
    padding-left: 5px !important;
}

.text-center {
    text-align: center !important;
}

.tex-justify {
    text-align: justify !important;
}
/* MARGINS & PADDINGS */
.p-xxs {
    padding: 5px;
}

.p-xs {
    padding: 10px;
}

.p-sm {
    padding: 15px;
}

.p-m {
    padding: 20px;
}

.p-md {
    padding: 25px;
}

.p-lg {
    padding: 30px;
}

.p-xl {
    padding: 40px;
}

.p-xxl {
    padding: 50px;
}

.p-w-xs {
    padding: 0 10px;
}

.p-w-sm {
    padding: 0 15px;
}

.p-w-m {
    padding: 0 20px;
}

.p-w-md {
    padding: 0 25px;
}

.p-w-lg {
    padding: 0 30px;
}

.p-w-xl {
    padding: 0 40px;
}

.p-h-xs {
    padding: 10px 0;
}

.p-h-sm {
    padding: 15px 0;
}

.p-h-m {
    padding: 20px 0;
}

.p-h-md {
    padding: 25px 0;
}

.p-h-lg {
    padding: 30px 0;
}

.p-h-xl {
    padding: 40px 0;
}

.m-xxs {
    margin: 2px 4px;
}

.m {
    margin: 15px;
}

.m-xs {
    margin: 5px;
}

.m-sm {
    margin: 10px;
}

.m-md {
    margin: 20px;
}

.m-lg {
    margin: 30px;
}

.m-xl {
    margin: 50px;
}

.m-n {
    margin: 0 !important;
}

.m-l-none {
    margin-left: 0;
}

.m-l-xs {
    margin-left: 5px;
}

.m-l-sm {
    margin-left: 10px;
}

.m-l {
    margin-left: 15px;
}

.m-l-md {
    margin-left: 20px;
}

.m-l-lg {
    margin-left: 30px;
}

.m-l-xl {
    margin-left: 40px;
}

.m-l-xxl {
    margin-left: 50px;
}
.m-l-xxxl {
    margin-left: 60px;
}
.m-l-xxlg {
    margin-left: 70px;
}

.m-l-n-xxs {
    margin-left: -1px;
}

.m-l-n-xs {
    margin-left: -5px;
}

.m-l-n-sm {
    margin-left: -10px;
}

.m-l-n {
    margin-left: -15px;
}

.m-l-n-md {
    margin-left: -20px;
}

.m-l-n-lg {
    margin-left: -30px;
}

.m-l-n-xl {
    margin-left: -40px;
}

.m-t-none {
    margin-top: 0;
}

.m-t-xxs {
    margin-top: 1px;
}

.m-t-xs {
    margin-top: 5px;
}

.m-t-sm {
    margin-top: 10px;
}

.m-t {
    margin-top: 15px;
}

.m-t-md {
    margin-top: 20px;
}

.m-t-lg {
    margin-top: 30px;
}

.m-t-xl {
    margin-top: 40px;
}

.m-t-xxl {
    margin-top: 50px;
}

.m-t-n-xxs {
    margin-top: -1px;
}

.m-t-n-xs {
    margin-top: -5px;
}

.m-t-n-sm {
    margin-top: -10px;
}

.m-t-n {
    margin-top: -15px;
}

.m-t-n-md {
    margin-top: -20px;
}

.m-t-n-lg {
    margin-top: -30px;
}

.m-t-n-xl {
    margin-top: -40px;
}

.m-r-none {
    margin-right: 0;
}

.m-r-xxs {
    margin-right: 1px;
}

.m-r-xs {
    margin-right: 5px;
}

.m-r-sm {
    margin-right: 10px;
}

.m-r {
    margin-right: 15px;
}

.m-r-md {
    margin-right: 20px;
}

.m-r-lg {
    margin-right: 30px;
}

.m-r-xl {
    margin-right: 40px;
}

.m-r-n-xxs {
    margin-right: -1px;
}

.m-r-n-xs {
    margin-right: -5px;
}

.m-r-n-sm {
    margin-right: -10px;
}

.m-r-n {
    margin-right: -15px;
}

.m-r-n-md {
    margin-right: -20px;
}

.m-r-n-lg {
    margin-right: -30px;
}

.m-r-n-xl {
    margin-right: -40px;
}

.m-b-none {
    margin-bottom: 0;
}

.m-b-xxs {
    margin-bottom: 1px;
}

.m-b-xs {
    margin-bottom: 5px;
}

.m-b-sm {
    margin-bottom: 10px;
}

.m-b {
    margin-bottom: 15px;
}

.m-b-md {
    margin-bottom: 20px;
}

.m-b-lg {
    margin-bottom: 30px;
}

.m-b-xl {
    margin-bottom: 40px;
}

.m-b-n-xxs {
    margin-bottom: -1px;
}

.m-b-n-xs {
    margin-bottom: -5px;
}

.m-b-n-sm {
    margin-bottom: -10px;
}

.m-b-n {
    margin-bottom: -15px;
}

.m-b-n-md {
    margin-bottom: -20px;
}

.m-b-n-lg {
    margin-bottom: -30px;
}

.m-b-n-xl {
    margin-bottom: -40px;
}

.space-15 {
    margin: 15px 0;
}

.space-20 {
    margin: 20px 0;
}

.space-25 {
    margin: 25px 0;
}

.space-30 {
    margin: 30px 0;
}

.img-sm {
    width: 32px;
    height: 32px;
}

.img-md {
    width: 64px;
    height: 64px;
}

.img-lg {
    width: 96px;
    height: 96px;
}

.b-r-xs {
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}

.b-r-sm {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.b-r-md {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.b-r-lg {
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}

.b-r-xl {
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
}

.panel-body {
    padding: 15px;
}

.button_right_align {
    float: right;
    margin-right: 30px;
}

overlay {
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    display: none;
    background: rgba(0,0,0,0.6);
}

.cv-spinner {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #2e93e6 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
    top: 40%;
    left: 55%;
    position: absolute;
    /*position:fixed;*/
}

@keyframes sp-anime {
    100% {
        transform: rotate(360deg);
    }
}

.is-hide {
    display: none;
}

::-ms-reveal {
    display: none;
}

/* MARGINS - PADDINGS */
.p-n {
    padding: 0 !important;
}

.p-xxx-s {
    padding: 1px;
}

.p-xxxs {
    padding: 3px;
}

.p-xxxs-i {
    padding: 3px !important;
}

.p-xxs-i {
    padding: 5px !important;
}

.p-xs-i {
    padding: 10px !important;
}

.p-sm-i {
    padding: 15px !important;
}

.p-t-n {
    padding-top: 0 !important;
}

.p-t-xxs {
    padding-top: 5px;
}

.p-t-xs {
    padding-top: 10px;
}

.p-t-sm {
    padding-top: 15px;
}

.p-t-md {
    padding-top: 20px;
}

.p-t-l {
    padding-top: 30px;
}

.p-t-xl {
    padding-top: 40px;
}

.p-t-xxl {
    padding-top: 50px;
}

.p-t-x-xl {
    padding-top: 60px;
}

.p-r-n {
    padding-right: 0 !important;
}

.p-r-xxs {
    padding-right: 5px !important;
}

.p-r-sm {
    padding-right: 10px !important;
}

.p-r {
    padding-right: 15px !important;
}

.p-r-md {
    padding-right: 20px !important;
}

.p-r-lg {
    padding-right: 30px !important;
}

.p-r-xl {
    padding-right: 40px;
}

.p-b-n {
    padding-bottom: 0 !important;
}

.p-b-xs {
    padding-bottom: 10px;
}

.p-b-xxxs {
    padding-bottom: 2px;
}

.p-b-xxs {
    padding-bottom: 4px;
}

.p-b-sm {
    padding-bottom: 10px;
}

.p-b-md {
    padding-bottom: 20px;
}

.p-b-lg {
    padding-bottom: 30px;
}

.p-b-xl {
    padding-bottom: 40px;
}

.p-b-xxl {
    padding-bottom: 50px;
}

.p-b-xxxl {
    padding-bottom: 60px;
}

.p-l-n {
    padding-left: 0 !important;
}

.p-l-xxs {
    padding-left: 1px !important;
}

.p-l-xs {
    padding-left: 5px !important;
}

.p-l-sm {
    padding-left: 10px !important;
}

.p-l {
    padding-left: 15px !important;
}

.p-l-md {
    padding-left: 20px !important;
}

.p-l-lg {
    padding-left: 30px !important;
}

.p-tb-n {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.p-tb-sm {
    padding-bottom: 15px !important;
    padding-top: 15px !important;
}

.p-tb-xxs-i {
    padding-bottom: 5px !important;
    padding-top: 5px !important;
}

.p-lr-n {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.p-w-n {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.p-w-xxs-i {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.m-tb-none {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}

.m-xxs-i {
    margin: 2px !important;
}

.m-xs-i {
    margin: 5px !important;
}

.m-center {
    margin: 0 auto;
}

.space-10 {
    margin: 10px 0;
}

.xs-p-w-lg {
    padding: 0 10px;
}

.empty-message-title {
    color: #e6e6e6;
    font-size: 60px;
    font-weight: 800;
    letter-spacing: -4px;
    margin-bottom: 0;
}

.empty-message-desc {
    color: #e6e6e6;
    font-size: 30px;
    font-weight: 700;
}

@media (min-width: 768px) {
    html {
        font-size:14px;
    }
    .badge {
        font-size:11px;
    }
    .pull-item-lr {
        float: left !important;
    }

    .move-text-lr {
        text-align: left;
    }

    .empty-message-title {
        font-size: 75px;
        letter-spacing: -5px;
    }

    .empty-message-desc {
        font-size: 30px
    }

    .footable-filtering-search .input-group .input-group-btn {
        width: 1%;
    }
}

@media (min-width: 992px) {

    html {
        font-size: 14px;
    }
    .pull-item-lr {
        float: left !important;
    }

    .md-text-left {
        text-align: left;
    }

    .md-text-right {
        text-align: right;
    }

    .lg-m-n {
        margin: 0px !important;
    }

    .xs-p-w-lg {
        padding: 0 30px;
    }

    .empty-message-title {
        font-size: 90px;
        letter-spacing: -8px;
    }

    .empty-message-desc {
        font-size: 35px
    }
}

@media (min-width: 1200px) {
    html {
        font-size: 15px;
    }
    .pull-item-lr {
        float: right !important;
    }
}

@media (min-width:1500px) {
    html {
        font-size: 16px;
    }
    .pull-item-lr {
        float: right !important;
    }

    .move-text-lr {
        text-align: right;
    }

    .empty-message-title {
        font-size: 100px;
    }

    .empty-message-desc {
        font-size: 40px;
    }
}


.tabs-container .nav-tabs > li.float-left {
    float: left !important;
}
/* MARGINS - PADDINGS */
.text_align_center {
    text-align: center;
}

/* Adding this section in order to split up the screen in two sections */
.container_split {
    display: grid;
    grid-template-columns: 0.65fr 0.35fr;
    /*height: 100vh;*/
    /* Puedes limitar la anchura */
    /*max-width: 1900px;*/
    max-width: 100%;
    /*max-width: max-content;*/
}

.container__item--content {
    /*background-color: blue;*/
}

.container__item--sidebar {
    /* background-color: #0080d4;*/
}

.container__item--content,
.container__item--sidebar {
    display: flex;
    justify-content: center;
    align-items: center;
}

.card_scroll {
    max-height: 675px;
    height:672px;
   /* max-height: 712px;*/
    overflow-y: auto;
}
/* Style the buttons that are used to open and close the accordion panel */
.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
}

    /* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
    .active, .accordion:hover {
        background-color: #ccc;
    }

/* Style the accordion panel. Note: hidden by default */
.panel {
    padding: 0 18px;
    background-color: white;
    display: none;
    overflow: hidden;
}

.tooltip {
    z-index: 9999 !important;
}
/* TOOLTIPS */
.tooltip-inner {
    background-color: #2F4050;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #2F4050;
}

.tooltip.right .tooltip-arrow {
    border-right-color: #2F4050;
}

.tooltip.bottom .tooltip-arrow {
    border-bottom-color: #2F4050;
}

.tooltip.left .tooltip-arrow {
    border-left-color: #2F4050;
}

.chrg_ul {
    padding-left: 10pt;
}

.label {
    background-color: #d1dade;
    color: #5e5e5e;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-weight: 600;
    padding: 3px 8px;
    text-shadow: none;
}

.has-success .control-label {
    color: #1ab394;
}

.has-warning .control-label {
    color: #f8ac59;
}

.has-error .control-label {
    color: #ed5565;
}

.nav .label,
.ibox .label {
    font-size: 10px;
}

.badge {
    background-color: #d1dade;
    color: #5e5e5e;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    padding-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    text-shadow: none;
}

.label-primary,
.badge-primary {
    background-color: #1ab394;
    color: #FFFFFF;
}

.label-success,
.badge-success {
    background-color: #1c84c6;
    color: #FFFFFF;
}

.label-warning,
.badge-warning {
    background-color: #f8ac59;
    color: #FFFFFF;
}

.label-warning-light,
.badge-warning-light {
    background-color: #f8ac59;
    color: #ffffff;
}

.label-danger,
.badge-danger {
    background-color: #ed5565;
    color: #FFFFFF;
}

.label-info,
.badge-info {
    background-color: #23c6c8;
    color: #FFFFFF;
}


.label-inverse,
.badge-inverse {
    background-color: #262626;
    color: #FFFFFF;
}

.label-white,
.badge-white {
    background-color: #FFFFFF;
    color: #5E5E5E;
}

.label-white,
.badge-disable {
    background-color: #2A2E36;
    color: #8B91A0;
}

.label-gray,
.badge-gray {
    background-color: #a4b5bb;
    color: #FFFFFF;
}

.uppercase {
    text-transform: uppercase;
}

.btn-danger {
    background-color: #ed5565;
    border-color: #ed5565;
    color: #FFFFFF;
}

    .btn-danger:hover,
    .btn-danger:focus,
    .btn-danger:active,
    .btn-danger.active,
    .open .dropdown-toggle.btn-danger,
    .btn-danger:active:focus,
    .btn-danger:active:hover,
    .btn-danger.active:hover,
    .btn-danger.active:focus {
        background-color: #ec4758;
        border-color: #ec4758;
        color: #FFFFFF;
    }

    .btn-danger:active,
    .btn-danger.active,
    .open .dropdown-toggle.btn-danger {
        background-image: none;
    }

        .btn-danger.disabled,
        .btn-danger.disabled:hover,
        .btn-danger.disabled:focus,
        .btn-danger.disabled:active,
        .btn-danger.disabled.active,
        .btn-danger[disabled],
        .btn-danger[disabled]:hover,
        .btn-danger[disabled]:focus,
        .btn-danger[disabled]:active,
        .btn-danger.active[disabled],
        fieldset[disabled] .btn-danger,
        fieldset[disabled] .btn-danger:hover,
        fieldset[disabled] .btn-danger:focus,
        fieldset[disabled] .btn-danger:active,
        fieldset[disabled] .btn-danger.active {
            background-color: #ef6776;
            border-color: #ef6776;
        }

button.btn-danger.dim:active {
    box-shadow: inset 0 0 0 #ea394c, 0 2px 0 0 #ea394c, 0 5px 3px #999999;
}

.btn-white {
    color: inherit;
    background: white;
    border: 1px solid #e7eaec;
    cursor: pointer;
}

    .btn-white:hover,
    .btn-white:focus,
    .btn-white:active,
    .btn-white.active,
    .open .dropdown-toggle.btn-white,
    .btn-white:active:focus,
    .btn-white:active:hover,
    .btn-white.active:hover,
    .btn-white.active:focus {
        color: inherit;
        border: 1px solid #d2d2d2;
    }

    .btn-white:active,
    .btn-white.active {
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) inset;
    }

    .btn-white:active,
    .btn-white.active,
    .open .dropdown-toggle.btn-white {
        background-image: none;
    }

        .btn-white.disabled,
        .btn-white.disabled:hover,
        .btn-white.disabled:focus,
        .btn-white.disabled:active,
        .btn-white.disabled.active,
        .btn-white[disabled],
        .btn-white[disabled]:hover,
        .btn-white[disabled]:focus,
        .btn-white[disabled]:active,
        .btn-white.active[disabled],
        fieldset[disabled] .btn-white,
        fieldset[disabled] .btn-white:hover,
        fieldset[disabled] .btn-white:focus,
        fieldset[disabled] .btn-white:active,
        fieldset[disabled] .btn-white.active {
            color: #cacaca;
        }

.btn-primary.btn-outline {
    color: #1ab394;
}

.btn-success.btn-outline {
    color: #1c84c6;
}

.btn-info.btn-outline {
    color: #23c6c8;
}

.btn-warning.btn-outline {
    color: #f8ac59;
}

.btn-danger.btn-outline {
    color: #ed5565;
}

.btn-danger.btn-outline {
    color: #ed5565;
}

    .btn-primary.btn-outline:hover,
    .btn-success.btn-outline:hover,
    .btn-info.btn-outline:hover,
    .btn-warning.btn-outline:hover,
    .btn-danger.btn-outline:hover {
        color: #fff;
    }

.landing-page .btn-primary.btn-outline:hover,
.landing-page .btn-success.btn-outline:hover,
.landing-page .btn-info.btn-outline:hover,
.landing-page .btn-warning.btn-outline:hover,
.landing-page .btn-danger.btn-outline:hover {
    color: #fff;
}
/* CIRCLE */
.img-circle {
    border-radius: 50%;
}

.btn-circle {
    width: 30px;
    height: 30px;
    padding: 6px 0;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1.428571429;
}
    .btn-circle.btn-md {
        width: 40px;
        height: 40px;
        padding: 8px 8px;
        border-radius: 50%;
        font-size: 18px;
        line-height: 1.33;
    }
    .btn-circle.btn-lg {
        width: 50px;
        height: 50px;
        padding: 10px 16px;
        border-radius: 25px;
        font-size: 18px;
        line-height: 1.33;
    }

    .btn-circle.btn-xl {
        width: 70px;
        height: 70px;
        padding: 10px 16px;
        border-radius: 35px;
        font-size: 24px;
        line-height: 1.33;
    }

.check_icon_size {
    font-size: 1.0em;
    color: cornflowerblue;
}

.vl {
    border-left: 1px solid gray;
    height: 30px;
    position: absolute;
    left: 10%;
    margin-left: -3px;
    top: 5px;
}

div.vertical-line {
    width: 0px; /* Use only border style */
    height: 30px;
    float: left;
    border: 1px inset; /* This is default border style for <hr> tag */
    /*border-left: 1px solid blue;*/
    margin-left: 3px;
    margin-right: 3px;
}

.btn_click_able {
    cursor: pointer;
}
.grid {
    --header-background: #494949;
    --header-text-color: #FFF;
}
/*Media query for devices*/
/*DESKTOP*/
/*@media screen and (min-width: 1024px) {
    .modal-lg {
        max-width: 1100px;*/ /* New width for default modal */
    /*}
}*/
/*TABLET*/
/*@media screen and (min-width: 768px) and (max-width: 1023px) {
    .modal-lg {
        max-width: 850px;*/ /* New width for default modal */
    /*}
}*/
/*TABLET*/
/*@media screen and (max-width: 767px) {
    .modal-lg {
        max-width: 550px;*/ /* New width for default modal */
    /*}
}*/

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
@media screen and (max-width: 576px) {
    .wrapping-group:not(#_) > *:first-child {
        flex: 1 0 100%;
        border-top-right-radius: 0.25rem;
        border-bottom-left-radius: 0;
    }

        .wrapping-group:not(#_) > *:first-child .btn {
            width: 100%;
            flex: 1 0 100%;
            margin-top: -1px;
            margin-left: 0px;
        }

    .wrapping-group:not(#_) > *:not(:first-child) {
        flex: 1 0 100%;
        margin-top: -1px;
        margin-left: 0px;
    }

    .wrapping-group:not(#_) > *.form-control {
        margin-left: 0;
    }

    .wrapping-group:not(#_) > *:last-child {
        border-top-right-radius: 0;
        border-bottom-left-radius: 0.25rem;
    }
    .wrapper {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        min-height: 100%;
        padding: 1px;
    }
    /*h1, h2, h3, p {
        font-size: 12px;
    }*/
    .spinner {
        width: 40px;
        height: 40px;
        border: 4px #ddd solid;
        border-top: 4px #2e93e6 solid;
        border-radius: 50%;
        animation: sp-anime 0.8s infinite linear;
        top: 50%;
        left: 50%;
        position:fixed;
    }
    .spintarget {
        left: 45% !important;
        /*left: calc(100vh - 3rem);*/
        position: absolute;
        text-align: center;
        top: 40% !important;
    }
    .chip-container {
        /*flex-direction: column;
        align-items: flex-start;*/
    }

    .chip-container igc-chip {
        width: auto; /* chips full-width en mobile si prefieres */
    }
    .dob-chip .dob-label {
        display: none; /* <-- Hace desaparecer SOLO "DOB :" en móviles */
    }

    /* Opcional: ajusta un poco el chip para que se vea mejor sin el label */
    .dob-chip {
        padding-left: 0.5rem; /* reduce padding si el prefijo desaparece */
        min-width: auto;
    }

}
/* Small devices (tablets, 768px and up) */
@media screen and (min-width: 768px) {
    .modal-lg {
        max-width: 550px; /* New width for default modal */
    }
    /*h1, h2, h3, p {
        font-size: 1.25rem;
    }*/
    
}

/* Medium devices (desktops, 992px and up) */
@media screen and (min-width: 992px) {
    .modal-lg {
        max-width: 850px; /* New width for default modal */
    }
    .case_year_width {
        max-width: 20%;
    }

    .case_digits_width {
        max-width: 30%;
    }

    .case_type_width {
        max-width: 22%;
    }

    .case_letter_width {
        max-width: 18%;
    }
    /*h1, h2, h3, p {
        font-size: 1.5rem;
    }*/
    .prefix_sentence_width {
        max-width: 50%;
    }
    .sufix_sentence_width {
        max-width: 50%;
    }
    
}

/* Large devices (large desktops, 1200px and up) */
@media screen and (min-width: 1200px) {
    .modal-lg {
        max-width: 1100px; /* New width for default modal */
    }
}



/*@media screen and (min-width: 961px) {
    .modal-dialog {
        max-width: 1100px;*/ /* New width for default modal */
    /*}
}*/
/*@media screen and (min-width: 676px) {
    .modal-dialog {
        max-width: 1100px;*/ /* New width for default modal */
    /*}
}
@media screen and (max-width: 675px) {
    .modal-dialog {
        max-width: 550px;*/ /* New width for default modal */
    /*}
}*/


/*@media screen and (min-width: 481px) {
    .modal-dialog {
        max-width: 550px;*/ /* New width for default modal */
    /*}
}
@media screen and (min-width: 320px) {
    .modal-dialog {
        max-width: 400px;*/ /* New width for default modal */
    /*}
}*/
/*@media (min-width:320px)  {*/ /* smartphones, iPhone, portrait 480x320 phones */ /*}
@media (min-width:481px)  {*/ /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ /*}
@media (min-width:641px)  {*/ /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ /*}
@media (min-width:961px)  {*/ /* tablet, landscape iPad, lo-res laptops ands desktops */ /*}
@media (min-width:1025px) {*/ /* big landscape tablets, laptops, and desktops */ /*}
@media (min-width:1281px) {*/ /* hi-res laptops and desktops */ /*}*/
/*footer css*/
.b-example-divider {
    height: 0.1rem;
    background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.bi {
    vertical-align: -.125em;
    fill: currentColor;
}
.count-info .label {
    line-height: 12px;
    padding: 2px 5px;
    position: absolute;
    right: 6px;
    top: 12px;
}
.icon-red {
    color: red;
}
.red_dot:after {
    content: "";
    display: block;
    position: absolute;
    width: 8px;
    height: 8px;
    background: red;
    top: -4px;
    right: -1px;
    border-radius: 50%;
}

/*Adding Login section styles*/

#formContent {
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
    background: #fff;
    padding: 30px;
    width: 90%;
    max-width: 450px;
    position: relative;
    padding: 0px;
    -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
    box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
    text-align: center;
}

#formFooter {
    background-color: #f6f6f6;
    border-top: 1px solid #dce8f1;
    padding: 25px;
    text-align: center;
    -webkit-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
}

/* FORM TYPOGRAPHY*/

input[type=button], input[type=submit], input[type=reset] {
    background-color: #56baed;
    border: none;
    color: white;
    padding: 15px 80px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    text-transform: uppercase;
    font-size: 13px;
    -webkit-box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
    box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    margin: 5px 20px 40px 20px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
        background-color: #39ace7;
    }

    input[type=button]:active, input[type=submit]:active, input[type=reset]:active {
        -moz-transform: scale(0.95);
        -webkit-transform: scale(0.95);
        -o-transform: scale(0.95);
        -ms-transform: scale(0.95);
        transform: scale(0.95);
    }

    input[type=text]:focus {
        background-color: #fff;
        border-bottom: 2px solid #5fbae9;
    }

    input[type=text]:placeholder {
        color: #cccccc;
    }



/* ANIMATIONS */

/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

/* Simple CSS3 Fade-in Animation */
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


.dateRanges {
    display: flex;
}

.caption {
    align-self: center;
    margin-left: 25px;
    margin-right: 10px;
    margin-top: 8px;
}
.logout-text-center {
    vertical-align: middle;
}
.pull-right {
    float: right;
}
/*.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}*/
.nav_link_disabled {
    color: #888;
    opacity: 0.6;
    filter: alpha(opacity=60);
}

.label {
  background-color: #d1dade;
  color: #5e5e5e;
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 600;
  padding: 3px 8px;
  text-shadow: none;
  border-radius: 0.25em;
  line-height: 1;
  white-space: nowrap;
}
.label-info,
.badge-info {
    background-color: #23c6c8;
    color: #FFFFFF;
}
.label-warning,
.badge-warning {
    background-color: #f8ac59;
    color: #FFFFFF;
}
.label-warning-light,
.badge-warning-light {
    background-color: #f8ac59;
    color: #ffffff;
}
.nav-link .label,
.nav .label,
.ibox .label {
    font-size: 12px;
}
/*.float-end {
    float: right;
}*/
/*.nav-float-right {
    float: right !important;
}*/
/*body.rtls .float-right {
    float: left !important;
}
.right.chat-element > .float-right {
    margin-left: 10px;
}*/
/*.navbar-default .special_link a span.label {
    background: #fff;
    color: #1ab394;
}

.navbar-default .landing_link a {
    background: #1cc09f;
    color: white;
}

.navbar-default .landing_link a:hover {
    background: #1ab394 !important;
    color: white;
}

.navbar-default .landing_link a span.label {
    background: #fff;
    color: #1cc09f;
}*/
.btn_circular {
    padding: 31px 21px;
    border-radius:50%;
}
.logout_link {
    margin-top: 2px;
    font-weight: 550;
}
.text_danger {
    color: #ed5565 !important;
}
.btn_search {
    background-color: #56baed;
    border-color: #56baed;
}
.minimalize-styl-2 {
    padding: 4px 12px;
    /*margin: 14px 5px 5px 20px;*/
    margin: 14px 1px 5px 2px;
    font-size: 14px;
    float: left;
}
#refresh_table:hover {
    cursor:pointer;
}
.input-xl {
    width: 223px !important;
}
/*
 *  Usage:
 *
 *    <div class="sk-spinner sk-spinner-wave">
 *      <div class="sk-rect1"></div>
 *      <div class="sk-rect2"></div>
 *      <div class="sk-rect3"></div>
 *      <div class="sk-rect4"></div>
 *      <div class="sk-rect5"></div>
 *    </div>
 *
 */
.sk-spinner-wave.sk-spinner {
    margin: 0 auto;
    width: 50px;
    height: 30px;
    text-align: center;
    font-size: 10px;
}

.sk-spinner-wave div {
    background-color: #1976D2;
    height: 100%;
    width: 6px;
    display: inline-block;
    -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
}

.sk-spinner-wave .sk-rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.sk-spinner-wave .sk-rect3 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.sk-spinner-wave .sk-rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.sk-spinner-wave .sk-rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}

@keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}

.spintarget {
    left: 55%;
    position: absolute;
    text-align: center;
    top: 40%;
}
.target_center {
    left: 50%;
    position: absolute;
    text-align: center;
    top: 40%;
}
.ibox-content > .sk-spinner {
    display: none;
}

.ibox-content.sk-loading {
    position: relative;
}

    .ibox-content.sk-loading:after {
        content: '';
        background-color: rgba(255, 255, 255, 0.7);
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

    .ibox-content.sk-loading > .sk-spinner {
        display: block;
        position: absolute;
        top: 40%;
        left: 0;
        right: 0;
        z-index: 2000;
    }

.ibox {
    clear: both;
    margin-bottom: 25px;
    margin-top: 0;
    padding: 0;
}

    .ibox.collapsed .ibox-content {
        display: none;
    }

    .ibox.collapsed .fa.fa-chevron-up:before {
        content: "\f078";
    }

    .ibox.collapsed .fa.fa-chevron-down:before {
        content: "\f077";
    }

    .ibox:after,
    .ibox:before {
        display: table;
    }

.ibox-title {
    background-color: #ffffff;
    border-color: #e7eaec;
    border-image: none;
    border-style: solid solid none;
    border-width: 1px;
    color: inherit;
    margin-bottom: 0;
    /*padding: 15px 90px 8px 15px;*/
    /* top | right | bottom | left */
    padding: 10px 10px 8px 10px;
    min-height: 48px;
    position: relative;
    clear: both;
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 2px 2px 0 0;
}

.ibox-content {
    background-color: #ffffff;
    color: inherit;
    padding: 15px 20px 20px 20px;
    border-color: #e7eaec;
    border-image: none;
    border-style: solid;
    border-width: 1px;
}

.ibox-footer {
    color: inherit;
    border-top: 1px solid #e7eaec;
    font-size: 90%;
    background: #ffffff;
    padding: 10px 15px;
}
.jumbotron {
    background-color: #e9ecef;
    border-radius: 6px;
    padding: 40px;
}
.modal {
    z-index: 1050 !important;
}

.modal-backdrop {
    z-index: 1040 !important;
}
.modal-content,
.modal-body,
.modal-dialog {
    /*overflow: visible !important;*/
}
.app-topbar .topbar-menu .topbar-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: var(--ins-topbar-height);
}
.narrative-link {
    color: var(--ig-primary-500);
    text-decoration: none;
    font-weight: 500;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    transition: background-color 0.2s ease; /* background-color en vez de background */
    display: inline-block; /* importante para que padding funcione bien */
}

    .narrative-link:hover,
    .narrative-link:focus {
        text-decoration: underline;
        background-color: rgba(var(--ig-primary-500-rgb), 0.08);
        outline: none;
    }

    .narrative-link:focus {
        outline: 2px solid var(--ig-primary-400);
        outline-offset: 2px;
    }
.chip-container {
    margin-top: 0.5rem; /* espacio después del nombre */
}

    .chip-container igc-chip {
        white-space: nowrap; /* evita que el texto del chip se rompa en varias líneas */
        flex: 0 1 auto; /* permite que se achiquen un poco si es necesario, pero no crezcan mucho */
        max-width: 100%; /* evita desbordes en móviles */
    }
.dob-chip .dob-label {
    /* Por defecto visible en desktop/tablet */
    display: inline;
}

/* Opción 1: target el botón dentro del exporter */
igc-grid-toolbar-exporter button,
igc-grid-toolbar-exporter igc-button {
    --ig-size: var(--ig-size-medium) !important;
    --component-size: var(--ig-size-medium) !important; /* fuerza la variable interna que ves */
}

/* Opción 2: más agresiva, apunta al outlined button que mencionas */
/*igc-button.outlined,
button.igx-button-outlined {
    --ig-size: var(--ig-size-medium) !important;
    --component-size: var(--ig-size-medium) !important;
    min-height: 36px !important;*/ /* o 32px para small */
    /*padding: 0 1rem !important;
    font-size: 0.875rem !important;
}*/

/* Opción 3: escala visual rápida para pruebas */
/*igc-grid-toolbar-exporter button {
    transform: scale(0.9);
    transform-origin: center left;
}*/
.narrative {
    white-space: pre-line;
    /*white-space: pre-wrap; */
}
igc-checkbox[disabled]::part(indicator) {
    --tick-color: #1976D2 !important; /* Azul medio (Material Blue 700) */
    /* Otras opciones más vibrantes: */
    /* --tick-color: #1565C0 !important;  /* Azul más oscuro */
    /*  --tick-color: #0D47A1 !important; */ /* Azul intenso */
    /*  --tick-color: #2196F3 !important;  */ /* Azul brillante */
    opacity: 1 !important;
}

/* Color de fondo del checkbox cuando está marcado y disabled */
igc-checkbox[disabled][checked]::part(control)::after {
    --fill-color: #1976D2 !important; /* Fondo azul */
    opacity: 0.85 !important; /* Un poco transparente para que se note que está disabled */
}

/* Opcional: borde más visible */
igc-checkbox[disabled][checked]::part(control) {
    border-color: #1976D2 !important;
}

/* Label más oscuro para que combine bien */
igc-checkbox[disabled]::part(label) {
    color: #333 !important;
}
/* ================== update font (secure version) ================== */

/* 1. loading source */
/*@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

body,
html,
.sidebar-nav, .metismenu {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}
*/