 #loading-overlay {
            position: fixed !important;
            inset: 0 !important;
            width: 100vw !important;
            height: 100dvh !important;
            background: rgba(0,0,0,.65) !important;
            z-index: 2147483647 !important;
            display: none;
            align-items: center !important;
            justify-content: center !important;
        }
        #loading-overlay .cs-loader-inner {
            position: absolute !important;
            top: 50% !important;
            left: 50% !important;
            transform: translate(-50%, -50%) !important;
            text-align: center !important;
            width: auto !important;
            max-width: 300px !important;
        }

        #loading-overlay img {
            display: block !important;
            margin: 0 auto !important;
        }

        .mensaje {
            color: white;
            font-size: 16px;
            margin-top: 10px;
        }


        .btu_tan {
            width: auto;
        }

        .imagen_descuentos_visible {
            display: none;
        }

        /*.color_fondos_ {
            background-color: ;
        }*/


        .invalid-feedback {
            color: red;
        }

        .navbar .navbar-nav {
            display: inline-block;
            float: none;
        }

        .navbar .navbar-collapse {
            text-align: center;
        }

        #slider {
            display: none;
        }

        .botonSlider {
            position: relative;
            font-size: 40px;
        }

        #bottom-footer>img {
            width: 94.5%
        }

        #bottom-footer>img {
            width: 93.5%;
        }

        .flexslider .slides img {
            width: 100% !important;
            height: 100% !important;
        }

        .main>img,
        .main,
        .inner,
        .tarjeta_new {
            width: 100%;
        }

        .formRegistros {
            max-height: 600px;
            overflow-y: auto;
        }

        /************************************************************/
        @media (min-width: 320px) and (max-width:767px) {
            #cuerpoEventos {
                margin-top: -69px;
            }

            #img_login_tf {
                width: 60%;
            }

            #titulo_6 {
                font-size: 22px;
            }

            #ggooegle {
                width: 70%;
                left: 50px !important;
            }

            #facbokk {
                width: 70%;
                left: 50px !important;
                margin-top: 10px;
            }

            #appleweb {
                width: 70%;
                left: 50px;
                margin-top: 10px;
            }

        }

        @media (min-width: 320px) and (max-width: 767px) {
                #contenedorCuerpoPagina {
                    margin-top: 125px;
                }

                #contenedor-encabezado {
                    height: 80px !important;
                }

                .navbar-brand>img {
                    height: 100% !important;
                }
                #modal-login {
                    width: 100%;
                    right: -1px;
                }
            }

            #contenedor-encabezado {
                height: 80px !important;
            }

            .navbar-brand>img {
                height: 100% !important;
            }

            #modal-login {
                width: 100%;
                right: -1px;
            }

            #google {
                left: -3px;
            }

            #login,
            #crear {
                top: 5px;
            }

            #login {
                left: -3px;
            }

            #cerrar {
                top: 10px;
                left: 65px;
            }

            #cerrar2 button {
                width: 135px;
            }

            .btn-login {
                height: 38px;
            }

            #google2 {
                left: 13px;
                padding-left: 0px;
            }

            #facebook2 {
                padding-left: 0px;
                left: 33px;
            }

            #aviso-socio2 {
                font-size: 13px;
            }

            .info-documento2 {
                white-space: normal;
                padding-bottom: 5px;
            }

            #mail-info {
                text-align: center;
            }

            .dimensiones-password {
                padding-left: 15px !important;
                padding-right: 15px !important;
            }

            #contorno {
                /* border:1px solid #ccc; */
            }

            #label-check2 {
                margin-top: -26px;
                margin-bottom: 15px;
            }

            #check {
                left: -78px !important;
                top: 20px;
            }

            #label-check2 strong {
                font-size: 12px !important;
            }

            #modal-login2 {
                height: auto;
            }

            #aceptar2 {
                display: inline-block;
                margin-left: -13px;
                margin-top: -19px;
                margin-bottom: -25px;
            }

        @media (min-width: 375px) and (max-width: 767px) {
            #myModal664 {
                margin-top: 200px;
            }

            #google {
                left: 9px;
            }

            #check {
                left: -121px !important;
            }
        }

        @media (min-width: 425px) and (max-width: 767px) {
            .botones_ccc6 {
                width: 100% !important;
            }

            #myModal664 {
                margin-top: 200px;
            }

            #banner_robo {
                width: 400px;
            }

            #google {
                left: -14px;
            }

            #facebook {
                left: -112px;
            }

            #login {
                left: 198px;
                top: -38px;
            }

            #crear {
                left: -168px;
            }

            #cerrar {
                top: -33px;
                left: 142px;
            }
        }

        /************************************************************/

        @media (min-width: 768px) {
            #myModal664 {
                margin-top: 50px;
            }

            #banner_robo {
                width: 700px;
            }

            #contenedorCuerpoPagina {
                margin-top: 100px;
            }

            #img_login_tf {
                width: 30%;
            }

            #titulo_6 {
                font-size: 36px;
            }

            /*#ggooegle{
                width:100% !important;
            }
            #facbokk{
                width:100% !important;
            }*/

            #modal-login {
                position: relative;
                width: 124%;
                right: 72px;
            }

            #facebook {
                left: 10px;
            }

            #login {
                left: 20px;
            }

            #crear {
                left: 30px;
            }

            #cerrar {
                left: 40px;
            }

            .dimensiones-password {
                padding-left: 15px !important;
                padding-right: 15px !important;
            }

            #modal-dialog2 {
                width: 85%;
                right: 0%;
            }

            #label-check2 {
                margin-top: -15px;
            }

            #check {
                top: 18px;
                left: -214px;
            }

            #aceptar2 {
                display: inline-block;
                margin-top: -10px;
                margin-bottom: -20px;
            }
        }

        /************************************************************/

        /* reglas para la vista en pc/laptop */
        @media (min-width: 992px) {
            #myModal664 {
                margin-top: 50px;
            }

            #banner_robo {
                width: 900px;
            }

            #contenedor-redes-sociales {
                padding-left: 45px;
            }

            #cerrar2 {
                margin-left: -11px;
            }

            #cerrar2 button {
                width: 180px;
            }

            #bottom-footer>img {
                width: 96%;
            }

            #myModal2 {
                width: 100%;
                left: 80px;
            }

            #slider {
                display: inline-block;
                left: 290px;
                left: 80%;
            }

            #modal-dialog2 {
                right: 8%;
            }

            .btn_col {
                position: relative;
                left: 29px;
            }

            .btnfn {
                width: 70%;
            }
        }

        /* fin de las reglas para la vista en pc/laptop */
        /************************************************************/
        @media (min-width: 1440px) {
            #modal-dialog2 {
                right: 6%;
            }
        }

        /************************************************************/
        /* reglas para colocar el boton en vista de escritorio */
        .clase_imagen_der {
            height: 49px !important;
            left: 50px !important;
        }

        .clase_imagen_izq {
            width: 68px !important;
            height: 50px !important;
        }

        .clase_texto_izq {
            top: 25px !important;
            left: -77px !important;
            font-size: 4px;
        }

        .clase_texto_der {
            top: 0px;
            right: -15px;
            font-size: 4px;
        }

        /* fin de las reglas para colocar el boton en vista de escritorio */

        /************************************************************/
        @media (min-width: 1200px) {
            #bottom-footer>img {
                width: 96.2%;
            }

            #banner_robo {
                width: 900px;
            }

            #myModal664 {
                margin-top: 50px;
            }

            .btn_col {
                position: relative;
                left: 29px;
            }

            .btnfn {
                width: 70%;
            }
        }

        /************************************************************/
        @media (min-width: 1440px) {
            #myModal664 {
                margin-top: 50px;
            }

            #banner_robo {
                width: 1200px;
            }

            #modal-login {
                font-size: 21px !important;
                width: 178%;
                /*height: 505px;*/
                right: 235px;
            }

            #slider {
                left: 82%;
            }

            #modal-header exampleModalLabel {
                font-size: 21px;
            }

            .abcRioButtonContents {
                font-size: 17px;
            }

            #facebook .access-label {
                font-size: 19px;
            }

            #login button {
                font-size: 19px;
            }

            #crear button {
                padding-left: 4px;
                font-size: 19px;
                width: 127px;
            }

            #cerrar button {
                font-size: 19px;
            }

            #bottom-footer>img {
                width: 96.5%;
            }

            .btn_col {
                position: relative;
                left: 29px;
            }

            .btnfn {
                width: 70%;
            }

        }

        .relleno {
            /*background-color: #01b1d7;*/
            color: #fff;
        }

        .relleno strong {
            /*color: #fff !important;*/
        }

        #div-documento {
            background-color: #fff;
            color: #01b1d7;
        }

        .importante2 {
            color: #f00;
        }

        #aceptar2 {
            /*background-color: #01b1d7;*/
        }

        #loginEmail {
            border-radius: 20px;
            background: #eeee;
        }

        #loginPassword,
        #password,
        #password1,
        #nombrenw,
        #emailnw {
            border-radius: 20px;
            background: #eeee;
        }

        .contenedor66899 {
            position: relative;
            height: 50px;
            display: flex;
            align-items: center;
            justify-content: center;
        }




        /* ESTILO MODAL KEVIN */
        #modalCrearEven {
            display: none;
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: white;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
            width: 500px;
            padding: 20px;
            z-index: 1050;
        }


        button {
            padding: 8px 12px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }


        .btn-save {
            background-color: #4CAF50;
            color: white;
        }

        .btn-close {
            background-color: #f44336;
            color: white;
        }
        html, body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden !important;
        }

        /* evita que el “rebote” se sienta lateral */
        body {
        position: relative;
        overscroll-behavior-x: none; /* ayuda en algunos browsers */
        }
        

        /* ===== FIX RESPONSIVE: CENTRAR MODAL LOGIN EN WEB SIN ROMPER MÓVIL ===== */
        #myModal .modal-dialog {
            margin: 30px auto;
        }

        #myModal #modal-login {
            position: relative;
            left: auto !important;
            right: auto !important;
            margin: 0 auto !important;
            width: 100% !important;
            max-width: 100% !important;
        }

        @media (min-width: 992px) {
            #myModal {
                text-align: center;
                padding-left: 15px !important;
                padding-right: 15px !important;
            }

            #myModal:before {
                content: '';
                display: inline-block;
                height: 100%;
                vertical-align: middle;
                margin-right: -4px;
            }

            #myModal .modal-dialog {
                display: inline-block;
                vertical-align: middle;
                text-align: left;
                width: 90vw;
                max-width: 900px;
            }

            #myModal #modal-login {
                width: 100% !important;
                max-width: 900px !important;
                right: auto !important;
                left: auto !important;
                margin: 0 auto !important;
            }

            #myModal .btn_col,
            #myModal .com_2bot {
                left: 0 !important;
                margin-left: 0 !important;
                margin-right: 0 !important;
            }

            #myModal #buttonDiv {
                margin-left: auto !important;
                margin-right: auto !important;
            }
        }

        @media (min-width: 1440px) {
            #myModal .modal-dialog {
                max-width: 980px;
            }

            #myModal #modal-login {
                max-width: 980px !important;
                font-size: 21px !important;
            }
        }
        /* FIX MODAL LOGIN MOBILE */
        @media (max-width: 768px){

        #myModal .modal-dialog{
            width: 94% !important;
            max-width: 94% !important;
            margin: 15px auto !important;
        }

        #myModal .modal-content{
            border-radius: 16px !important;
            max-height: 88vh !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
            padding: 15px !important;
        }

        #myModal .modal-body{
            padding: 10px !important;
            overflow-x: hidden !important;
        }

        #myModal img{
            max-width: 100% !important;
            height: auto !important;
        }

        #myModal .row{
            margin-left: 0 !important;
            margin-right: 0 !important;
        }

        #myModal [class*="col-"]{
            width: 100% !important;
            max-width: 100% !important;
            float: none !important;
            padding-left: 0 !important;
            padding-right: 0 !important;
            margin-bottom: 12px !important;
            text-align: center !important;
        }

        #myModal button,
        #myModal .btn,
        #myModal a.btn{
            width: 100% !important;
            max-width: 100% !important;
            margin: 8px 0 !important;
            display: block !important;
        }

        #myModal iframe,
        #myModal .abcRioButton,
        #myModal .g_id_signin{
            width: 100% !important;
            max-width: 100% !important;
            margin: 0 auto 12px auto !important;
        }

        #myModal .close{
            position: absolute !important;
            top: 10px !important;
            right: 14px !important;
            z-index: 20 !important;
        }
        }
    
        /* =========================================================
           FIX DEFINITIVO MODAL LOGIN MOBILE - <?= $domainName; ?>
           Evita que el modal se corte cuando existe buscador/header fijo
           ========================================================= */
        @media (max-width: 767px){

            body.modal-open{
                position: fixed !important;
                width: 100% !important;
                overflow: hidden !important;
                padding-right: 0 !important;
            }

            #myModal{
                position: fixed !important;
                inset: 0 !important;
                width: 100vw !important;
                height: 100dvh !important;
                padding: 10px !important;
                overflow-y: auto !important;
                overflow-x: hidden !important;
                z-index: 99999 !important;
                text-align: center !important;
            }

            #myModal .modal-dialog{
                width: 100% !important;
                max-width: 430px !important;
                height: auto !important;
                margin: 0 auto !important;
                padding: 0 !important;
                position: relative !important;
                top: 0 !important;
                left: 0 !important;
                right: 0 !important;
                transform: none !important;
                display: block !important;
            }

            #myModal #modal-login,
            #myModal .modal-content{
                width: 100% !important;
                max-width: 100% !important;
                min-height: auto !important;
                max-height: none !important;
                margin: 0 auto !important;
                padding: 18px 12px 16px !important;
                left: auto !important;
                right: auto !important;
                top: auto !important;
                transform: none !important;
                border-radius: 16px !important;
                overflow: visible !important;
                box-shadow: 0 12px 35px rgba(0,0,0,.25) !important;
            }

            #myModal .text-center{
                width: 100% !important;
                max-width: 100% !important;
                overflow: visible !important;
            }

            #myModal #img_login_tf{
                display: block !important;
                width: 160px !important;
                max-width: 65% !important;
                height: auto !important;
                margin: 0 auto 4px !important;
            }

            #myModal .tit_16,
            #myModal #titlo1{
                display: block !important;
                font-size: 24px !important;
                line-height: 1.15 !important;
                margin: 2px 0 12px !important;
                color: #1d1730 !important;
                text-align: center !important;
            }

            #myModal #cerrar{
                position: absolute !important;
                top: 8px !important;
                right: 10px !important;
                left: auto !important;
                width: 32px !important;
                height: 32px !important;
                z-index: 30 !important;
                margin: 0 !important;
                padding: 0 !important;
                border-radius: 50% !important;
                background: transparent !important;
            }

            #myModal .cprri,
            #myModal .csrri1,
            #myModal .csrri2{
                width: 100% !important;
                max-width: 100% !important;
                overflow: visible !important;
            }

            #myModal .row,
            #myModal .btn_col,
            #myModal .com_2bot{
                display: block !important;
                width: 100% !important;
                max-width: 100% !important;
                margin: 0 !important;
                padding: 0 !important;
                left: auto !important;
                right: auto !important;
                position: relative !important;
            }

            #myModal [class*="col-"],
            #myModal .botones_ccc6{
                display: block !important;
                width: 100% !important;
                max-width: 100% !important;
                float: none !important;
                margin: 0 0 10px !important;
                padding: 0 !important;
                left: auto !important;
                right: auto !important;
                position: relative !important;
                text-align: center !important;
            }

            #myModal .form-group{
                width: 100% !important;
                margin: 0 0 10px !important;
            }

            #myModal a.btn,
            #myModal button,
            #myModal .btn{
                width: 100% !important;
                min-height: 42px !important;
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                gap: 6px !important;
                margin: 0 !important;
                white-space: normal !important;
                line-height: 1.15 !important;
                font-size: 13px !important;
                border-radius: 14px !important;
            }

            #myModal #buttonDiv,
            #myModal #buttonDiv > div,
            #myModal .abcRioButton,
            #myModal .g_id_signin,
            #myModal iframe{
                width: 100% !important;
                max-width: 100% !important;
                min-width: 100% !important;
                margin: 0 auto !important;
                display: block !important;
            }

            #myModal hr{
                margin: 12px 0 !important;
            }
        }
        
    .captcha-center,
    .captcha-login-wrap{
        height:auto !important;
        min-height:0 !important;
        margin:0 auto !important;
        padding:0 !important;
        overflow:hidden !important;
    }

    .g-recaptcha{
        display:inline-block !important;
        height:78px !important;
        overflow:hidden !important;
    }


        /* =========================================================
           FIX MODALES LOGIN SOBRE HEADER - <?= $domainName; ?>
           Evita que Ingresar/Crear/Olvido queden detrás del menú fijo
           ========================================================= */
        body.modal-open #myModal,
        body.modal-open #myModal009,
        body.modal-open .modal.show,
        body.modal-open .modal.in,
        body.modal-open .modal.fade.in{
            z-index: 2147483001 !important;
        }

        body.modal-open .modal-backdrop,
        body.modal-open .modal-backdrop.in,
        body.modal-open .modal-backdrop.show{
            z-index: 2147483000 !important;
        }

        #myModal .modal-dialog,
        #myModal009 .modal-dialog{
            position: relative !important;
            z-index: 2147483002 !important;
        }

        @media (min-width: 768px){
            #myModal .modal-dialog,
            #myModal009 .modal-dialog{
                margin-top: 90px !important;
            }
        }

        @media (max-width: 767px){
            #myModal,
            #myModal009{
                padding-top: 76px !important;
            }
        }


        /* =========================================================
           FIX GLOBAL DEFINITIVO PARA TODAS LAS MODALES
           Login, crear cuenta, recuperar usuario, recuperar clave,
           alertas y modales internas siempre por encima del header.
           ========================================================= */
        .modal,
        .modal.fade,
        .modal.in,
        .modal.show,
        .bootbox,
        .swal2-container{
            z-index: 2147483600 !important;
        }

        .modal-backdrop,
        .modal-backdrop.fade,
        .modal-backdrop.in,
        .modal-backdrop.show{
            z-index: 2147483500 !important;
        }

        .modal .modal-dialog{
            position: relative !important;
            z-index: 2147483601 !important;
        }

        @media (min-width: 768px){
            .modal .modal-dialog{
                margin-top: 105px !important;
            }
        }

        @media (max-width: 767px){
            .modal{
                padding-top: 85px !important;
            }
            .modal .modal-dialog{
                margin-top: 0 !important;
            }
        }

/* =========================================================
   FIX: ocultar código de seguridad hasta completar registro
   En móvil, la regla general #myModal .row { display:block!important; }
   estaba mostrando prematuramente .contenedor_code2.
   ========================================================= */
@media (max-width: 767px){
    #myModal .contenedor_code2[style*="display:none"],
    #myModal .contenedor_code2[style*="display: none"]{
        display: none !important;
    }
}

/* =========================================================
   FIX INTL-TEL-INPUT / MODAL FACEBOOK
   Evita que la lista de países quede desplegada en móvil
   ========================================================= */

#modal_face .iti {
    position: relative !important;
    display: inline-block !important;
    width: 100% !important;
}

#modal_face .iti__flag-container {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 10 !important;
}

#modal_face .iti__country-list {
    position: absolute !important;
    z-index: 2147483647 !important;
    list-style: none !important;
    text-align: left !important;
    padding: 0 !important;
    margin: 0 0 0 -1px !important;
    background-color: white !important;
    border: 1px solid #ccc !important;
    white-space: nowrap !important;
    max-height: 200px !important;
    overflow-y: scroll !important;
    -webkit-overflow-scrolling: touch !important;
}

/* CLAVE:
   intl-tel-input coloca esta clase cuando el selector está cerrado */
#modal_face .iti__hide {
    display: none !important;
}

@media (max-width: 767px) {

    /* El fix global de modales no debe deformar modal_face */
    #modal_face {
        padding: 15px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    #modal_face .modal-dialog {
        width: calc(100% - 20px) !important;
        max-width: 500px !important;
        margin: 20px auto !important;
        position: relative !important;
    }

    #modal_face .modal-content {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
    }

    #modal_face .modal-body {
        overflow: visible !important;
    }

    #modal_face #emailFace {
        width: 90% !important;
        max-width: 320px !important;
    }

    #modal_face .iti {
        width: 100% !important;
        max-width: 280px !important;
    }

    #modal_face #phone {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #modal_face .iti__country-list {
        width: 280px !important;
        max-width: calc(100vw - 40px) !important;
        max-height: 240px !important;
    }

    /* MUY IMPORTANTE:
       cerrada significa cerrada, aunque otras reglas responsive
       intenten convertir elementos a display:block */
    #modal_face .iti__country-list.iti__hide,
    #modal_face .iti__hide {
        display: none !important;
    }
}
