/********************** LAYOUT ***************************/

@font-face {
    font-family: "Montserrat-Medium";
    src: url('../fonts/Montserrat-Medium.ttf');
}

@font-face {
    font-family: "Montserrat-Regular";
    src: url('../fonts/Montserrat-Regular.ttf');
}
@font-face {
    font-family: "Montserrat-Light";
    src: url('../fonts/Montserrat-Light.ttf');
}

@font-face {
    font-family: "Montserrat-semibold";
    src: url('../fonts/Montserrat-SemiBold.ttf');
}

@font-face {
    font-family: "Gotham-Medium";
    src: url('../fonts/Gotham\ Medium.otf');
}

html * {

    font-family: "Montserrat-Medium";
  }

  :root {
  --black: rgb(24, 24, 24);
  --white: rgb(236, 236, 236);
  --green-light: rgb(26, 155, 96);
  --green: rgb(26, 145, 133);
  --yellow: rgb(234, 172, 36);
}


body {
  background: var(--background-color);
  color: var(--text-color);
  font-weight: var(--font-weight);
  background-image: url(../img/background-white.png);
}

body.light {
  --background-color: var(--white);
  --text-color: var(--black);
  --font-weight: 400;
  background-image: url(../img/background-white.png);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: bottom;
}

body.dark {
  --background-color: var(--black);
  --text-color: var(--white);
  --font-weight: 500;
  background-image: url(../img/background-black.png);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: bottom;
}
/*Light theme*/
.light h4{
    color: rgb(26, 145, 133)!important;
}
.light .navbar-green{
    background: rgb(26, 145, 133)!important;
}
.light .agendar{
    font-weight: 600;
    font-size: 18px;
    color: #181818;
}
.light .agendar-box{
    border: 2px solid #20a195;
    border-radius: 5px;
}
.light .card{
    background-color: #fff;
}
.light  .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
    background: #20a195;
}
.light .btn-cu-primary{
    background-color: #20a195!important;
    border-color: #1A9185!important;
    color: #fff!important;
}

.light .btn-cu-apagado{
    background-color: none !important;
    border-color: #1A9185!important;
    color: #1A9185!important;
    padding: 12px;

}

.dark  .btn-cu-apagado{
    background-color: none !important;
    border-color: #1a9b60!important;
    color: #1a9b60!important;
    padding: 12px;

}

.light .btn-cu-plazo{
    background-color: #ffffff;
    border-color: #5da59e ;
  /*  color: #444444!important;*/
}
.light .btn-reenvio{
    background-color: #fff;
    color: #1A9185;
    border: 0.1rem solid #1A9185!important;
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
}

.light .btn-outline-primary{
    color: #1A9185;
    border-color: #1A9185;
    width: 100%;
    margin: 1em 0;
    padding: 1em 0;
    font-size: 18px;
    font-weight: 600;
}
.light .btn-outline-primary:hover{
    background-color: #1A9185;
    color: #fff;
}

.light .btn-reenvio:hover{
    background-color: #1A9185;
    color: #fff;
    border: 0.2rem solid #1A9185!important;
   
}

.light .tarjetas{
 color: #2c2c2c;
 background-color: #ECECEC;
 border: none!important;
 border-bottom: 0.5px solid #f3f3f3!important;
}
.light .tarjeta-imagen{
    padding: 8px!important;
    background: #2c2c2c2c;
    border-radius: 10px;
}
.light .css-26l3qy-menu div div:hover {background-color: #1A9185!important; color:#fff}

.light .css-26l3qy-menu div div {background-color: #fff!important; color:#181818}

.light .css-1n7v3ny-option{
    background-color: #1ea396!important;
    color: #fff;
}
.light .css-9gakcf-option{
    background-color: #1ea396 !important;
}
.light .modal-title-dt,.light .title {
    color: #1A9185;
}
.light .modal-header-dt {
    border-bottom: solid 1px #1A9185 !important;
}
.light .css-2613qy-menu{
    background: #fff!important;
}
.light .css-187mznn-MuiSlider-root{
    color: #20a195;
}
.light .collapsed-list-prestamo{
    background: #e4e4e4;
    box-shadow: 2px 3px 3px #ccc!important;
}
.light div[aria-pressed="true"]  .vertical-orientation-habilitado{
    color: #fff;
}
.light .importante{
    border: 2px solid #20a195!important;
    background: transparent;
 }
 .light .img-login{
    background-image: url("/dist/img/fondo-gota.png");
    background-size: cover;
    height: 100vh;
}
.light .btn-cu-primary-login{
    background-color: #EAAC24;
    font-weight: 600 !important;
    font-size: 14px;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    color: white;
}
.light .card-tarjeta{
    background: #ECECEC;
    padding: 1rem;
    border-radius: 0.5rem;
    color: #181818;
    box-shadow: 2px 2px 3px #ccc;
}
.light .oficial{ 
    color: #181818;
    font-weight: 600;
}
.light #ahorroVista svg{
    margin: auto;
    color: #20a195; 
}
.light .eyp{
    color: #20a195!important;
}

/*dark theme*/
.dark h4, .dark h6{
    color: rgb(26, 155, 96)!important;
}
.dark .navbar-green{
    background: rgb(24, 24, 24)!important;
    border-bottom: 0.1px solid rgb(233, 233, 233)!important;
}
.dark .oficial{ 
    color: #fff;
    font-weight: 600;
}
.dark .agendar{
    font-weight: 600;
    font-size: 18px;
    color: #fff;
}
.dark .agendar-box{
    border: 2px solid rgb(26, 155, 96);
}
.dark .foot {
    color: #6c757d!important;
}
.dark .card{
    background-color: #181818;
}
.dark .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
    background-color: rgb(26, 155, 96)!important;
}
.dark .css-26l3qy-menu div div {background-color: #181818!important; color:#fff}

.dark .btn-cu-primary{
    background-color: rgb(26, 155, 96)!important;
    border-color: rgb(26, 155, 96)!important;
    color: white!important;
}
.dark .btn-reenvio{
    background-color: #181818;
    color: rgb(26, 155, 96);
    border: 0.2rem solid rgb(26, 155, 96)!important;
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    width: 100%;

}
.dark .btn-reenvio:hover{
    background-color: rgb(28 172 106)!important;
    border-color: rgb(26, 155, 96)!important;
    color: white!important;
}

.dark .btn-cu-primary:hover{
    background-color: rgb(28 172 106)!important;
    border-color: rgb(26, 155, 96)!important;
    color: white!important;
}
.dark nav, .dark .textodrop, .dark .title-important{
    background-color: #181818;
    color: #fff;
}
.dark .tarjetas{
    color: #eeeeee ;
    background-color: #2c2c2c;
    border: none!important;
    border-bottom: 0.5px solid #f3f3f3!important;
}
.dark #pagination-first-page, .dark #pagination-previous-page, .dark #pagination-next-page, .dark #pagination-last-page{
    fill: rgb(255 255 255 / 18%);
}
.dark a:hover, .dark .textodrop:hover{
    color: rgb(26, 155, 96) !important;
}
.dark a[aria-expanded="true"]{
    background-color: rgb(26, 155, 96) !important;
}
.dark a[aria-expanded="true"]:hover, .dark .acceso {
    color: #fff !important;
}
.dark .texto-normal, .dark .icondopdown{
    color: rgb(26, 155, 96)!important;
}
.dark .navbar-nav>.user-menu>.dropdown-menu, .dark .navbar-nav>.user-menu>.dropdown-menu>.user-body a, .dark .navbar-nav>.user-menu>.dropdown-menu>.user-footer{
    background: #181818!important;
    
}
.dark .menuDropdown{
    box-shadow: none;
}
.dark .dropdown-divider{
    border-top: 1px solid #2c2c2c;
}
.dark .btnclose
{
    background: rgb(26, 155, 96)!important;
}
.dark .btn-outline-success-2, .dark .btn-dimo-success-2 {
    box-shadow: none;
} 
.dark .bg-success-cu-secondary{
    background-color: #484848!important;
}
.dark .card-header-tab{
    border-bottom: 1px solid;
}
/* .dark  .zruCi, .dark .ibyvwS, .dark .gcOZAW, .dark .kyinIS {
    background-color:#4B4B4B;
    color: #fff;
} */
/* .dark .jVeafb, .dark .kvZMUr, .dark .gynHCz, .dark  .eSTlnH, .dark .DayPickerInput-OverlayWrapper{
    background-color: #C4C4C4!important;
    color: #4B4B4B;
    
} */

.dark .rdt_TableHeadRow, .dark .rdt_TableRow{
    background-color: #181818;
    color: #fff;
    border-bottom: 1px solid #444!important;
}
.dark .rdt_ExpanderRow{
    background-color: #4c4c4c;
    color: #fff;
}
.dark #ahorroVista svg, .dark #prestamosActivos svg, .dark #aporte svg, 
.dark #solidaridad svg, .dark #ahorroProgramado svg, .dark #rueda svg, 
.dark #plazoFijo svg, .dark #prestamosSolicitados svg, .dark #rueda-adquision svg,
.dark #prestamo-pagos svg, .dark #tarjetas-pagos svg, .dark #comprobantes svg, .dark #sepelio svg {
    margin: auto;
    color: rgb(26, 155, 96); 
}
.dark #comprobantes .fa-download{
    color: #fff;
}

/* .dark .eKwPae svg {
    margin: auto;
    color: rgb(26, 155, 96);
} */
.dark .input-label-bold{
    color: #fff;
}
.dark .current span .title_text{
    background: rgb(26, 155, 96)!important;
}
.dark .img-drop {
    width: 100%;
    outline: 0.2rem dashed rgb(26, 155, 96);
    text-align: center;
    padding: 2rem;
    margin: 1rem 0;
    background-color: #181818;
    transition-duration: .1s;
    transition-timing-function: linear;
}
.dark .text-sugerencia{
    background-color: #181818!important;
    border: 1px solid #C4C4C4;
}
.dark .Toastify__toast--success{
    background: rgb(26, 155, 96)!important;
}
.dark .css-26l3qy-menu{
    background-color: #484848;
}
.dark .bjJLYY{
    color: #fff;
    background-color: #484848;
}
.dark .css-26l3qy-menu div div:hover {background-color: rgb(26, 155, 96) !important;}

.dark .css-26l3qy-menu div div:active, .dark .css-26l3qy-menu div::selection {background-color: rgb(26, 155, 96) !important;}

.dark .css-1n7v3ny-option{
    background-color: rgb(37, 175, 113)!important;
}
.dark .css-9gakcf-option{
    background-color: rgb(26, 155, 96) !important;
}
.dark .css-1s2u09g-control{
    background-color: hsl(0deg 0% 87%)!important;
}
.dark .card {
    box-shadow: 0 0 1px rgb(0 0 0 / 13%), 0 1px 3px rgb(0 0 0);
    margin-bottom: 1rem;
}
.dark .btn-cu-largo-primary{
    background: rgb(26, 155, 96) ;
    border-color: rgb(26, 155, 96)  !important;
}
.dark .btn-cu-largo-primary:hover, .dark .Toastify__toast--success, .dark .pago-servicio-btn-item {
    background: rgb(37, 175, 113) ;
    border-color: rgb(37, 175, 113)  !important;
}
.dark .dropdown-menu, .dark .cEMZEX,  .dark .aCuWv{
    background-color: #181818!important;
    color: #fff;
}
.dark  a{
    color: #cccccc !important;
}
.dark .title, .dark .item-trash, .dark .titulo-verde, .dark .css-187mznn-MuiSlider-root{
    color: rgb(26, 155, 96);
}
.dark .form-control{
    border-radius: 3px;
    background-color: hsl(0deg 0% 87%);
}
.dark .card-empresa-convenio {
    position: relative;
    height: 95%;
    border: 3px solid rgb(26, 155, 96);
    background: #4B4B4B;
}
.dark .btn-teclado{
    background-color: #4B4B4B!important;
    border: none;
}
.dark .card-header {
    padding-top: 5px;
    padding-bottom: 5px;
    color: #fff;
}
.dark .titulo-pagina, .dark .form-detales-trans .p-1, .dark .text-muted, .dark .item-vef, .dark .list-group-item-action, .dark .close{
    color: #fff!important;
}
.dark .modal-content, .dark .login-card-body{
    background-color: #181818;
}
.dark .list-group-item{
    background-color: #181818;
    border-bottom: 1px solid #c4c4c4;
}
.dark .bg-success, .dark .cuenta-nueva-guaranies {
    background-color: rgb(26, 155, 96)!important;
}
.dark .button-habilitar{
    background: none;
}
.dark .login-card-body{
    background-color: #181818;
    border: none;
}
.dark .modal-header-dt {
    border-bottom: solid 1px hsl(0deg 0% 87%)!important;
}
.dark .modal-title-dt, .dark .user-circle svg, .dark .btn-expansible-prestamo {
    color: rgb(26, 155, 96)!important;
}
.dark .btn-outline-success{
    border-color: rgb(26, 155, 96) !important;
    background-color: rgb(26, 155, 96);
    color: #fff !important;
    padding: 0.2rem;
    border-radius: 5px;
}
.dark .btn-outline-success:hover {
    color: white !important;
    background-color: rgb(26, 155, 96) !important;
}
.dark .consideraciones {
    border: 1px solid rgb(26, 155, 96) !important;
    background: rgb(26, 155, 96) !important;
    color: white !important;
    border-radius: 0rem 1.0rem 1.0rem 0rem !important;
    text-align: justify !important;
    margin-left: -22px !important;
    box-shadow: none;
    font-size: 15px;
}

.dark .mensajes{
    border: 1px solid rgb(26, 155, 96) !important;
    background: rgb(26, 155, 96) !important;
    color: white !important;
    border-radius: 0.5rem 0.5rem 0.5rem 0.5rem !important;
    margin-left: 5rem;
    margin-right: 5rem;
    box-shadow: none;
    font-size: 15px;
    line-height: 1.8rem;
}

.dark .border-cards{
    border: none;
}
.dark .mm-popup__box__body, .dark .mm-popup__box{
    background: #4B4B4B;
    color: #c4c4c4;
}
.dark .mm-popup__box__header{
    background: #4B4B4B;
    color: #c4c4c4;
    border: 1px solid #181818 ;
}
.dark .mm-popup__btn--success, .dark .nro-operacion{
    background-color: rgb(26, 155, 96);
    border-color: rgb(26, 155, 96);
}
.dark .seccion-excedente {
    border: none;
}
.dark .null{
    background: #c4c4c4;
}
.dark .collapsed-list-prestamo, .dark .info-box{
    background: #4B4B4B;
    border: #4B4B4B!important;
}
.dark .rueda-nro-contrato-text{
    color: rgb(26, 155, 96);
}
.dark div[aria-pressed="true"] {
    background-color: rgb(26, 155, 96) !important;
    color: white;
}
.dark div[aria-pressed="true"] .rueda-nro-contrato-text, .dark div[aria-pressed="true"]  .vertical-orientation-habilitado{
    color: #fff;
}
.dark .vertical-orientation-habilitado{
    color: rgb(26, 155, 96);
}
.dark .pago-servicio-registro-tabla:hover {
    cursor: pointer;
    background: #4B4B4B;
}
.dark .invoice{
    color: white;
    background: #181818;
    box-shadow: 2px 2px 2px #222222e3;
}
.dark .pago-servicio-comprobante{
    background-color: #c4c4c4;
}
.dark .declaracion{
    padding: 4px;
    border: 2px solid rgb(26, 155, 96);
    color: white;
    box-shadow: none;
 }
 .dark .importante{
    border: 2px solid rgb(26, 155, 96)!important;
    background: transparent;
 }
 .dark .custom-file-qr::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 3;
    display: block;
    height: 2.25rem;
    padding: 2rem;
    line-height: 1.5;
    color: #fff;
    content: "Seleccionar QR";
    background-color: rgb(26, 155, 96);
    border-left: inherit;
    border-radius: 5px 5px 5px 5px;
    text-align: center;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    display: flex;
}
.dark .btnclose:hover {
    color: #fff!important;
}
.dark .img-login{
    background-image: url("/dist/img/fondo-gota-dark.png");
    background-size: cover;
}
.dark .form-login, .dark .select-login{
    background: #181818!important;
    border: none;
    color: #c4c4c4!important;
}
.dark .btn-cu-primary-login{
    background-color: rgb(26, 155, 96);
    font-weight: 600 !important;
    font-size: 14px;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    color: white;
}
.dark .border-aviso{
    border: 2px solid rgb(26, 155, 96);
    background-color: transparent;
    box-shadow: none;
    padding: 0.5rem;
    margin-bottom: 1rem;
    border-radius: 0.25rem;
    color: white;
}
.dark .card-tarjeta{
    background: #4c4c4c;
    padding: 1rem;
    border-radius: 0.5rem;
    color: #fff;
    box-shadow: 2px 2px 3px #000;
}
.dark .aviso-box{
    border: 2px solid rgb(26, 155, 96);
    background: transparent;
    box-shadow: none;
    padding: 0.5rem;
    margin-bottom: 1rem;
    border-radius: 0.5rem;  
}
.dark .cuenta-nueva-dolares {
    background: #EAAC24;
    color: #fff;
    border-radius: 6px;
}
.dark .texto-maximo{
    color: #181818;
}
.dark .btn-ingresar {
    background: #6A117C;
    color: #fff;
    font-family: "Montserrat-Light";
    font-weight: 700;
    width: 70%;
    font-size: 14px;
    padding: 14px;
    border-radius: 5px;
    border: none;
}
.dark .btn-ingresar:hover, .dark .promo-tarjeta .btn-quiero  {
    background: #6A117C;
    color: #fff;
    font-family: "Montserrat-Light";
    font-weight: 700;
    width: 70%;
    font-size: 14px;
    padding: 14px;
    border-radius: 5px;
    border: none;
}
.dark .banner-preaprobado{
    border: 2px solid rgb(26, 155, 96);
}
.dark .texto-credito{
    font-size: 20px;
    text-align: left;
    color: #fff;
    padding-left: 1.5rem;
    font-family: Montserrat-Regular;
}
.dark .texto-banner{
    font-size: 30px;
    font-weight: 500;
    margin-top: -10px;
    text-align: left;
    color: #fff;
    font-family:Montserrat-semibold;
    padding-left: 1.5rem;
}
.dark .socio-mora-pendiente{
    background: #4c4c4c;
}
.dark .navbar-promo {
    background-color: #181818!important;
    border: 2px solid rgb(26, 155, 96);
    box-shadow: 0 0 1px rgb(0 0 0 / 13%), 0 1px 3px rgb(0 0 0 / 20%);
    padding-top: 6px;
    padding-bottom: 10px;
}
.dark .promo-tarjeta, .dark .promo-tarjeta .promo-titulo  {
    color: #fff;
}
.dark .eyp{
    color: rgb(234, 172, 36)!important;
}
.eyepass{
    position: absolute;
    left: 92%;
    top: calc(50% - 0.4em);
    z-index: 9;
}

.input-color{
    background-color: #fff!important;
    opacity: 1;
}
  /*Css switch*/
  .switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 14px;
  }
  
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
  }
  
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: 0.4s;
    transition: 0.4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: 0.4s;
    transition: 0.4s;
  }
  .consider{
    line-height: 2rem;
  }
  .qrcode{
    font-size: 75px;
    color: #C4C4C4;
    
  }
  .qrcodelign{
    display: grid;
    justify-content: center;
  }
  .title-important{
    font-size: 20px;
    color: #181818;
    font-weight: 600;
  }
  .border-cards{
    border: 1px solid #dfdfdf;
    border-radius: .25rem;
  }
  input:checked + .slider {
    background-color: #EAAC24;
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #EAAC24;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }

  .fa-money-bill,
  .fa-file-contract {
    color: #fff!important;
  } 

  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }
  .switch-checkbox {
    padding: 10px;
  }


.content-wrapper{
    background: transparent;
}
.img-login{
    background-image: url("/dist/img/fondo-gota.png");
    background-size: cover;
}
.logo{
    margin-left: 13rem;
    text-align: left;
}
.socios{
    color: #EAAC24;
    text-align: end;
    padding: 1rem;
    position: absolute;
    bottom: 0;
    font-size: 40px;
    font-weight: 600;
    align-items: end;
    justify-content: end;
    display: grid;
    float: right;
    right: 0;
    margin-bottom: 50px;
    text-shadow: 5px 1px 2px #181818, 0 0 1em #181818;
    
}
.textodrop{
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    color: #303030;
    cursor: pointer;
}
.textodrop:hover{
    color: #1A9185;
}
.icondopclose{
    color: #fff;
    float: left;
    background: #EAAC24 ;
    padding: 15px;
    border-radius: 50%;
   
}
.border-qr {
    border: 2px solid gainsboro;
    border-radius: 10px;
    margin: 10px;
    padding: 10px;
}
.teclados{
    display: grid;
    align-items: center;
    justify-content: center;
}
.border-aviso{
    border: 2px solid #20a195;
    background-color: transparent;
    box-shadow: none;
    padding: 0.5rem;
    margin-bottom: 1rem;
    border-radius: 0.25rem;
}
.textclose{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 16%;
}
.textclose:hover{
    color: rgb(245, 239, 239)!important;
}
.texto-login{
    text-align: left;
    margin-bottom: 5px;
    font-size: 15px;
    color: #fff;
    font-weight: 500;
}
.custom-select {
    display: inline-block;
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: .375rem 1.75rem .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    vertical-align: middle;
    border: 1px solid #ced4da;
    border-radius: 3px!important;
    box-shadow: inset 0 1px 2px rgb(0 0 0 / 8%);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.form-control {
    display: block;
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 3px!important;
    box-shadow: inset 0 0 0 transparent;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.re-login{
    color: #fff;
    text-align: center;
    font-size : 14px;
    line-height: 1.5em;
    padding: 0.6rem;
    padding-left:  0.5rem;
    padding-right: 7rem;
    padding-bottom: 0.3rem;
    
}
.drop-mmenu-name{
    display: block;
}
.drop-mmenus{
    display: none;
}
.btn-align{
    margin: 0 5rem;
}
.btnclose{
    background: #1A9185!important;
    color: #fff!important;
    font-family: 'Montserrat-Regular';
    font-size: 16px;
    font-weight: 500;
    border-radius: 24px 10px 10px 24px;
    display: flex;

}
.btnclose:hover{
    color: #fff!important;
}
.btn-esp{
    margin: 0!important;
}
.button-image-ahorro{
    background-image: url("../img/ahorros.png")!important;
    height: 100px;
    /* color: #fff!important; */
    background-size: cover;
    border-radius: 10px;
    display: grid;
    align-items: center;
    padding: auto;
}
/* .button-image-ahorro:hover, .button-image-compromiso:hover, .button-image-prestamo:hover, .button-image-tarjeta:hover{
    transform: scale(1.1);
} */
.button-image-compromiso{
    background-image: url("../img/compromiso.png")!important;
    height: 100px;
    /* color: #fff!important; */
    background-size: cover;
    border-radius: 10px;
    display: grid;
    align-items: center;
    padding: auto;
}
.button-image-prestamo{
    background-image: url("../img/prestamos.png")!important;
    height: 100px;
    /* color: #fff!important; */
    background-size: cover;
    border-radius: 10px;
    display: grid;
    align-items: center;
    padding: auto;
}
.button-image-tarjeta{
    background-image: url("../img/tarjeta.png")!important;
    height: 100px;
    /* color: #fff!important; */
    background-size: cover;
    border-radius: 10px;
    display: grid;
    align-items: center;
    padding: auto;
}
.button-image-subsidio{
    background-image: url("../img/subsidio.png")!important;
    height: 100px;
    /* color: #fff!important; */
    background-size: cover;
    border-radius: 10px;
    display: grid;
    align-items: center;
    padding: auto;
}

.col-resumen .card{
    border-radius: 10px !important;
}
.btn-expansible-resumen{
    text-align: inherit !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 22px;
}
.button-habilitar{
    border: none;
    width: 100%;
}
.button-habilitar .info-box-text{
    font-weight: 300;
    font-size: 15px;
    margin-top: 0.4rem;
}
.button-habilitar .info-box-number{
    margin: 0;
    text-align: center;
    font-size: 32px;
}
.btn-guardar{
    display: flex;
    align-items: center;
    justify-content: center;
}
.dropdown-item:hover, .dropdown-item:active{
    background-color: transparent;
}
.toast-inicio .Toastify__toast-body .Toastify__toast-icon {
    display: none!important;

}
a.linker{
    color: #fff!important;
    /* text-decoration: underline!important; */
    cursor: pointer !important;
    background-color: #EAAC24!important;
    padding: 0.8em;
    border-radius: 5px!important;
}
a.linker:hover{
    color: #fff!important;
}

.menu-main {
    background: aliceblue;
}

.menu-titulo {
    color: #6c757d !important;
    border-bottom: 1px solid #dee2e6 !important;
}
.texto-normal{
    font-family: "Montserrat-semibold";
    color: #20a195;
}
.menu-titulo-imagen {
    float: left;
    max-height: 50px;
}

.menu-link {
    color: white !important;
    font-size: 16px;
    font-weight: 500;
    border-radius: 7px;
}

.icondopdown{
    color: #1A9185!important;
    cursor: pointer;
}

.menu-link:hover {
    color: white !important;
    /*background-color: #02481f !important;  */
}

.navbar-green {
    background-color: #20a195!important;
    box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);
    padding-top: 6px;
    padding-bottom: 10px;
}

.navbar-promo {
    background-color: #fff!important;
    border: 2px solid #1A9185;
    box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);
    padding-top: 6px;
    padding-bottom: 10px;
}
.btn-ingresar{
    background: #6A117C;
    color: #fff;
    font-family: "Montserrat-Light";
    font-weight: 700;
    width: 70%;
    font-size: 14px;
    padding: 14px;
    border-radius: 5px;
}
.btn-ingresar:hover{
    background: #7e2e8f;
    color: #fff;
    font-family: "Montserrat-Light";
    font-weight: 700;
    width: 70%;
    font-size: 14px;
    padding: 14px;
    border-radius: 5px;
}

.titulo-simulador{
    font-weight: bold;
    font-size: 22px;
}

.navbar-light.light {
    background:#1A9185;
}
.navbar-light.dark {
    background:#000;
}

.megamenu-ubicacion {
    margin-top: 0 !important;
    padding-left: 150px !important;
}

.megamenu-no-visualizar-items {
    display: none !important;
}

.megamenu-visualizar-items {
    display: block !important;
}
.menuDropdown{
    margin: 9px;
    border-radius: 13px;
    text-align: left!important;
    box-shadow: 2px 2px 4px #ccc;
}

a[aria-expanded="true"] {
    background-color: #EAAC24 !important;
}

/********************** PAGINA ERROR ***********************/

.text-error {
    color: #adadad !important;
}

/********************** LOGIN *****************************/

.container-login {
    max-width: 100%;
    max-height: 100%;
    padding: 0px;
    margin-top: 0px !important;
}

.login-box-layout {
    width: 100% !important;
    height: 100% !important;
}

.login-row {
    height: 100% !important;
    padding-right: 0px;
    margin-right: 0px;
    padding-left: 0px;
    margin-left: 0px;
}

.login-form {
    padding: 0px !important;
    background: white !important;
}

.login-box-smg-font {
    font-size: 30px !important;
}

.card-login {
    background: '#104e7994' !important;
    box-shadow: '0 0 5px rgba(0,0,0,.5), 0 6px 10px rgba(0,0,0,.3)' !important;
}

.card-body-login {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 8;
}

.card-mensaje {
    box-shadow: none;
    margin-bottom: 1rem;
    border: 1px solid #dad9d9;
}

.card-mensaje-body {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: .9em;
    font-weight: lighter;
    text-align: center;
    text-transform: lowercase;
}

.card-fa-icono-error {
    color: #dc3545;
    font-size: 1.2em;
    float: left;
}

.card-fa-icono-entrust {
    color: #EAAC24;
    font-size: 1.2em;
    float: left;
}

.card-fa-icono-info {
    color: #E30A0A;
    font-size: 1.5em;
    float: left;
}
.texto-importante{
    color: #E30A0A;
    font-family: "Montserrat-Medium";
    font-size: 15px;

}
.info-login-info {
    min-height: 60px !important;
    border: 1px solid #007c34 !important;
    box-shadow: none !important;
    margin-top: 20px !important;
    background: #00000030 !important;
    font-size: 20px;
}

.info-login-error {
    min-height: 60px !important;
    border: 1px solid #dc3545 !important;
    box-shadow: none !important;
    margin-top: 20px !important;
    background: #00000030 !important;
    font-size: 20px;
    border-radius: 12px;
}

.info-login-entrust {
    min-height: 60px !important;
    border: 1px solid #EAAC24 !important;
    box-shadow: none !important;
    margin-top: 20px !important;
    background: #00000030 !important;
    font-size: 20px;
    border-radius: 12px;
}
.info-login-icon {
    background-color: #00000000 !important;
    width: 60px !important;
}

.info-login-text {
    white-space: normal !important;
}

.btn-sombra {
    box-shadow: 0 0 1px rgba(0, 0, 0, .0), 0 1px 10px rgba(0, 0, 0, .1);
}

/********************** ELEMENTOS HTML **********************/

a {
    color: #6c757d !important;
    text-decoration: none !important;
    background-color: transparent !important;
    font-family: "Montserrat-Medium";
}

a:hover {
    color: #1A9185 !important;
    font-family: "Montserrat-Medium";
}

.declaracion{
   padding: 4px;
   border: 2px solid #20a195;
   color: rgb(58, 58, 58);
   box-shadow: none;
}
.btn-pay{
    width: 70%;
}
.Toastify--animate-icon svg{
    fill: #EAAC24;   
}
.titulo-verde{
    color: #1A9185;
    font-size: 24px;
    font-weight: 500;
}
.user-circle{
    display: grid;
    align-items: center;
}
.aviso-box{
    border: 2px solid #20a195;
    background: transparent;
    box-shadow: none;
    padding: 0.5rem;
    margin-bottom: 1rem;
    border-radius: 0.5rem;
    
}

.btn-cu-primary {
    font-weight: 600 !important;
    font-family: "Montserrat-Light";
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    background-color: #20a195 !important;
    color: white !important;
}

.btn-cu-primary:hover {
    background-color: #20a195 !important;
    color: white !important;
    border-color: #20a195  !important;
    font-weight: 600 !important;
}

.btn-cu-terciary{
    background-color: #EAAC24 !important;
    color: white !important;
    border-color: #EAAC24!important;
    font-weight: 600 !important;
    font-family: "Montserrat-Light";
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    /*nuevo*/
}

.btn-table-action {
    padding: 8px 12px;
    margin-bottom: 0.5rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-table-action:last-child {
margin-bottom: 0;
}

.btn-cu-terciary:hover {
    background-color: #f1b637 !important;
    color: white !important;
    border-color: #f1b637  !important;
    font-weight: 600 !important;
    
}

.btn-cu-quartary{
    background-color: #B2B2B2 !important;
    color: #4B4B4B !important;
    border-color: #B2B2B2!important;
    font-weight: 700 !important;
    font-family: "Montserrat-Light";
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    /*nuevo*/
}

.btn-cu-quartary:hover {
    background-color: #9e9e9e !important;
    color: #4B4B4B !important;
    border-color: #B2B2B2  !important;
    font-weight: 700 !important;
    
}

.btn-cu-quintary{
    background-color: #676767 !important;
    color: white !important;
    border-color: #676767!important;
    font-weight: 600 !important;
    font-family: "Montserrat-Light";
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    /*nuevo*/
}

.btn-cu-quintary:hover {
    background-color: #757474 !important;
    color: white !important;
    border-color: #757474 !important;
    font-weight: 600 !important;
    
}

.btn-cu-accion:hover {
    background-color: #e6e6e6 !important;
    color: gray !important;
}

.btn-cu-accion {
    background-color: #5aaa7c !important;
    color: white !important;
    font-weight: 600 !important;
}

.btn-cu-secundary {
    background-color: #EAAC24 !important;
    color: white !important;
    border-color: #EAAC24 !important;
    font-weight: 600 !important;
    width: 100%;
    font-family: "Montserrat-Light";
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    
}
.btn-cu-secundary-apagado{
    background-color:none !important;
    color: 1A9185 !important;
    border-color: #1A9185 !important;
    font-weight: 600 !important;
    width: 100%;
    font-family: "Montserrat-Light";
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    
}

.dark .btn-cu-secundary-apagado{
    background-color:none !important;
    color: 1A9185 !important;
    border-color: #1a9b60 !important;
    font-weight: 600 !important;
    width: 100%;
    font-family: "Montserrat-Light";
    font-size: 12px;
    padding: 10px;
    border-radius: 5px;
    
}



.btn-cu-secundary:hover {
    background-color: #fac146 !important;
    color: white !important;
    border-color: #fac146 !important;
    font-weight: 600 !important;
}
.aviso-ex{
    color: #E30A0A;
    font-size: 24px;
    margin-right: 6px;
}
.input-label {
    margin-bottom: 0px !important;
    font-size: 15px !important;
    font-weight: 300 !important;
}

.input-label-bold {
    margin-bottom: 0px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #303030;
}
.item-trash{
color: #20a195
};


.input-label-bold-obligatorio {
    margin-left: 5px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #303030 !important;
}

.input-label-bold-tiny {
    margin-bottom: 0px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
}

.input-box {
    height: 40px !important;
    font-size: 15px !important;
    padding-top: 3px !important;
    /* text-transform: uppercase; */
}

.input-box-inline {
    border-top: 0px !important;
    border-right: 0px !important;
    border-left: 0px !important;
    margin-Bottom: 7px !important;
    /* text-transform: uppercase; */
}

/********************* DATATABLE *************************/

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #333333 !important;
    border: 1px solid #979797 !important;
    background-color: #ffffff !important;
    background: linear-gradient(to bottom, #ffffff 0%, #ffffff 100%) !important;
    padding-top: 2px;
    padding-bottom: 2px;
}

.table thead th {
    vertical-align: bottom !important;
    border-bottom: 1px solid #dee2e6 !important;
}

.table td, .table th {
    padding: .2rem !important;
    padding-left: 10px !important;
    font-size: 12px !important;
}

.table thead th {
    border-top: 0px !important;
}

.cTEQON {
    min-height: 26px !important;
}

.table-pintar-fila {
    background: #9bf5cf !important;
}

/********************* SELECT *************************/

.select2-selection__rendered {
    margin-top: -10px !important;
    font-size: small;
}

.css-yk16xz-control {
    height: 30px !important;
    min-height: 30px !important;
    flex-wrap: unset !important;
}

.css-g1d714-ValueContainer {
    height: 30px !important;
    min-height: 30px !important;
    position: initial !important;
}

.css-1hb7zxy-IndicatorsContainer {
    height: 30px !important;
    min-height: 30px !important;
    position: initial !important;
}

.css-1pahdxg-control {
    min-height: 30px !important;
    max-height: 30px !important;
    flex-wrap: unset !important;
    border: none !important;
}

/********************* ELEMENTOS ADMINLTE ********************/

.badge-warning {
    color: white !important;
    background-color: #007c34 !important;
}

/* nav link del menu */
.navbar-nav .nav-link {
    padding: .5rem 1rem !important;
}

.nav-link {
    padding: 0.7rem 2rem !important;
    font-family: "Montserrat-Medium";
    font-size: 14px;
}

.texto-credito{
    font-size: 20px;
    text-align: left;
    color: #181818;
    padding-left: 1.5rem;
    font-family: Montserrat-Regular;
}
.texto-banner{
    font-size: 30px;
    font-weight: 500;
    margin-top: -10px;
    text-align: left;
    color: #181818;
    font-family:Montserrat-semibold;
    padding-left: 1.5rem;
}

.texto-banner-Pi{
    font-size: 30px;
    font-weight: 500;
    margin-top: -10px;
    text-align: left;
    color: #181818;
    font-family:Montserrat-semibold;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #fff !important;
    border-radius: 10px 10px 10px 10px;
    background: #1A9185 !important;
    padding: 0.7rem 2rem !important;
}
/* .ellipse{
    height: 100px;
    width: 150px;
    background-color: green;
} */

/* card */

.card-header {
    padding-top: 5px;
    padding-bottom: 5px;
    color: #343a40;
}
.card-header-resumen{
    padding-top: 2px;
    padding-bottom: 5px;
    color: #343a40;
}
.card-header-resumen:hover{
    filter: brightness(0.9);
    cursor: pointer;
}
.texto-resumen{
    font-size: 1.8rem;
    padding-top: 8px;
    font-weight: 500;
}
.plus-resumen{
    padding-top: 30px;
}
.icono-resumen{
    margin-right: 2rem;
}



.card-title {
    font-size: 1.5rem;
}

.card-tools {
    margin-right: 10px;
}

.card-header-tab {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 0px !important;
}

.card-body-tab {
    padding: 0px !important;
}

.card-tab {
    padding: 0px !important;
    margin-bottom: 0px !important;
}

.card-tools-tab {
    margin-right: 10px;
}

.card-filtro {
    border: 1px solid #e0e0e0;
    box-shadow: none;
}

.bg-success {
    background-color: #20a195 !important;
}


.bg-success-cu-secondary{
    background-color: #ECECEC;
}

.small-box>.small-box-footer:hover {
    background-color: #006f2f !important;
    background: rgba(0, 0, 0, .1);
    color: rgba(255, 255, 255, .8);
    display: block;
    padding: 3px 0;
    position: relative;
    text-align: center;
    text-decoration: none;
    z-index: 10;
}


.btn-cu-largo-primary{
    color: #fff !important;
    background: #20a195;
    border-color: #20a195 !important;
    margin-top: 1rem!important;
    width: 100%;
    font-size: 15px;
    padding: 0.5rem;
}

.btn-cu-largo-primary:hover{
    background: #1A9185;
}
.btn-cu-largo-secundary{
    color: #fff !important;
    background: #EAAC24;
    border-color: #EAAC24 !important;
    margin-top: 1rem!important;
    width: 100%;
    font-size: 15px;
    padding: 0.5rem;
}

.btn-cu-largo-secundary:hover{
    background-color: #fac146 !important;
}

.btn-outline-success {
    background-color: #20a195;
    color: #fff !important;
    border-color: #20a195 !important;
    padding: 0.2rem;
    border-radius: 5px;
}

.btn-outline-success:hover {
    color: #fff !important;
    background-color: #20a195 !important;
}
.btn-resolucion{
    color: #20a195!important;
    border: 2px solid #20a195!important;
}
.btn-suerte {
    background-color: rgb(74, 118, 161) !important;
    color: white !important;
    border-color: rgb(85, 123, 160) !important;
}

.super-check {
    width: 25px;
    height: 25px;
}

/********************** ELEMENTOS COMUNES DE PAGINAS **********************/

.titulo-pagina {
    color: #343a40 !important;
    font-weight: inherit !important;
}

.titulo-header {
    color: #1A9185!important;
    margin-bottom: -18px !important;
    /*padding-top: 7px !important; */
    padding-bottom: 7px !important;
    /* margin-top: 15px; */
}

.loading-popup {
    width: 100%;
    height: 100;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000000;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

/********************** PAGO TARJETA **********************/

.detalle-tarjeta {
    margin-bottom: 10px;
    margin-right: -20px;
    margin-left: -20px;
    border-top: 1px solid rgb(239, 239, 239);
    border-bottom: 1px solid rgb(239, 239, 239);
}

/********************** PAGO SERVICIO **********************/

.pago-servicio-categoria {
    color: #007c34 !important;
    text-decoration: none !important;
    background-color: transparent !important;
}

.pago-servicio-categoria:hover {
    color: black !important;
}

.pago-servicio-caja {
    padding-bottom: 0px !important;
    margin: auto !important;
    margin-bottom: 10px !important;
    display: block !important;
    height: 130px;
    cursor: pointer;
}

.pago-servicio-caja-link:hover {
    color: #6c757d !important;
}

.pago-servicio-img {
    width: 100px;
    max-height: 80px;
    display: block;
    margin: auto;
}

img[alt] {
    display: inherit;
}

.pago-servicio-img:before {
    /*Solo se muestra en imágenes rotas*/
    content: attr(alt);
    position: absolute;
    background-color: white;
    color: gray;
    text-align: center;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    font-size: 10px;
}

.pago-servicio-img-2:before {
    /*Solo se muestra en imágenes rotas*/
    content: attr(alt);
    position: absolute;
    background-color: white;
    color: gray;
    text-align: center;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    font-size: 10px;
}

.pago-servicio-img-label {
    text-align: center;
    margin-bottom: 0px;
    font-size: 11px;
    padding-top: 10px;
}

.pago-servicio-categoria>.active {
    color: #6c757d !important;
    border-right: 1px solid white !important;
}

.pago-servicio-listado {
    max-height: 400px;
    overflow-Y: scroll;
    padding-top: 2px;
}

.pago-servicio-item:hover {
    background-color: #e6e6e6 !important;
}

.pago-servicio-btn-item {
    background-color: #20a195;
    color: white;
}

.pago-servicio-comprobante {
    border: 1px solid rgb(229, 229, 229);
    padding: 30px;
    background: #fdfdfd;
    box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 1px rgba(0, 0, 0, .2);
}

.form-validate {
    font-size: 20px;
    color: red;
    padding: 10px;
    margin-bottom: 10px;
}

.form-fecha {
    background-color: #ffffff !important;
    text-transform: lowercase;
}
.titulo{
    margin: 0;
    font-size: 14px;
}
.tarjetas{
    background-color: #eeeeee;
    border: none!important;
    border-bottom: 0.5px solid #f3f3f3!important;
}
.separador-agente{
    margin: 1rem;
}
.img-printer{
    display: flex;
    place-items: center;
    justify-content: center;
    margin: 1rem  0;
}
.tarjeta-align{
    align-items: center;
    justify-content: center;
    display: grid;
    text-align: center;
    padding-top: 15px;
}
.pago-servicio-titulo {
    font-size: 15px;
    font-weight: 600;
}

.pago-servicio-registro-tabla:hover {
    cursor: pointer;
    background: aliceblue;
}

.title-aviso{
    color: #d32138;
    font-weight: 600;
    font-family: "Montserrat-semibold";
    margin: 0;
}

.card-aviso{
    padding-bottom: 0;
    border: none;
}
.card-aviso-completo{
    margin: 2em;
}

/*************** ADQUISICION DE RUEDA  ***********************/

.vertical-orientation-reservado {
    float: left;
    transform: rotate(90deg);
    margin-left: 25px;
    padding: 10px;
    margin-top: -40px;
    font-size: 0.6em;
    color: #FFF;
    text-transform: uppercase;
}

.vertical-orientation-habilitado {
    text-align: center;
    color: #4B4B4B;
    padding-bottom: 5px;
    padding-top: 0px;
    margin-left: 8px;
    padding-left: 0px;
    padding-right: 16px;
    float: left;
    transform: rotate(90deg);
    margin-top: -15px;
    font-size: 0.6em;
    text-transform: uppercase;
}

.rueda-contrato-listado {
    max-height: 400px;
    overflow-Y: scroll;
    padding-top: 2px;
    padding-right: 10px;
}

div[aria-pressed="true"] {
    background-color: #20a195 !important;
    color: white;
}

.rueda-card-contrato-reservado {
    margin-bottom: 10px !important;
    display: block !important;
    background: #a0a0a0 !important;
    color: white !important;
}

.rueda-card-contrato-habilitado {
    margin-bottom: 10px !important;
    display: block !important;
    text-align: left !important;
}

.rueda-nro-contrato-text {
    font-size: larger !important;
    font-weight: 600 !important;
}

.rueda-inhabilitar-listado {
    pointer-events: none;
    opacity: 0.4;
}

.rueda-voy-a-tener-suerte {
    padding: 10px;
    border: 1px solid #4ca370;
    border-radius: 10px;
    text-align: center;
    cursor: pointer;
}

.radio-grande {
    width: 18px !important;
    height: 18px !important;
}

/**************** DATOS GENERALES *********************/

.card-perfil {
    margin-left: -22px !important;
    border-radius: 0em 3em 3em 0em !important;
    padding-top: 20px !important;
    background: #eeeeee;
    box-shadow: 2px 2px 2px #ccc;
}

/**************** DATOS GENERALES *********************/

.seccion-excedente {
    border: 1px solid #dfdfdf;
    border-radius: 5px;
    padding-bottom: 10px;
}

/*************** PANTALLA CONFIRMACION ********************/

.nro-operacion {
    font-weight: 600;
    border-radius: 5px;
    padding: 10px;
    text-align: center;
    color: #fff;
    background-color: #20a195;
    border: 3px solid #20a195;
}

/*************** FORMULARIO EMERGENTE *******************/


/*************** CUENTA DE SOCIO ***********************/

.cuenta-nueva-guaranies{
    background-color: #20a195;
    color: #fff;
    border-radius: 6px;
}
.cuenta-nueva-dolares{
    background: #EAAC24;
    color: #fff;
    border-radius: 6px;
}

.cuenta-socio-card {
    margin-bottom: 0px !important;
    border: 0px !important;
    padding: 0px !important
}


@media all and (min-width: 992px) {
    .navbar .has-megamenu {
        position: static !important;
    }

    .navbar .megamenu {
        left: 0;
        right: 0;
        width: 100%;
        padding: 20px;
    }
}

/*************** TECLADO - PIN ***********************/

.btn-teclado-contenedor {
    padding: 4px !important;
    width: 25% !important;
}

.btn-teclado {
    width: 100% !important;
    padding: 5px !important;
    background: '#ffffff' !important;
    border-color: 'gray' !important;
}

.btn-teclado:hover {
    width: 100% !important;
    padding: 5px !important;
    background: #e0e0e0 !important;
    color: gray !important;
    border-color: 'gray' !important;
}

.row .rowBotones {
    margin-left: -12px;
    margin-right: -12px;
}

/*************** WIZARD ***********************/

display-flex, .steps ul, .title, .number {
    display: flex;
    display: -webkit-flex;
}

list-type-ulli, ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.main-footer{
    background: #C4C4C4;   
}
.main-footer p{
    color: #6c757d !important;
    font-family: "Montserrat-Semibold"!important;
}
.item-vef{
    padding-top: 2px;
    color: #303030;
    font-family: "Montserrat-Semibold"!important;
}

.steps {
    /* border-top: 1px solid #ebebeb; */
    border-bottom: 1px solid #ebebeb;
    padding: 12px 20px;
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 0;
}

.steps ul {
    justify-content: space-around;
    -moz-justify-content: space-around;
    -webkit-justify-content: space-around;
    -o-justify-content: space-around;
    -ms-justify-content: space-around;
}

.steps ul li {
    padding-right: 80px;
    padding-left: 0px;
    position: relative;
    display: grid;
    align-items: center;
    font-family: "Montserrat-Regular";
}

.steps ul li:after {
    position: absolute;
    width: 1px;
    height: 30px;
    content: "";
    background: #ebebeb;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.steps ul li span {
    color: #999;
    text-decoration: none;
    font-weight: bold;
}

.steps ul li:last-child:after {
    width: 0px;
}

/* .steps ul .current span {
    color: #007c34 !important;
} */

.steps ul .current span .number {
    border: 2px solid;
  
}
.step-pasos{
    background: #20a195;
    color: #fff!important;
    padding: 20px 30px;
    border-radius: 10px 10px 0 0;
}
.current span .title_text {
    border-bottom: 2px solid !important;
    background: #20a195;
    color: #fff!important;
    padding: 1rem 3rem;
    border-radius: 10px 10px 0 0;
    font-family: "Montserrat-Regular";
}

.number {
    width: 31px;
    height: 31px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    -o-align-items: center;
    -ms-align-items: center;
    justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    -o-justify-content: center;
    -ms-justify-content: center;
    border: 2px solid #999;
    margin-right: 15px;
}

@media screen and (max-width: 768px) {
    .steps ul {
        flex-direction: column;
        -moz-flex-direction: column;
        -webkit-flex-direction: column;
        -o-flex-direction: column;
        -ms-flex-direction: column;
    }

    .steps ul li:after {
        width: 0px;
    }

    .title {
        margin-top: 20px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* @media screen and (max-width: 600px) {
    .steps ul li {
        padding-right: 0px;
    }
} */

/*************** CONSIDERACIONES **********************/

.consideraciones {
    border: 1px solid #20a195 !important;
    background: #21a195 !important;
    color: white !important;
    border-radius: 0rem 1.0rem 1.0rem 0rem !important;
    text-align: justify !important;
    margin-left: -22px !important;
    box-shadow: 4px 4px 4px #ccc;
    font-size: 15px;
}

.mensajes {
    border: 1px solid #20a195 !important;
    background: #21a195 !important;
    color: white !important;
    border-radius: 0.5rem 0.5rem 0.5rem 0.5rem !important;
    /* text-align: justify !important; */
    margin-left: 5rem;
    margin-right: 5rem;
    box-shadow: 4px 4px 4px #ccc;
    font-size: 15px;
    line-height: 1.8rem;
}

/*************** POPUP SISTEMA ***********************/

.mm-popup {
    display: none;
}

.mm-popup--visible {
    display: block;
}

.mm-popup__overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    overflow: auto;
    background: rgba(0, 0, 0, 0.35);
}

.mm-popup__close {
    /*position: absolute;
    top: 15px;
    right: 20px;
    padding: 0;
    width: 20px;
    height: 20px;
    cursor: pointer;
    outline: none;
    text-align: center;
    border-radius: 10px;
    border: none;
    text-indent: -9999px;
    background: transparent url('data:image/png;base64,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') no-repeat center center;
    background-size: 100%;
    margin: 0;*/
    display: none;
}

.mm-popup__input {
    display: block;
    width: 100%;
    height: 30px;
    border-radius: 3px;
    background: #f5f5f5;
    border: 1px solid #e9ebec;
    outline: none;
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    font-size: 14px;
    padding: 0 12px;
    color: #808080;
}

.mm-popup__btn {
    border-radius: 3px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px;
    margin: 0;
    line-height: 32px;
    height: 32px;
    border: 1px solid #666;
    text-align: center;
    display: inline-block;
    font-size: 15px;
    color: #333;
    background: transparent;
    outline: none;
    text-decoration: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
}

.mm-popup__btn--success {
    background-color: #20a195;
    border-color: #20a195;
    color: #fff;
}

.mm-popup__btn--secundary {
    background-color: #4c4c4c !important;
    color: white !important;
    border-color: #B2B2B2 !important;
}

.mm-popup__btn--danger {
    background-color: #c5545c;
    border-color: #c5545c;
    color: #fff;
}

.notifraude .mm-popup__box{
    left: 30%;
}
.mm-popup__box--itemNoti{
    width: 35%!important;
    position: absolute!important;
    left: 30%!important;
    margin-left: 0!important;
}
.mm-popup__box--itemNoti.mm-popup__box--popover .mm-popup__box__body{
    padding: 0!important;
}
.mm-popup__box {
    width: 350px;
    position: fixed;
    top: 10%;
    left: 50%;
    margin-left: -175px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #B8C8CC;
    overflow: hidden;
    z-index: 5001;
}

.mm-popup__box--popup-grande {
    width: 600px;
    left: 40%;
}

.mm-popup__box__header {
    padding: 15px 20px;
    background: #ffffff;
    color: #454B4D;
    border-bottom: 1px solid #cacaca;
}

.mm-popup__box__header__title {
    margin: 0;
    font-size: 16px;
    text-align: left;
    font-weight: 600;
}

.mm-popup__box__body {
    padding: 10px;
    line-height: 1.4;
    font-size: 14px;
    color: #454B4D;
    background: #fff;
    position: relative;
    z-index: 2;
    white-space: break-spaces;
}

.mm-popup__box__body p {
    margin: 0 0 5px;
}

.mm-popup__box__footer {
    overflow: hidden;
    padding: 10px 20px 10px;
}

.mm-popup__box__footer__right-space {
    float: right;
}

.mm-popup__box__footer__right-space .mm-popup__btn {
    margin-left: 5px;
}

.mm-popup__box__footer__left-space {
    float: left;
}

.mm-popup__box__footer__left-space .mm-popup__btn {
    margin-right: 5px;
}

.mm-popup__box--popover {
    width: 300px;
    margin-left: -150px;
}

.mm-popup__box--popover .mm-popup__close {
    position: absolute;
    top: 5px;
    right: 5px;
    padding: 0;
    width: 20px;
    height: 20px;
    cursor: pointer;
    outline: none;
    text-align: center;
    border-radius: 10px;
    border: none;
    text-indent: -9999px;
    background: transparent url('data:image/png;base64,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') no-repeat center center;
    background-size: 100%;
    margin: 0;
    z-index: 3;
}

.mm-popup__box--popover .mm-popup__box__body {
    padding: 20px;
}


/********************** CARD COLLAPSED *************************/

.btn-expansible {
    text-align: inherit !important;
    color: #20a195 !important;
    font-weight: 600 !important;
    background: #DEEFED;
}

.btn-expansible-prestamo {
    text-align: inherit !important;
    color: #20a195 !important;
    font-weight: 600 !important;
}
.collapsed-list-prestamo {
    border: 1px solid #DEEFED !important;
    box-shadow: none !important;
    background: #DEEFED;
}

.collapsed-list {
    border: 1px solid #ced4da !important;
    box-shadow: none !important;
}




/************************ tarjeta ****************************/

.limite-minimo-label {
    padding-top: 15px;
    padding-left: 15px;
    padding-bottom: 15px;
    padding-right: 40px;
    color: #181818!important;
    background: linear-gradient(to bottom, #ffffff 0%, #fdfdfd 100%) !important;
    box-shadow: rgba(0, 0, 0, 0.125) 0px 0px 1px, rgba(0, 0, 0, 0.4) 0px 1px 3px;
    border-radius: 15px 0px 0px 15px;
}
.limite-minimo-label-pi {
    padding-top: 15px;
    padding-left: 15px;
    padding-bottom: 15px;
    padding-right: 40px;
    color: #181818!important;
    background: linear-gradient(to bottom, #ffffff 0%, #fdfdfd 100%) !important;
    box-shadow: rgba(0, 0, 0, 0.125) 0px 0px 1px, rgba(0, 0, 0, 0.4) 0px 1px 3px;
    border-radius: 10px 10px 10px 10px;
}

/********************** toast ******************************/

.Toastify__toast--success {
    background: #20a195 !important;
    color: white !important;
    padding: 20px !important;
    /*box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.62), 0 2px 15px 0 rgba(0, 0, 0, 0.57) !important;*/
    border-radius: 5px !important;
}

.Toastify__toast-container--bottom-center {
    opacity: .95 !important;
}

.Toastify__progress-bar {
    background-color: #e4e4e4 !important;
}

.Toastify__toast-container--top-right {
    top: 5em !important;
    right: 1em !important;
}

.prueba {
    border: 1px solid red !important;
    border-radius: 5px;
}

/********************** COTIZACION ***********************/

.cotizacion-titulo {
    color: #505050;
    margin-bottom: 0px;
}

.cotizacion-font {
    font-size: 13px;
    color: #505050;
}

.cotizacion-moneda {
    font-weight: 500;
}

.cotizacion-valor {
    font-size: 13px;
}

/********************** PRESTAMO PREAPROBADO ***********************/

.banner-preaprobado {
    box-shadow: 0px 5px 10px -10px #000000;
    background: #fff;
    border: 2px solid #1A9185;
    border-radius: 5px;
    margin: 0;
}

.col-descripcion {
    text-align: end;
    padding-right: 10px;
    color: #eef0f1;
}

.banner-preaprobado .btn-quiero, .promo-tarjeta .btn-quiero {
    font-size: 15px;
    background: #1A9185;
    color: #fff;
    font-family: "Montserrat-Light";
    font-weight: 700;
    width: 70%;
    font-size: 14px;
    padding: 14px;
    border-radius: 5px;
}
.promo-tarjeta .btn-quiero:hover{
    background: #21a195;
}

/********************** EXTRACTO TARJETA ***********************/

@media print {
    button {
        display: none !important;
    }

    .extracto-mastercard .cabecera,
    .extracto-cabal .cabecera {
        font-weight: 700 !important;
        font-size: 13px !important;
        color: #4a4a4a !important;
    }

    .extracto-mastercard .detalle,
    .extracto-cabal .detalle {
        font-weight: 500 !important;
        font-size: 13px !important;
        color: gray !important;
    }
}

.extracto-mastercard .cabecera,
.extracto-cabal .cabecera {
    font-weight: 700 !important;
    font-size: 13px !important;
    color: #4a4a4a !important;
}

.extracto-mastercard .detalle,
.extracto-cabal .detalle {
    font-weight: 500 !important;
    font-size: 13px !important;
    color: gray !important;
}

/*##################### Upload Botton #########################*/
.custom-file-qr::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 3;
    display: block;
    height: 2.25rem;
    padding: 2rem;
    line-height: 1.5;
    color: #fff;
    content: "Seleccionar QR";
    background-color: #20a195;
    border-left: inherit;
    border-radius: 5px 5px 5px 5px;
    text-align: center;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    display: flex;
}

/*##################### PAGINA 500 #########################*/

#notfound {
    position: relative;
    height: 100vh;
}

#notfound .notfound {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.notfound {
    max-width: 767px;
    width: 100%;
    line-height: 1.4;
    text-align: center;
    padding: 15px;
}

.notfound .notfound-404 {
    position: relative;
    height: 220px;
}

.notfound .notfound-404 h1 {
    font-family: 'Kanit', sans-serif;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 186px;
    font-weight: 200;
    margin: 0px;
    background: linear-gradient(130deg, #56906e, #007c34);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    text-transform: uppercase;
}

.notfound h2 {
    font-family: 'Kanit', sans-serif;
    font-size: 33px;
    font-weight: 200;
    text-transform: uppercase;
    margin-top: 0px;
    margin-bottom: 25px;
    letter-spacing: 3px;
}

.imagen img {
    width: 200px;
}

.notfound p {
    font-family: 'Kanit', sans-serif;
    font-size: 16px;
    font-weight: 200;
    margin-top: 0px;
    margin-bottom: 25px;
}

.notfound a {
    font-family: 'Kanit', sans-serif;
    color: #007c34;
    ;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px dashed #007c34;
    ;
    border-radius: 2px;
}

.notfound-social>a {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    width: 40px;
    font-size: 14px;
    color: #007c34;
    ;
    border: 1px solid #efefef;
    border-radius: 50%;
    margin: 3px;
    -webkit-transition: 0.2s all;
    transition: 0.2s all;
}

.notfound-social>a:hover {
    color: #fff;
    background-color: #007c34;
    ;
    border-color: #007c34;
    ;
}

.logout-responsive {
    display: none;
}

@media only screen and (max-width: 480px) {
    .notfound .notfound-404 {
        position: relative;
        height: 168px;
    }

    .notfound .notfound-404 h1 {
        font-size: 142px;
    }

    .notfound h2 {
        font-size: 22px;
    }

    .logout-responsive {
        display: block;
    }
}

.socio-excelencia {
    background: white !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    margin-top: -30px;
    margin-bottom: 30px;
}

.col-2-60 {
    max-width: 60px !important;
}

.socio-tarjeta-oro {
    border-radius: 5px;
    padding: 10px;
    margin-top: 10px;
    background: #e3f3e3;
}

.socio-mora-pendiente {
    border-radius: 5px;
    padding: 10px;
    margin-top: 10px;
    background: #9cd6d0;
    box-shadow: 0 0 10px rgb(0 0 0 / 13%), 0 1px 3px rgb(0 0 0 / 20%);
}

/*############ MAPA ##########*/

.leaflet-grab {
    cursor: pointer !important;
}

.leaflet-control-zoom {
    background: white;
}

.promo-tarjeta {
    color: #181818;
}

.promo-tarjeta .promo-titulo {
    color: #181818;
    font-weight: 400;
    font-size: 1.25em;
}

.promo-tarjeta-shadow h4 {
    font-weight: 500;
    color: #1A9185;
}

.promo-tarjeta-shadow span {
    font-weight: 500;
    color: rgb(80, 80, 80);
}

.promo-tarjeta p, .promo-tarjeta-shadow p {
    font-weight: 200;
    margin: 0;
    font-size: .95em;
}

.promo-tarjeta button, .promo-tarjeta-shadow button {
    font-size: 1.5rem;
    font-weight: 400;
}

.promo-tarjeta-shadow {
    -webkit-box-shadow: inset 0px 0px 50px 0px rgba(228, 228, 228, 1);
    -moz-box-shadow: inset 0px 0px 50px 0px rgba(228, 228, 228, 1);
    box-shadow: inset 0px 0px 50px 0px rgba(228, 228, 228, 1);
}

/*############ DATOS TRANSFERENCIA ##########*/
.card-datos-transferencia {
    background: radial-gradient(circle, white 0%, #f1f1f1 100%);
    border-radius: 15px;
}

.card-datos-transferencia .card-body {
    padding-bottom: 0px;
    box-shadow: 0px 0px 10px -8px #000000;
}

.card-datos-transferencia .card-title {
    color: gray;
    font-size: 14px;
    font-weight: 500;
}

.card-datos-transferencia .card-text {
    font-size: 18px;
    font-weight: 500;
}

.card-datos-transferencia .text-sipap {
    color: gray;
    padding-top: 10px;
    font-size: 15px;
}

.card-datos-transferencia .titulo-titular {
    color: rgb(68, 68, 68);
}

.card-datos-transferencia .nombre-titular {
    color: #007c34;
    text-shadow: 0px 0px 2px #7bb982b8;
}

#modal-datos-transferencia .modal-dialog {
    max-width: 550px !important;
}

.text-flyer p {
    text-align: justify;
    position: relative;
}

.img-flyer {
    position: relative;
    width: 100%;
}

.card-empresa-convenio {
    position: relative;
    height: 95%;
    border: 3px solid #20a195;
}

.card-empresa-convenio .card-body {
    padding: 0.7rem;
}

.card-empresa-convenio .card-title {
    font-size: 1rem;
    font-weight: bold;
}

.card-empresa-convenio .card-text {
    font-size: 0.8rem;
    font-weight: 300;
}

.card-empresa-convenio .card-img {
    /* width: 50%; */
    width: 15rem;
    height: 10rem;
    display: block;
    margin: auto;
}

.card-flyer .card-title {
    font-weight: 500;
}

.card-flyer .card-text {
    font-size: 1em;
}

.leaflet-control-attribution {
    display: none !important;
}

.map-sucursal {
    height: 70vh;
}

.sucursal-list {
    scrollbar-width: thin;
    overflow: auto;
    height: 70vh;
}

.sucursal-list::-webkit-scrollbar {
    width: 8px;
    height: 5px;
    background-color: #f0f0f0;
}

.sucursal-list::-webkit-scrollbar-thumb {
    background: #cdcdcd;
}

.card-sucursal p {
    margin: 0;
}

.card-sucursal .card-title {
    font-weight: 400;
    font-size: 1.3rem;
}

.card-sucursal .card-text {
    font-weight: 300;
}

.card-sucursal .card-body,
.card-sucursal .card-footer {
    padding: 10px;
}

.card-sucursal .card-header {
    padding: 5px 10px;
    color: unset;
}

.card-sucursal .card-distance {
    font-size: 0.8rem;
}

.sucursal-item {
    cursor: pointer;
    padding: 0.7rem;
}

.sucursal-item p {
    font-size: 0.9rem;
}

.location {
    margin: auto auto;
    width: 6rem;
    height: 3rem;
    /* background-color: #1A9185; */
    border-radius: 10% 10%;
    position: relative;
}

.img-location {
    margin: auto;
    width: 50%!important;
    position: relative;
    z-index: 2;
    display: block;
    top: -20%;
}

.close-image {
    position: absolute;
    top: 0.2rem;
    right: 0.7rem;
    cursor: pointer;
    font-size: 1.5rem;
    color: #007c34;
}

.imagen-sugerencia {
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 5px;
    width: 100%;
    height: 75%;
}

.img-drop {
    width: 100%;
    outline: 0.2rem dashed #20a195;
    text-align: center;
    padding: 2rem;
    margin: 1rem 0;
    background-color: #f4f6f9;
    transition-duration: .1s;
    transition-timing-function: linear;
}

.check-conf-tarjeta {
    transform: scale(1.5);
    cursor: pointer;
    vertical-align: text-bottom;
}

.check-conf-tarjeta-disabled {
    pointer-events: none;
    opacity: .18;
}

.change-value {
    font-style: italic;
    font-weight: 500;
}

.radio-dosis {
    transform: scale(1.2);
}



/***********************
 * VALIDAR COMPONENTES *
 ***********************/
.invalid-select {
    width: 100%;
    margin-top: .25rem;
    font-size: 80%;
    color: #dc3545;
}

.invalid-select-border :first-child {
    border-color: #dc3545;
}

/**********************
 * AGREGAR DOCUMENTOS *
 **********************/
.doc-flex {
    display: flex;
    gap: 5px;
}

.doc-content-right {
    justify-content: right;
    padding-right: 30px;
}

 .document-info-button {
    padding-left: 10px;
    padding-top: 5px;
    font-size: 18px;
    color:#007c34;
 }
 .document-info-button:hover {
    cursor: pointer;
 }

 .custom-file-label::after {
    display:none;
 }

 .custom-file-label {
    border-radius: 0.25rem !important;
    overflow: hidden;
 }

.add-document-label {
    margin-bottom: 10px;
    font-size: 15px;
    font-weight: 500 !important;
}

.row-document {
    position: relative;
}

.btn-document {
    gap: 5px;
    border-radius: .25rem !important;
}

.steps ul li {
    padding-right: 40px !important;
}

.btn-descargar-archivo {
    color: white !important;
}

.archivo-fa-icono-error {
    color: #FF0000;
    font-size: 1.5em;
    float: left;
}

.steps.step-doc ul li:after {
    right: -50% !important;
}

.modal-backdrop {
    z-index: -1;
}
.card-body{
    z-index: 0;
}
.input-group-prepend{
    height: 38px;
}
.image_background {
    background-image: url('../img/background_login.png')!important;
    background-image: no-repeat;
    background-image: fixed;
    background-image: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover!important;
    background-position: initial!important;
}
#registerTip {
    margin: 0rem 15rem;
    left: 3px!important;
    text-align: center;
    padding: 6px;
}
.margentab{
    margin-right: 0!important;
  }
@media screen and (min-width:768px) and (max-width: 1024px) and (orientation:portrait) {
  .login-logo{
    padding: 7rem!important;
    bottom: 0;
    position: absolute;
    /* right: 76px; */
    margin: auto;
    right: 0rem;
    left: 0rem;
  }
  .margentab{
    margin: none!important;
  }

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .image_background {
        background-image: url('../img/background-login-tablet.png')!important;
        background-image: no-repeat;
        background-image: fixed;
        background-image: center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover!important;
    }
    .dropdown-menu-left{
        right: 4px!important;
        left: auto!important;
    }
    .con-mobile{
        margin-left: 0;
    }
    .btn-cu-secundary{
        margin-top: 0rem!important;
    }
    .img-login{
        border-radius: 0!important;
    }
    #registerTip {
        margin: 0rem 7rem;
        left: 3px!important;
        text-align: center;
        padding: 6px;
    }
    }


@media only screen and (max-width: 991px){
    .btn-outline-success-2 {
        color: #fff !important;
        border-color: #EAAC24 !important;
        background: #EAAC24!important;
        font-family: "Montserrat-Light";
        font-size: 14px;
        padding: 10px;
        border-radius: 7px;
        box-shadow: 2px 2px 4px #ccc;
        margin: 5% 0;
    }
    .btn-cu-quintary, .btn-cu-primary, .btn-cu-secundary{
        width: 100%;
        font-size: 15px;
    }
    .login-logo {
       
        padding: 2rem;
        bottom: 0;
        position: absolute;
        /* right: 76px; */
        margin: auto;
        right: 0rem;
        left: 0rem;
    }
    .img-login{
        border-radius: 0!important;
    }
    
    .modal-justy{
        max-width: 500px;
    margin: 3rem auto;
    justify-content: center;
    display: flex;
    }
    .texto-resumen {
        font-size: 1.4rem;
        padding-top: 8px;
        font-weight: 500;
    }
    .btn-llegar{
        width: 100%!important;
    }
    .image_background {
        background-image: url('../img/background-login-movil.png')!important;
        background-image: no-repeat;
        background-image: fixed;
        background-image: center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    .current span .title_text {
        border-bottom: none !important;
        background: #20a195;
        border-radius: 8px!important;
        color: #fff!important;
        padding: 1rem 3rem;
        border-radius: 10px 10px 0 0;
        font-family: "Montserrat-Regular";
    }
    .logo {
        /* margin-left: 4rem; */
        margin: auto;
        text-align: center;
        
    }
    .logo .responsive-img{
        width: 250px!important;
    }
    .re-login{
        color: #fff;
        text-align: center;
        font-size : 14px;
        line-height: 1.5em;
        padding: 0rem;
        padding-left:  0rem;
        padding-right: 0rem;
        text-align: justify;
        padding-bottom: 1rem;
    }
    .input-group{
        margin-left: 0!important;
        padding: 0;
    }
    .btn-align{
        margin: 0;
    }
    .socios {

        text-align: center;
        font-size: 35px;
        font-weight: 600;
        margin-bottom: 0.5rem; 
    
    }
    .socios-digitales{
        margin: 0!important;
    }
    .tarj{
        padding-left: 15%!important;
        padding-bottom: 0!important;
    }
    .tarj2{
        padding-left: 12%!important;
    }
    .drop-mmenu-name{
        display: none;
    }
    .drop-mmenus{
        display: block;
    }
    .megamenu-ubicacion {
        margin-top: 0 !important;
        padding-left: 30px !important;
        padding-right: 30px!important;
        left: auto;
        right: 0;
        width: 350px;
    }
    .navbar-nav .nav-link {
        padding: 0.5rem 0.8rem !important;
    }
    .btn-consulta{
        margin-bottom: 1rem!important;
    }
    #registerTip{
        margin: 0rem 1rem;
        left: 3px!important;
    }

}
.conf-prest-inm td{
    padding: 0.9rem !important;
}
.conf-prest-inm th{
    padding: 0.9rem !important;
}

.form-group-1{
  
        margin-bottom: 1rem;
        margin-top: 1rem;
    
}

.colorVinculo{
    color: #11c1a5;
    text-decoration: underline;
    cursor: pointer;  
}

.titValueC{
    font-weight: 500;
    color: #6e6e6e;

}
.dropdownPi{
    margin-top: 3%;
}

.montoMaxRange{
    text-align: right;
}

.boton-plazo{
    width: 70px;
    padding: 6%;
    font-size: 20px;
    color: #000000;
    font-weight: 700 !important;
}

input[type="range"] {
    /* removing default appearance */
    -webkit-appearance: none;
    appearance: none; 
    /* creating a custom design */
    width: 100%;
    cursor: pointer;
    outline: none;
    /*  slider progress trick  */
    overflow: hidden;
    border-radius: 16px;
  }
  
  /* Track: webkit browsers */
  input[type="range"]::-webkit-slider-runnable-track {
    height: 15px;
    background: #ccc;
    border-radius: 16px;
  }
  
  /* Track: Mozilla Firefox */
  input[type="range"]::-moz-range-track {
    height: 15px;
    background: #ccc;
    border-radius: 16px;
  }
  
  /* Thumb: webkit */
  input[type="range"]::-webkit-slider-thumb {
    /* removing default appearance */
    -webkit-appearance: none;
    appearance: none; 
    /* creating a custom design */
    height: 15px;
    width: 15px;
    background-color: #fff;
    border-radius: 50%;
    border: 2px solid #20a195;
    /*  slider progress trick  */
    box-shadow: -407px 0 0 400px #20a195;
  }
  /* Thumb: webkit */
  .dark [type="range"]::-webkit-slider-thumb {
    /* removing default appearance */
    -webkit-appearance: none;
    appearance: none; 
    /* creating a custom design */
    height: 15px;
    width: 15px;
    background-color: #fff;
    border-radius: 50%;
    border: 2px solid rgb(26, 155, 96)!important;
    /*  slider progress trick  */
    box-shadow: -407px 0 0 400px rgb(26, 155, 96)!important;
  }
  
  
  /* Thumb: Firefox */
  input[type="range"]::-moz-range-thumb {
    height: 15px;
    width: 15px;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #20a195;
    /*  slider progress trick  */
    box-shadow: -407px 0 0 400px #20a195;
  }
  
  
  /*=============
  Aesthetics 
  =========================*/
  
  body {
    font-family: system-ui;
  }
  
  h1 {
    color: #4b4949; 
    text-align: center;
  }
  
  
  
  .range {
    display: flex;
    align-items: center;
    max-width: 500px;
    height: 4rem;
    width: 80%;
    background: #fff;
    padding: 0px 10px;
  }

  .presMin{
    font-size: 14px !important;
    color: #877a7a;
  }
 

  .presMax{
    font-size: 14px !important;
    color: #877a7a;
  }
  .content-range{
    height: 1rem;
  }
  #montoCuota{
    font-size: 20px;
    
  }
 
  .light .btn-cu-plazo:hover{
    background-color: #ccc !important;
    /*color: #fff;*/
}

.dark .presMin{
    font-size: 14px !important;
    color: #ccc;
  }
 

 .dark  .presMax{
    font-size: 14px !important;
    color: #ccc;
  }
  .content-range{
    height: 1rem;
  }
  #montoCuota{
    font-size: 22px;
    
  }
  
  .light .btn-cu-plazo:hover{
    background-color: #ccc !important;
    /*color: #fff;*/
}

.btnPlazo{
    background-color: #20a195 !important;
    color: #ffffff !important
}

.dark .btnPlazo{
    background-color: rgb(26, 155, 96) !important;
    color: #ffffff !important
}

.dropdownDocu button{
    background-color: #EAAC24 !important;
    color: white !important;
    border-color: #EAAC24 !important;
    margin-top: 4%;
}
.thSF{
    border: none !important;
}
.titP3{
    padding-left: 3%;
    font-size: 0.9rem;
    margin-bottom: 0%;
}
.titMora{
    color: #6a6a6a;
}
.btn-ingresar-Pi {
    background: #6A117C;
    color: #fff;
    font-family: "Montserrat-Light";
    font-weight: 700;
    width: 70%;
    font-size: 14px;
    padding: px;
    border-radius: 5px;
}
.btn-ingresar-Pi:hover {
    background: #7e2e8f;
    color: #fff;
    
}


.banner-preaprobado-Pi {
    box-shadow: 0px 5px 10px -10px #000000;
    background: #fff;
    border: 1px solid #1A9185;
    border-radius: 5px;
    margin: 0;
}

.texto-credito-Pi{
    font-size: 22px;
    text-align: left;
    font-family: Montserrat-semibold;
    font-weight: 800;
}


.card-body-Pi{
    padding: 0.9rem;
    background: #ececec  !important;
    border-radius: 10px;
}

.dark .card-body-Pi{
    padding: 0.9rem;
    background: none  !important;
    border-radius: 10px;
}

.btn-compro{
    margin:5px  0px 5px 0px  !important;
}

.sub-title-meta{
    color: rgb(26, 145, 133) !important;
    /* font-family: "Montserrat-semibold"; */
    font-size: 17px;
    margin-bottom: 1rem;

}

.row-nombre-meta{
    margin-bottom: 4%;
    margin-top: 3%;
}
.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5); /* fondo opaco */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    color: white;
    font-size: 1.5rem;
  }

  .texto-tipo{
    font-size: 14px;
    color: #525151;

  }
  

.card-sucursal{
    z-index: 9999999999 !important;
}