@charset "utf-8";
/* CSS Document */

:root
{
    --primary: #E52621;
    --secondary: #000000;
    --title-color: #000000;
    --text-color: #000000;
    --input-placeholder-color: #A1A5B7;
    --input-text-color: #888888;
    --checkbox-color: #E52621;
    --label-color: #000000;
    --label-color-hover: #E52621;
}

/* mulish-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/mulish-v18-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('../fonts/mulish-v18-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* mulish-600 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/mulish-v18-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('../fonts/mulish-v18-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* mulish-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/mulish-v18-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('../fonts/mulish-v18-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* philosopher-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Philosopher';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/philosopher-v21-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('../fonts/philosopher-v21-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* philosopher-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Philosopher';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/philosopher-v21-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('../fonts/philosopher-v21-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

html
{
    height: 100%;
    scroll-behavior: smooth;
    scroll-padding: 110px;
}

html.no-scroll
{overflow: hidden;}

::-moz-selection
{ /* Code for Firefox */
    color: #FFF;
    background: var(--primary);
}

::selection
{
    color: #FFF;
    -webkit-text-stroke-color: #FFF;
    background: var(--primary);
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4
{
    margin-top: 0;
    margin-bottom: 0;
    line-height: normal;
}

*
{
    padding: 0;
    margin: 0;
    outline: none;
}

b, strong
{
    font-weight: 700;
}

body
{
    padding: 0;
    font-family: 'Mulish', serif;
    font-weight: 400;
    font-size: 18px;
    color: var(--text-color);
    line-height: normal;
    padding-right: 0 !important;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    overflow-x: hidden;
}

body.menuFixed
{
    padding-top: 75px;
}

body.current_section_inicio.menuFixed
{
    padding-top: 0;
}

font
{font-size: 1rem}

a, a:hover
{text-decoration: none; color: inherit;}

.textoSeccion
{
    color: #666666;
    line-height: 25px;
}

.tituloSeccion
{
    color: var(--secondary);
    font-size: 35px;
    font-weight: 700;
    text-transform: capitalize;
    font-family: Philosopher;
}

.subtituloSeccion {
    color: var(--primary);
    font-size: 14px;
    letter-spacing: 2.8px;
    text-transform: uppercase;
}

#bloqueUsuarioGestionarSaldo .subtituloSeccion
{
    margin-top: -15px;
    font-size: 20px;
    letter-spacing: normal;
    text-transform: none;
    font-family: 'Philosopher';
}

.tituloSeccion2
{
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 25px;
    color: var(--secondary);
    display: inline-flex;
    align-items: center;
    gap: 15px;
}

.btnStandard,
div.dt-buttons>.dt-button.buttons-colvis
{
    position: relative;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-flex;
    gap: 10px;
    align-items: center;
    text-decoration: none !important;
    background: var(--secondary);
    text-align: center;
    z-index: 1;
    overflow: hidden;
    justify-content: center;
    transition: all 240ms linear 0ms;
    border-radius: 100px;
    color: white;
    font-size: 18px;
    font-weight: 700;
    line-height: normal;
    text-transform: capitalize;
    letter-spacing: 1.8px;
    font-family: Philosopher;
    padding: 5px 5px 5px 30px;
}

.botoneraBlockUI .btnStandard {
    justify-content: center;
    min-width: 160px;
    padding: 15px;
    max-width: 100%;
}

.btnStandard .iconoFlechaContainer {
    width: 50px;
    height: 50px;
    background: white;
    border-radius: 50%;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.btnStandard .iconoFlecha {
    position: relative;
    width: 50px;
    height: 50px;
    overflow: hidden;
    display: block;
}

.btnStandard .iconoFlecha svg {
    width: 50px;
    height: 50px;
    display: block;
}

.btnStandard .iconoFlecha svg:first-child {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(-50px, 50px);
    transition: transform .4s ease-in-out;
}

.btnStandard path, .btnStandard.btn-white:hover path {
    transition: all .3s;
}

.btnStandard .iconoFlecha svg:last-child {
    transition: .4s ease-in-out;
}

.btnStandard:hover .iconoFlecha svg:first-child {
    transform: scale(1) translate(0, 0);
}

.btnStandard:hover .iconoFlecha svg:last-child {
    transform: translate(50px, -50px);
}

.btnStandardInv
{
    background: var(--secondary) !important;
    color: var(--primary);
}

.btnStandardInv::before
{
    background-color: var(--primary);
}

.btn-white
{
    background: #FFF;
    color: var(--primary);
}

.btnStandard.btn-small
{
    padding: 5px 25px;
}

.btnStandard path,
.btnStandard.btn-white:hover path
{
    fill: var(--primary);
    transition: all .3s;
}

.btnStandard.btn-white path
{
    fill: #FFF;
}

.btnStandard:hover, .btnStandard:focus,
.btn-hover:hover .btnStandard,
div.dt-buttons>.dt-button.buttons-colvis:hover
{
    color: #FFF !important;
    background: var(--primary);
}

.btnStandard:hover path, .btnStandard:focus  path,
.btn-hover:hover .btnStandard  path,
div.dt-buttons>.dt-button.buttons-colvis:hover path
{
    fill: var(--secondary) !important;
    stroke: #FFF !important;
}

.btnStandard:hover:before, .btnStandard:focus:before,
.btn-hover:hover .btnStandard:before,
div.dt-buttons>.dt-button.buttons-colvis:hover::before
{
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
}


.btnStandardInv:hover, .btnStandardInv:focus
{
    color: var(--secondary) !important;
}

#container-login-form
{
    display: grid;
    grid-template-columns: 1fr 650px;
    min-height: 100vh;
}
#container-login-form
{
    height: 100%;
    background-image: url("../img/fondos/login.png");
    background-size: contain;
    background-repeat: no-repeat;
}
#container-login-form form
{
    display: flex;
    flex-direction: column;
    padding-top: 35px;
    padding-bottom: 50px;
    padding-left: 30px;
    padding-right: 30px;
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);
    min-height: 630px;
    border-radius: 15px;
    width: 460px;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 80px;
    max-width: 100%;
    background: rgba(255, 255, 255, 0.80);
}
#container-login-form form .textoSeccion
{
    font-size: 16px;
}
.olvide-pass
{
    color: var(--primary) !important;
    font-size: 15px;
    line-height: normal;
    text-decoration: underline;
    margin-top: 5px;
}

.olvide-pass:hover, .sin-cuenta a:hover
{color: var(--primary)}

#wrapper.con-menu
{
    display: grid;
    grid-template-columns: 293px minmax(0, 1fr);
}

#main-menu #saldo
{
    font-size: 18px;
    font-family: Philosopher;
    padding-bottom: 30px;
    border-bottom: 1px dashed var(--secondary);
}

#main-menu #saldo strong
{
    font-size: 20px;
    font-family: Mulish;
}

#main-menu
{
    padding: 40px 15px 12px;
    height: 100vh;
    position: sticky;
    top: 0;
    left: 0;
    z-index: 10;
    display: flex;
    flex-direction: column;
    background: #FFF;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25);
}
#main-menu ul
{
    list-style: none;
    margin-bottom: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex-grow: 1;
}
.btn-logout
{
    border-top: 1px dashed var(--secondary);
    padding-top: 15px;
}
#main-menu li > a
{
    border-radius: 5px;
    background: #FFF;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    transition: all .3s;
    color: var(--secondary);
    font-size: 17px;
    width: 100%;
    text-transform: capitalize;
}

#main-menu li > a path
{
    transition: all .3s;
}

#main-menu li:hover > a,
#main-menu li.menu-seleccionado > a
{
    background-color: var(--primary);
    color: #FFF;
}

#main-menu li:hover > a path,
#main-menu li.menu-seleccionado > a path
{
    stroke: #FFF;
}

#main-menu ul ul
{
    margin-top: 10px;
    padding-left: 18px;
}

#main-menu ul ul li > a
{
    padding: 8px 15px;
    gap: 5px;
}

.custom-dropdown-menu
{
    transition: all .3s;
    transform-origin: top;
    height: 158px;
    overflow: hidden;
}

#main-menu li:not(:hover):not(.menu-seleccionado) .custom-dropdown-menu
{
    height: 0;
    overflow: hidden;
    margin-top: 0;
}

#wrapper.con-menu .contenido
{

    padding: 55px 30px;

    width: 1274px;

    max-width: 100%;
}

#user-barra-top
{
    background: #FFF;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
    padding: 17px 30px;
    display: flex;
    justify-content: space-between;
}

#barra-top-seccion, .titulo-seccion
{
    display: flex;
    align-items: center;
    gap: 15px;
    color: var(--secondary);
    font-size: 20px;
    font-weight: 600;
    text-transform: capitalize;
}

#barra-top-user
{
    color: var(--secondary);
    font-size: 15px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

#barra-btns
{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px 50px;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
    padding: 10px 30px 10px 323px;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: white;
    width: 100%;
    z-index: 2;
}

#container-content
{
    padding: 30px 30px 100px;
}
.current_section_estadisticas #container-content {
    padding-bottom: 0px;
}

/* INICIO SECCION AFILIADOS */
#notas, #motivo-baja-desc
{
    field-sizing: content;
    min-height: 230px;
    max-height: 500px;
    height: initial;
}
#afiliado-notas,
#donacion-notas,
#donacion-notas-usuario
{
    field-sizing: content;
    min-height: 145px;
    max-height: 400px;
    height: initial;
}
.avisoDonacionUsuario
{
    margin-bottom: 20px;
    font-size: 15px;
}

.avisoDonacionUsuario a {
    text-decoration: underline;
}
#motivo-baja
{
    field-sizing: content;
    min-height: 160px;
    max-height: 400px;
    height: initial;
}
.alert
{
    z-index: 10000000000000000000000 !important;
}
/* FIN SECCION AFILIADOS */

/* INICIO SECCION CONTABILIDAD */

#resumen-contabilidad
{
    display: grid;
    align-items: center;
    grid-template-columns: repeat(2, 133px) repeat(3, 296px);
    gap: 30px;
}

.filtro-contabilidad
{
    flex-shrink: 0;
}

.item-resumen
{
    border-radius: 10px;
    background: #FFF;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
    flex-shrink: 0;
    padding: 15px 15px 30px;
}
.item-resumen-top
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 11px;
    border-bottom: 1px dashed var(--primary);
    margin-bottom: 20px;
    gap: 10px;
}
.no-border .item-resumen-top {
    border: none;
    margin: 0 !important;
}
.item-resumen.no-border {
    padding: 15px 15px 0px;
}
.item-resumen-titulo
{
    color: var(--secondary);
    font-size: 18px;
    font-weight: 500;
}
.item-resumen-icono
{
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--primary);
}
.item-resumen-total
{
    color: var(--secondary);
    font-size: 20px;
    font-weight: 600;
}
.item-resumen-total.d-flex, .item-resumen-titulo.d-flex {
    align-items: center;
    gap: 10px;
}
.no-border .item-resumen-titulo {
    font-size: 15px;
}
.no-border .item-resumen-total {
    font-size: 16px;
    text-align: right;
}
.positivo
{
    color: #6CC500 !important;
}
.negativo
{
    color: #FF3815 !important;
}

#tablas-contabilidad
{
    display: grid;
    grid-template-columns: repeat(2, 450px) minmax(0, 1fr);
    gap: 30px;
}

.sub-table th
{
    color: var(--primary);
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
}

div.dt-scroll-body .sub-table thead tr th
{
    padding-bottom: 5px !important;
}

.sub-table .icon-tabla svg
{
    max-height: 30px;
}
.tablaGestina.table .sub-table td {
    padding: 5px 10px !important;
}
/*
.recibo-stripe svg path {
}
.recibo-transferencia svg path {
    stroke: #a59528;
}
*/
table.table.dataTable .fila-activa td{
    background-color: #f4d5004f;
}
/* FIN SECCION CONTABILIDAD */

































































































































































































































































































































































/* MODAL */

.modal-dialog.modal356
{width: 356px}

.modal-dialog.modal448
{width: 448px}

.modal-dialog.modal460
{width: 460px}

.modal-dialog.modal500
{width: 500px}

.modal-dialog.modal565
{width: 565px}

.modal-dialog.modal622
{width: 622px}

.modal-dialog.modal681
{width: 681px}

.modal-dialog.modal750
{width: 750px}

.modal-dialog.modal835
{width: 835px}

.modal-dialog.modal845
{width: 845px}

.modal-dialog.modal1170
{width: 1170px}

.botoneraBlockUI
{width: 100%;}

.esperePorFavor
{
    font-size: 0;
    border: 5px solid var(--primary);
    border-radius: 40px;
    height: 40px;
    margin: 0 auto;
    width: 40px;
    z-index: 1000007;
    -webkit-animation: pulsate 1s ease-out infinite;
    -moz-animation: pulsate 1s ease-out infinite;
    -ms-animation: pulsate 1s ease-out infinite;
    -o-animation: pulsate 1s ease-out infinite;
    animation: pulsate 1s ease-out infinite;
    display: block;
}

.modalEspere
{
    box-shadow: none !important;
}

.modalEspere img
{display: none}

.modalEspere .modal-content
{
    background-color: transparent;
    border: none;
}

.bloqueModal
{
    display: none;
    text-align: left;
}

.modal .bloqueModal
{
    display: block;
}

.modal
{
    text-align: center;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999999;
}

@media screen and (min-width: 768px)
{
    .modal:before
    {
        display: inline-block;
        vertical-align: middle;
        content: " ";
        height: 100%;
    }
}

.modal-content
{
    border: 1px solid #FFF;
    border-radius: 0.5rem;
}

.modal-header
{
    border-bottom: none;
    text-align: center;
    padding: 0.5rem 1rem 1rem;
}

.modal-header .close
{
    opacity: 1 !important;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 100;
    text-shadow: none;
    -webkit-appearance: initial;
    border: none;
    background: none;
}

.close:hover, .close:focus
{
    outline: none;
}

.modal-header .modal-title
{
    color: var(--primary);
    font-size: 25px;
    font-weight: 700;
    font-family: 'Philosopher';
    text-align: center;
    width: 100%;
    border-bottom: none;
    text-transform: capitalize;
    margin-top: 35px;
}

.modal-dialog
{
    display: inline-block;
    text-align: left;
    vertical-align: middle;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
    border-radius: 10px;
    min-width: 380px !important;
    max-width: calc(100% - 30px);
}

.modal-dialog.modal-sm
{
    min-width: 450px !important;
}

.modal-dialog.modal-lg
{
    min-width: 950px !important;
}

.modal .btnStandard + .btnStandard
{
    margin-left: 20px;
}

.modal-body
{
    color: #666666;
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    padding: 0 1rem 1rem;
    line-height: 140%;
}

.modal-body a:not(.btnStandard)
{
    color: var(--primary);
    font-weight: 500;
}

.modalEspere .modal-body
{
    padding: 1rem;
}

.modal-body img
{
    margin-right: 2px;
}

.modal-footer
{
    padding: 10px 15px;
}

.modalAlert .modal-footer
{
    text-align: center;
    border-top: none;
    padding-bottom: 20px;
}

.modalAlert .botoneraBlockUI
{
    width: 100%;
}

/* FIN DE MODAL*/

/* INICIO DATATABLE */
div.dt-button-collection .dt-button-active:after
{
    right: 7px;
}
div.dt-buttons .dt-button
{
    white-space: normal;
}
div.dt-buttons>.dt-button.buttons-colvis
{
    border: none !important;
    margin: 0 !important;
}
div.dt-buttons>.dt-button.buttons-colvis .dt-button-down-arrow
{
    display: none;
}

table.table.dataTable{margin-bottom: 2px}

.dt-container
{
    position: relative;
}

div.dt-processing>div:last-child>div
{
    background: var(--primary);
}

.header-flex
{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

table.dataTable.nowrap th, table.dataTable.nowrap td
{
    white-space: initial;
}

.inputsDatatable
{
    margin-bottom: -42px;
    z-index: 11;
}

.dataTables_processing
{
    z-index: 105
}

.dataTables_info, .dataTables_empty
{
    white-space: inherit !important;
    color: #000000;
    font-size: 15px;
    font-style: italic;
}

.pagination > li > button
{
    font-size: 18px;
    border: none !important;
    color: var(--secondary);
    padding: 0;
    transition: all .4s ease;
    box-shadow: none;
}

.pagination > li > button:hover, .pagination > li > button:focus
{
    background-color: var(--primary) !important;
    color: white !important;
    text-decoration: none;
    box-shadow: none;
}

.pagination > li > button:hover path, .pagination > li > button:focus path
{
    stroke: var(--primary);
}

ul.pagination > .dt-paging-button
{
    display: none;
}

ul.pagination > .dt-paging-button:nth-child(2),
ul.pagination > .dt-paging-button:nth-last-child(2)
{
    display: block;
}

ul.pagination > .dt-paging-button:nth-child(2) button,
ul.pagination > .dt-paging-button:nth-last-child(2) button
{
    background-color: white !important;
}

ul.pagination > .dt-paging-button path
{
    transition: all .3s;
}

.pagination-dt
{
    flex-shrink: 0;
    padding-bottom: 5px;
}

.pagination-dt-info {
    display: flex;
    flex-shrink: 0;
    padding-bottom: 5px;
    align-items: center;
    margin-right: 10px;
    line-height: 40px;
    font-size: 16px;
    gap: 10px;
}

.paginate_button.previous a
{
    pointer-events: all !important;

    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.paginate_button.next a
{
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

ul.pagination > .dt-paging-button:hover path
{
    stroke: var(--primary);
}

table.dataTable.nowrap th, table.dataTable.nowrap td
{
    white-space: inherit;
    vertical-align: middle;
}

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
{
    bottom: calc(50% - 14px);
}

.pagination > .active > button, .pagination > .active > button:hover, .pagination > .active > button:focus, .pagination button:hover
{
    background: var(--primary) !important;
    color: #FFF !important;
    border-color: var(--primary) !important;
}

.paginate_button.next a:before, .paginate_button.previous a:before
{
    width: 12px;
    height: 21px;
}

.paginate_button.next:hover a:before, .paginate_button.previous:hover a:before
{
    color: #FFF !important;
}

.paginate_button.next:hover a, .paginate_button.previous:hover a
{
    background: var(--primary);
}

.paginate_button.previous a:before
{
    content: "";
    background: url("../img/iconos/flechaIzquierda.svg");
}

.paginate_button.next a:before
{
    content: "";
    background: url("../img/iconos/flechaDerecha.svg");
}

.paginate_button:hover a:before {
    filter: brightness(0) invert(1);
}

.header-tabla-pagging-button
{
    display: inline-flex;
    align-items: center;
    gap: 10px 25px;
}

.dataTables_wrapper .pagination
{
    float: right;
    margin: 10px 0 !important;
    font-size: 0px;
    justify-content: flex-end;
}

.paginate_button.next a svg, .paginate_button.previous a svg
{
    display: none;
}
.page-link
{
    height: 100%;
    font-size: 15px;
    line-height: 20px;
    color: var(--primary);
    border: 2px solid var(--primary) !important;
    width: 60px;
    height: 60px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: none !important;
}

.page-item.active .page-link
{
    background-color: var(--primary);
    border-color: var(--primary);
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination
{
    border-radius: 3px;
    overflow: hidden;
}

.dataTables_wrapper div.dataTables_length label
{
    color: #333333;
    font-size: 16px;
}

.dataTables_wrapper div.dataTables_length label select
{
    margin-left: 15px !important;
    width: 84px;
    padding: 15px 20px;
    border-color: var(--primary);
    color: #5E6278 !important;
    line-height: initial;
    border-radius: 10px;
}

.mostrarPedidos .input-icon > i
{
    right: 15px;
    color: var(--primary);
}

.dataTableCenter
{
    text-align: center;
}

.tablaGestina.table th, .tablaGestina.table td
{
    padding: 10px 8px;
}

table.dataTable td
{
    font-size: 15px;
    line-height: 30px;
    color: var(--secondary);
}

table.dataTable td.vistoPendiente
{
    color: #FF9D00;
    font-weight: 600;
}

.tablaGestina.table.extra-padding td
{
    padding-top: 15px;
    padding-bottom: 15px;
}
div.dataTables_wrapper div.dataTables_filter
{
    text-align: left;
}

div.dataTables_wrapper div.dataTables_filter input.form-control:focus, div.dataTables_wrapper div.dataTables_filter input.bmd-form-group.is-focused .form-control
{
    /*  -webkit-background-size: none !important;
      background-size: none !important;*/
}

tbody td.stroke
{
    text-decoration: line-through;
}

table.tablaGestina tr.right td.dataTableCenter
{
    text-align: right;
}

table.tablaGestina td.dataTableCenter
{
    text-align: center;
    vertical-align: middle;
}

.table > thead > tr > th
{
    color: var(--primary);
    text-transform: uppercase;
    background-color: #FFF;
    padding: 20px 8px !important;
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
}

.table > thead > tr > th.dataTableCenter
{
    text-align: center;
}

.tablaGestina
{
    border: 2px solid var(--primary);
    color: #666666;
    font-size: 14px;
    font-weight: 400;
    border-radius: 10px !important;
    line-height: 114%;
}

.table>:not(:first-child) {
    border-top: inherit;
}

.table > thead > tr > th
{
    border-bottom: 2px solid var(--primary);
    border-radius: 10px 10px 0px 0px;
}

.table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td
{
    border-bottom: 1px solid var(--primary);
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tbody > tr:first-child > td
{
    border-top: none;
}

em.error
{
    display: none !important;
}

div.dt-processing{
    padding: 10px;
    font-size: 18px;
}
div.dt-processing>div:last-child {
    margin: 10px auto 0;
}

/* NOTA: quito el collapse porque sino no me redondea los border de la tabla*/
/*
.tablaGestina.table.dataTable {

    border-collapse: collapse !important;
}*/
.paddingLeftTabla
{
    padding-left: 25px !important;
}

.tablaGestina.table td a
{
    color: #222;
}

.tablaGestina.table td a i
{
    transition: all .3s;
    color: #222;
    font-size: 20px;
}
.tablaGestina.table td a:hover i, .tablaGestina.table td span:hover i
{
    color: var(--primary) !important;
}

.tablaGestina div.dataTables_wrapper div.dataTables_processing
{
    margin-top: 0;
}

.dataTables_wrapper .dataTables_length
{
    float: right !important;
}

.paginationFooter
{
    margin-top: 30px;
    display: flex;
    justify-content: flex-end;
}

div.dataTables_wrapper .paginationFooter div.dataTables_paginate
{
    float: right !important;
}

table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:before
{
    opacity: 0 !important;
}

.icon-tabla
{
    display: inline-block;
    vertical-align: middle;

    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
}

.icon-tabla svg
{
    width: auto;
    max-height: 30px;
}

.icon-tabla, .icon-tabla path
{
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
}

.icon-tabla:hover
{
    color: var(--primary);
}

.icon-tabla:hover path
{
    stroke: var(--primary);
}

.icon-tabla + .icon-tabla
{
    margin-left: 10px;
}

/* RESNPONSIVE */

table.dataTable > tbody > tr.child span.dtr-title
{
    display: inline-block;
    font-weight: bold;
    width: 30%;
    text-align: left;
    white-space: normal;
    align-items: center;
    word-break: break-word;
    vertical-align: middle;
}

span.dtr-data
{
    display: inline-block;
    vertical-align: middle;
    white-space: normal;
    width: 68%;
    padding-left: 20px;
}

table.dataTable > tbody > tr.child ul.dtr-details
{width: 100%; }

.dataTablesInfoLeft .dt-info
{
    text-align: left;
    margin-top: 16px;
    line-height: 130%;
    padding-top: 0 !important;
}

.header-tabla
{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 30px;
    flex-wrap: wrap;
    gap: 20px 10px;
}

.header-tabla-filters
{
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 10px 30px;
    justify-content: center;
}

.current_section_facturas .header-tabla-filters {
    width: 100%;
    justify-content: space-between;
}

.dt-length
{
    display: flex;
    align-items: center;
    gap: 8px;
}

.dt-length select
{
    border: none;
    outline: none !important;
    box-shadow: none !important;
}

.dt-column-order
{
    display: none;
}

.paginador-filtros
{
    display: flex;
    align-items: center;
    gap: 10px 30px;
}

#filtros-tabla
{
    display: flex;
    align-items: flex-end;
    gap: 12px 30px;
    flex-wrap: wrap;
}
#filtros-tabla .filtro-fecha
{
    width: 128px;
}

#filtros-tabla .filtro-tipo
{
    width: 220px;
}

table.dataTable th.dt-type-numeric.dt-left, table.dataTable th.dt-type-date.dt-left, table.dataTable td.dt-type-numeric.dt-left, table.dataTable td.dt-type-date.dt-left
{
    text-align: left;
}

table.dataTable th.dt-type-numeric.dt-center, table.dataTable th.dt-type-date.dt-center, table.dataTable td.dt-type-numeric.dt-center, table.dataTable td.dt-type-date.dt-center
{
    text-align: center;
}
div.dt-container div.dt-search label
{
    font-weight: 500;
}
div.dt-container div.dt-search
{
    width: 296px;
    text-align: left;
}
div.dt-container div.dt-search input
{
    margin-left: 0;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center right 14px;
    padding-right: 45px;
}

div.dt-scroll-body
{
    border-color: var(--primary);
    border-width: 1px;

    height: initial !important;
    max-height: calc(100vh - 380px) !important;
}
/* FIN DATATABLE */

.tooltipster-base
{
    z-index: 99999999999 !important;
}

.tooltipStandard
{
    cursor: pointer;
}

.tooltipster-sidetip.tooltipster-base .tooltipster-box
{
    font-weight: 500;
    background: var(--primary);
    border: none;
    border-radius: 4px;
    color: var(--secondary);
    font-size: 15px;
    padding: 5px 10px;
}

.tooltipster-sidetip.tooltipster-base.tooltip-area .tooltipster-box
{
    background: var(--primary);
}

.tooltipster-sidetip.tooltipster-base .tooltipster-content
{
    color: white;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background
{
    border-bottom-color: var(--primary) !important;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background
{
    border-top-color: var(--primary) !important;
}

.tooltipster-sidetip.tooltipster-base.tooltip-area .tooltipster-arrow-background
{
    border-bottom-color: var(--primary) !important;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background
{
    border-left-color: var(--primary) !important;
}

.tooltipster-sidetip .tooltipster-arrow-border
{
    border: 10px solid transparent !important;
}

/* FIN TOOLTIP/BOXOVER*/

/* INICIO SCROLL BAR */
.custom-scroll-bar
{
    scrollbar-width: thin;
    scrollbar-color: #DADADA #FFF;
    overflow: auto;
}

.custom-scroll-bar::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
    background-color: #FFF;
    border-radius: 10px;
}

.custom-scroll-bar::-webkit-scrollbar
{
    width: 8px;
    background-color: #FFF;
}

.custom-scroll-bar::-webkit-scrollbar-thumb
{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
    background-color: #DADADA;
}

.custom-scroll-bar::-webkit-scrollbar-thumb
{
    -webkit-box-shadow: none;
}

.custom-scroll-bar:hover
{
    scrollbar-color: #DADADA #FFF;
}

.custom-scroll-bar:hover::-webkit-scrollbar-thumb
{
    background-color: #DADADA;
}

/* FIN SCROLL BAR */

/*AUTOCOMPLETE*/
.ui-autocomplete {
    max-height: 250px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    width:250px;
    z-index:99999999;
}
.ui-menu .ui-menu-item-wrapper{
    font-size: 15px;
    padding: 5px 10px;
    color: #333333;
    border: none !important;
    margin: 0 !important;
}
.ui-menu .ui-menu-item-wrapper.ui-state-active
{
    color: #FFF;
    background-color: var(--secondary);
}
.ui-menu .ui-menu-item
{
    display:block;
}
/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
    height: 250px;
}
.ui-autocomplete-loading {
    background: white url("https://jqueryui.com/resources/demos/autocomplete/images/ui-anim_basic_16x16.gif") center right 10px no-repeat !important;
}

.ui-widget-header {

    border: 1px solid var(--primary) !important;
    background: var(--primary);
    background-position-x: 0;
    background-position-y: 0;
    color: #333333;
    font-weight: bold;
    position: absolute;
}
.ui-widget-header {
    color: white;
}

.ui-widget-header .ui-icon
{
    background-color: white;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
    border-color: var(--primary);
    background-color: var(--primary);
}

a.ui-corner-all.ui-state-hover {
    background: none;
    border: none;
}

a.ui-corner-all.ui-state-hover .ui-icon
{
    background-color: #ccc;
}
/*FIN AUTOCOMPLETE*/

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control
{
    position: relative;
    padding-top: 37px;
    min-width: 100px !important;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before {
    position: absolute;
    top: 5px;
    left: 5px;
    border: none;
    content: "Expandir";
    background: var(--primary);
    color: var(--secondary);
    padding: 3px 4px;
    border-radius: 5px;
    white-space: nowrap;
}

table.dataTable.dtr-inline.collapsed>tbody>tr.dtr-expanded>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr.dtr-expanded>th.dtr-control:before {
    border: none;
    content: "Encoger";
}

#resumen-estadisticas .item-resumen-top {
    margin-bottom: 30px;
}

#resumen-estadisticas {
    display: grid;
    align-items: stretch;
    grid-template-columns: repeat(4, 296px);
    grid-template-rows: repeat(2, 1fr);
    column-gap: 30px;
    row-gap: 10px;
    padding-bottom: 40px;
    border-bottom: 1px dashed var(--primary);
}

#resumen-estadisticas .item-resumen:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
}

#resumen-estadisticas .item-resumen:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
}

#resumen-estadisticas .item-resumen:nth-child(3) {
    grid-column: 2;
    grid-row: 1 / span 2;
}

#resumen-estadisticas .item-resumen:nth-child(4) {
    grid-column: 3;
    grid-row: 1 / span 2;
}

#resumen-estadisticas .item-resumen:nth-child(5) {
    grid-column: 4;
    grid-row: 1 / span 2;
}

#resumen-estadisticas .item-resumen-total span {
    font-size: 16px;
    font-weight: 400;
}

#resumen-estadisticas .item-resumen-total strong {
    font-size: 20px;
    font-weight: 600;
}

#resumen-estadisticas .item-resumen-total.d-flex {
    justify-content: space-between;
    padding-right: 15px;
}

#resumen-estadisticas .item-resumen-top .item-resumen-total.d-flex {
    padding-right: 0;
}

.bloque-flotante {
    width: 400px;
    max-width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100000;
    background-color: white;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
    padding-top: 35px;
}

.bloque-flotante.open {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25);
}

.bloque-flotante-header {
    text-align: center;
    font-size: 25px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 25px;
}

.bloque-flotante-body {
    padding-left: 15px;
    padding-right: 15px;
    list-style: none;
    display: flex;
    flex-direction: column;
}

.bloque-flotante-footer{
    margin-top: 135px;
}

#borrar-filtros {
    font-size: 15px;
    text-decoration: underline;
    cursor: pointer;
}

.cerrar-bloque {
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: pointer;
}

.radio-buttons-flex {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;
    overflow-x: visible;
    margin-bottom: 10px;
}

.custom-check {
    display: flex;
    font-weight: 400;
}

.custom-check .radio-input {
    display: none;
}

.radio-custom {
    width: 25px;
    height: 25px;
    display: inline-block;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    margin-right: 8px;
}

.radio-input:not(:checked) + .radio-custom {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25' fill='none'%3E%3Ccircle cx='12.5' cy='12.5' r='12' fill='white' stroke='%23E52621'/%3E%3C/svg%3E");
}

.radio-input:checked + .radio-custom {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25' fill='none'%3E%3Ccircle cx='12.5' cy='12.5' r='12' fill='white' stroke='%23E52621'/%3E%3Ccircle cx='12.5' cy='12.5' r='7.69231' fill='%23E52621'/%3E%3C/svg%3E");
}

.filtros-estadisticas {
    align-items: flex-end;
}

.dashboard-altas .dashboard-contenido{
    height: 400px;
}

.dashboard-altas {
    width: 100%;
    max-width: 100%;
}

.dashboard-altas .dashboard-titulo {
    font-size: 20px;
    font-weight: 600;
    text-decoration: underline;
}

.container-filtrar {
    display: flex;
    align-items: center;
    gap: 30px;
}

.current_section_afiliados #btn-filtros {
    height: 49px;
}

.item-producto {
    border-radius: 10px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
    padding: 20px 10px;
}

.item-producto-header {
    text-align: center;
}

.img-pack img
{
    border-radius: 10px;
}

.item-producto-subtitulo {
    color: var(--primary);
    font-size: 15px;
}

.item-producto-titulo {
    font-size: 30px;
    background: var(--primary);
    font-family: Philosopher;
    color: white;
    padding: 15px 30px;
    border-radius: 10px;
    font-weight: 700;
}

.item-producto-descripcion {
    font-size: 18px;
    text-align: center;
}

.item-producto-precio {
    text-align: center;
    color: var(--primary);
    font-size: 50px;
    font-weight: 700;
    font-family: 'Philosopher';
}

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

.saldoActual strong
{
    font-size: 35px;
}

.saldoActual span
{
    font-size: 15px;
}

.comprobar-saldoActual {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    cursor: pointer;
}

.comprobar-saldoActual svg {
    margin-bottom: 15px;
}

.saldo-generar-enlace {
    gap: 15px;
}

.botones-inferior {
    gap: 30px;
}

#blockUI_bloqueVideoVisualizar .modal-dialog {
    width: 800px;
    max-width: 100%;
    height: 580px;
}

#blockUI_bloqueVideoVisualizar .modal-content, #blockUI_bloqueVideoVisualizar .modal-body, #bloqueVideoVisualizar, .container-video {
    width: 100%;
    height: 100%;
}

@media only screen and (max-width: 1599px)
{
    #container-login-form form .textoSeccion{margin-left: 0; margin-right: 0}
    #container-login-form form{
        margin-left: 0;
    }
}

@media only screen and (max-width: 1199px)
{
    .header-tabla{margin-bottom: 15px}
}

@media only screen and (max-width: 991px)
{
    #main-menu
    {
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        width: 100dvw;
        opacity: 0;
        visibility: hidden;
        transition: all .2s;
    }

    #main-menu.open
    {
        opacity: 1;
        visibility: visible;
    }

    #wrapper.con-menu {
        display: grid;
        grid-template-columns: 100%;
    }

    .toggle-menu
    {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 20px;
        left: 15px;
    }

    #btn-cerrar-menu
    {
        display: block !important;
        position: absolute;
        right: 15px;
        top: 15px;
    }

    #barra-btns{padding-left: 30px}

    #container-login-form {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #container-login-form form {
        margin-bottom: 30px;
    }

    .tituloSeccion, .subtituloSeccion {
        text-align: center;
    }

    #wrapper.con-menu .contenido {
        padding: 20px 15px;
    }
}

@media only screen and (max-width: 767px)
{

    #container-login-form {
        grid-template-columns: 100%;
        position: relative;
    }

    #user-barra-top, #container-content, #barra-btns, .titulo-seccion{padding-left: 16px; padding-right: 16px}
    .titulo-seccion{margin-top: 20px}
    #container-content{padding-top: 20px; padding-bottom: 0}

    #barra-btns{
        padding-top: 0;
        padding-bottom: 0;
        position: initial;
        box-shadow: none;
        margin-top: 30px;
        gap: 15px 20px;
    }

    div.dt-scroll-body {
        max-height: calc(100vh - 200px) !important;
    }

    #filtros-tabla{
        justify-content: center;
        gap: 25px 30px;
    }

    #filtros-tabla .filtro-fecha, #filtros-tabla .filtro-tipo {
        width: calc(50% - 15px);
    }

    #tablas-contabilidad
    {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
    }

    #resumen-contabilidad {
        display: flex;
        flex-wrap: wrap;
        gap: 24px;
    }

    #resumen-contabilidad .filtro-contabilidad
    {
        width: calc(50% - 12px);
    }

    .item-resumen-icono{display: none}
    .item-resumen-top, .item-resumen-total{padding-left: 0; padding-right: 0}

    .dt-buttons{display: none}

    div.dt-scroll-body .sub-table thead tr th {
        white-space: nowrap;
    }
}

@media only screen and (max-width: 575px)
{
    div.dt-container div.dt-search{
        width: 100%;
    }

    #barra-btns .ms-auto{margin-left: 0 !important}

    #barra-btns .btnStandard {
        gap: 6px;
        padding: 12px 19px;
        font-size: 14px;
        letter-spacing: 1.25px;
    }

    #resumen-contabilidad .item-resumen
    {
        width: calc(100% / 2 - 12px);
        padding-bottom: 15px;
    }
    #resumen-contabilidad .item-resumen:nth-child(5)
    {
        width: 100%;
    }
    #container-login-form {
        background: none;
    }
    #container-login-form form {
        width: 100%;
        border-radius: 0;
        box-shadow: none;
        padding-left: 15px;
        padding-right: 15px;
    }
    .footer-tabla {
        flex-direction: column-reverse;
    }
    #wrapper.con-menu .contenido {
        padding: 55px 15px;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media only screen and (min-width: 576px) and (max-width: 767px)
{
    /* SM */

    #resumen-contabilidad .item-resumen
    {
        width: calc(100% / 3 - 16px);
        padding-bottom: 15px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px)
{

    #tablas-contabilidad
    {
        grid-template-columns: repeat(2, minmax(0, 1fr)) ;
        gap: 25px;
    }

    #tablas-contabilidad > div:nth-child(3)
    {
        grid-column: -1 / 1;
    }

    #resumen-contabilidad {
        display: flex;
        flex-wrap: wrap;
        gap: 24px;
    }

    #resumen-contabilidad .filtro-contabilidad
    {
        width: calc(50% - 12px);
    }

    #resumen-contabilidad .item-resumen
    {
        width: calc(100% / 3 - 16px);
        padding-bottom: 15px;
    }

    .item-resumen-icono{display: none}

}

@media only screen and (min-width: 992px) and (max-width: 1199px)
{
    #container-login-form {
        grid-template-columns: 1fr 520px;
    }

    #tablas-contabilidad
    {
        grid-template-columns: repeat(2, minmax(0, 1fr)) ;
        gap: 25px;
    }

    #tablas-contabilidad > div:nth-child(3)
    {
        grid-column: -1 / 1;
    }

    #resumen-contabilidad {
        display: flex;
        flex-wrap: wrap;
        gap: 24px;
    }

    #resumen-contabilidad .filtro-contabilidad
    {
        width: calc(50% - 12px);
    }

    #resumen-contabilidad .item-resumen
    {
        width: calc(100% / 3 - 16px);
        padding-bottom: 15px;
    }

    .item-resumen-icono{display: none}
}

@media only screen and (min-width: 1200px) and (max-width: 1599px)
{
    #container-login-form {
        grid-template-columns: 1fr 550px;
    }

    #resumen-contabilidad {
        grid-template-columns: repeat(2, 130px) repeat(3, minmax(0, 1fr));
        gap: 25px;
    }

    .item-resumen-top, .item-resumen-total{padding-left: 0; padding-right: 0}


    #tablas-contabilidad
    {
        grid-template-columns: repeat(3, minmax(0, 1fr)) ;
        gap: 25px;
    }
}

@media only screen and (min-width: 1600px) and (max-width: 1919px)
{
    #resumen-contabilidad {
        grid-template-columns: repeat(2, 130px) repeat(3, minmax(0, 1fr));
        gap: 25px;
    }

    #tablas-contabilidad
    {
        grid-template-columns: repeat(3, minmax(0, 1fr)) ;
        gap: 25px;
    }
}