html, body{
    margin: 0px;
    padding: 0px;
    scroll-behavior: smooth;
}

body{
  font-family: myriad-pro-condensed, sans-serif;
  background-color: #f2f2f2;
}

/********************************/
/********HEADER-DEL-SITIO********/
/********************************/

/**LOGOS-LEGAL**/

.logo-superior {
    position: fixed;
    z-index: 100;
    width: 110px;
    margin: 0%;
  }

.legal-lateral {
    position: absolute;
    top: 80px;
    right: 10px;
    width: 9px;
    z-index: 100;
  }

  .btnFlotante {
    position: fixed;
    bottom: 33px;
    right: 25px;
    width: 75px;
    height: 60px;
    z-index: 700;
    cursor: pointer;
}

.btnFlotante img{
  width: 100%;
}

  /*****MENU-INICIAL******/
.navbar-dark .navbar-toggler {
    color: rgba(255,255,255,.5);
    border-color: rgba(255, 255, 255, 0);
  }


  .bg-dark {
    background-color: #ffffff!important;
    box-shadow: 6px 6px 20px rgb(79, 79, 79);
    position: fixed;
    height: 100vh;
    border-radius: 30px 0 0 0;
  }

  .bg-dark a{
    text-decoration: none;
  }

  .text-white{
    font-size: 18px;
    font-style: italic;
    color: #545454;
    padding-top: 15px;
    text-align: left;
  }

  .text-white b{
    font-size: 15px;
    color: #ed1c27;
    padding-top: 10px;
  }

  .text-white a {
    font-size: 15px;
    color: #ed1c27;
    padding-top: 10px;
    padding-left: 20px;
    text-decoration: none;
  }

  .text-white {
    color: #545454!important;
  }



/******************************/
/********BODY-DEL-SITIO********/
/******************************/

/**MANEJO-DEL-DINERO**/

.ManejoDinero{
    justify-content: center;
    text-align: center;
    padding-top: 50px;
}

.ManejoDinero b{
    font-size: 50px;
    font-style: italic;
    color: #ed1c27;
}

/**MENU-DOS**/

.menuDos{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgba(255,68,68,1) 100%);
    text-align: center;
    justify-content: center;
    font-style: italic;
    font-size: 16px;
    font-weight: 500;
    padding-top: 10px;
    padding-bottom: 10px;
}

.menuDos a{
    color: #fff;
    text-decoration: none;
}

.no-border{
    border: none;
    cursor: pointer;
    border-radius: 30px 30px 30px 30px !important;
}

/******TARJETA-DEBITO********/

.Manejo{
  padding-top: 20px;
}

.Manejo b{
    font-size: 35px;
    font-style: italic;
    color: #ed1c27;
}

.Manejo p{
    font-size: 23px;
    font-style: italic;
    color: #545454;
}

.Manejo p a{
    color: #ed1c27;
    cursor: pointer;
    text-decoration: underline;
}

.Manejo .tarjeta img{
  width: 250px;
  padding-bottom: 50px;
  padding-top: 10px;
}

/*******BENEFICIOS-TARJETA-DEBITO***********/

.beneficios .itemtdd{
    background-color: #fafafa;
    border-radius: 20px;
    display: flex;
    padding-left: 0;
    margin: 5px 5px;
    box-shadow: 2px 2px 10px rgb(205, 205, 205);
  }

  .beneficios .itemtdd b{
  font-size: 19px;
  font-style: italic;
  color: #545454;
  text-align: left;
  font-weight: 500;
  }

  .beneficios .itemtdd p{
    font-size: 16px;
    font-weight: 300;
    color: #545454;
    justify-content: center;
    text-align: left;
    padding-top: 5px;
  }

  .beneficios .itemtdd .imgcard{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgba(255,68,68,1) 100%);
    border-radius: 15px 0 0 15px;
    width: 20%;
    display: flex;
    align-items: center;
  }

  .beneficios .itemtdd .imgcard img{
    width: 50px;
    margin: 0 auto;
  }

  /*************TIPO-CAMBIO************/

.cambio{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgba(255,68,68,1) 100%);
  }


  .cambio .textCambio p{
    font-size: 23px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
  }

  .cambio .textCambio p b{
    font-size: 26px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
  }

  .cambio div b{
    font-size: 35px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .cambio .celular img{
    width: 300px;
    align-items: center;
    padding-top: 10px;
  }

  .recuadro{
    margin-top: 30px;
    margin-bottom: 30px;
  }

  .recuadroUno{
    background-image: url('../img/b8x3X-318f85a8-e945-4d93-a36d-3ae2fa2451bf_bg-recuadro-uno.jpg');
    background-size: cover;
    border-radius: 20px;
    margin: 20px;
    padding: 30px 20px 30px 20px;
    box-shadow: 2px 2px 10px rgb(205, 205, 205);
    transform: scaleY(-16px);
  }

  .recuadroDos{
    background-image: url('../img/LWEN8-a9705832-b9dd-4799-a3b3-641a99b8fec2_bg-recuadro-dos.jpg');
    background-size: cover;
    border-radius: 20px;
    margin: 20px;
    padding: 30px 20px 30px 20px;
    box-shadow: 2px 2px 10px rgb(205, 205, 205);
    transform: scaleY(-16px);
  }

  .recuadroTres{
    background-image: url('../img/DvtkY-912d015b-a320-4c75-b147-acf66959ace2_bg-recuadro-tres.jpg');
    background-size: cover;
    border-radius: 20px;
    margin: 20px;
    padding: 30px 20px 30px 20px;
    box-shadow: 2px 2px 10px rgb(205, 205, 205);
    transform: scaleY(-16px);
  }

  .recuadro h3{
    font-size: 20px;
    font-style: italic;
    font-weight: 400;
    color: #fff;
  }

  .recuadro p{
    font-size: 15px;
    font-weight: 300;
    color: #fff;
  }

  .recuadro p a{
    font-size: 15px;
    font-weight: 500;
    color: #fff;
    text-decoration: underline;
  }

  .recuadro a{
    font-size: 15px;
    font-weight: 500;
    color: #fff;
    text-decoration: underline;
  }

  .ManejoDos b{
    font-size: 35px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .ManejoDos p{
    font-size: 25px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  .ManejoDos .tarjeta img {
    width: 250px;
    padding: 20px 0;
  }

  .ManejoDos p a{
    color: #ed1c27;
    cursor: pointer;
    text-decoration: #ed1c27 underline;
  }

  .ManejoDos strong{
    color: #545454;
    font-size: 30px;
    text-align: center;
    font-style:italic;
  }

  .ManejoDos span{
    font-size: 16px;
    font-weight: 200;
    color: #ed1c27;
    justify-content: center;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
  }


/**********************BENFICIOS FINANZAS EN CASA***************/

.beneficios .itemFC{
    background: linear-gradient(151deg, rgb(232, 232, 232) 0%, rgb(186, 186, 186) 100%);
    border-radius: 20px;
    display: flex;
    padding-left: 0;
    margin: 5px 5px;
    box-shadow: 2px 2px 10px rgb(205, 205, 205);
  }

  .beneficiosSegu .itemFCSegu{
    background: linear-gradient(151deg, rgb(232, 232, 232) 0%, rgb(238, 238, 238) 100%);
    border-radius: 20px;
    display: flex;
    padding-left: 0;
    margin: 15px 20px;
    box-shadow: 2px 2px 10px rgba(205, 205, 205, 0);
  }

  .Promo .itemFCPromo{
    background: linear-gradient(151deg, rgb(232, 232, 232) 0%, rgb(238, 238, 238) 100%);
    border-radius: 20px;
    display: flex;
    padding-left: 0;
    margin: 15px 20px;
    box-shadow: 2px 2px 10px rgba(205, 205, 205, 0);
  }

  .beneficios .itemFC b{
    font-size: 19px;
    font-style: italic;
    color: #343434;
    justify-content: center;
    text-align: left;
    font-weight: 500;
  }

  .beneficiosSegu .itemFCSegu b{
    font-size: 19px;
    font-style: italic;
    color: #545454;
    justify-content: center;
    text-align: left;
    font-weight: 700;
  }

  .Promo .itemFCPromo b{
    font-size: 19px;
    font-style: italic;
    color: #545454;
    justify-content: center;
    text-align: left;
    font-weight: 700;
  }


  .beneficios .itemFC p{
    font-size: 14px;
    font-style: italic;
    font-weight: 200;
    color: #323232;
    justify-content: center;
    padding-top: 5px;
  }
  .beneficiosSegu .itemFCSegu p{
    font-size: 14px;
    font-style: italic;
    font-weight: 200;
    color: #323232;
    justify-content: center;
    text-align: left;
    padding-top: 5px;
  }

  .Promo .itemFCPromo p{
    font-size: 14px;
    font-style: italic;
    font-weight: 200;
    color: #323232;
    justify-content: center;
    text-align: left;
    padding-top: 5px;
  }

  .beneficios .itemFC p a{
    font-size: 14px;
    font-style: italic;
    font-weight: 400;
    color: #323232;
    cursor: pointer;
    text-decoration: underline;
  }

  .beneficiosSegu .itemFCSegu  a{
    font-size: 18px;
    font-style: italic;
    font-weight: 600;
    color: #ed1c27;
    cursor: pointer;
    text-decoration: underline;
  }

  .Promo .itemFCPromo  a{
    font-size: 18px;
    font-style: italic;
    font-weight: 600;
    color: #ed1c27;
    cursor: pointer;
    text-decoration: underline;
  }

  .beneficios .itemFC .imgcardDos{
    background-color: #fff;
    border-radius: 15px 0 0 15px;
    width: 20%;
    display: flex;
    align-items: center;
  }

  .beneficiosSegu .itemFCSegu .imgcardDosSegur{
    background-color: #fff;
    border-radius: 15px 0 0 15px;
    width: 20%;
    display: flex;
    align-items: center;
  }

  .Promo .itemFCPromo .imgcardPromo{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgba(255,68,68,1) 100%);
    border-radius: 15px 0 0 15px;
    width: 20%;
    display: flex;
    align-items: center;
  }

  .beneficios .itemFC .imgcardDos img{
    width: 50px;
    margin: 0 auto;
    align-content: center;
  }

  .beneficiosSegu .itemFCSegu .imgcardDosSegur img{
    width: 50px;
    margin: 0 auto;
    align-content: center;
  }

  .Promo .itemFCPromo .imgcardPromo img{
    width: 50px;
    margin: 0 auto;
    align-content: center;
  }

  .ManejoFinanzas{
    padding-top: 20px;
  }

  .ManejoFinanzas p strong{
    color: #ed1c27;
  }


  .ManejoFinanzas b{
    font-size: 35px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .ManejoFinanzas p{
    font-size: 23px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  /******************CUENTA-MOVIL*****************/

.btn-cuentamovil img{
    width: 250px;
    padding: 40px 10px 40px 10px;
  }

  .cambioDos{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgb(245, 94, 94) 100%);
  }

  .cambioDos .textCambioDos p{
      font-size: 23px;
      font-style: italic;
      color: #ffffff;
  }
  .cambioDos .textCambioDos p a{
    font-size: 23px;
    font-style: italic;
    color: #ffffff;
    text-decoration: underline;
    cursor: pointer;
}

  .cambioDos div b{

    font-size: 35px;
    font-style: italic;
    color: #fff;
  }

  .cambioDos .celular img{
    width: 450px;
    align-items: center;
    padding-top: 10px;
  }

  /********ADELANTO DE SALARIO BENEFICIOS***********/
  .ManejoTres{
    padding-top: 20px;
  }

  .ManejoTres b{
    font-size: 35px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .ManejoTres p{
    font-size: 23px;
    font-style: italic;
    color: #545454;
    text-align: center;
    padding-bottom: 20px;
  }

  .ManejoTres strong{
    color: #545454;
    font-size: 25px;
    text-align: center;
    font-style:italic;
    padding-bottom: 20px;
  }

  .ManejoTres span{
    font-size: 16px;
    font-weight: 200;
    color: #ed1c27;
    justify-content: center;
    text-align: left;
  }

.beneficiosads{
    justify-content: center;
  }

  .beneficiosads .itemads{
    background-color: #fafafa;
    border-radius: 20px;
    display: flex;
    padding-left: 0;
    margin: 5px 5px;
    box-shadow: 2px 2px 10px rgb(205, 205, 205);
  }

  .beneficiosads .itemads b{
    font-size: 16px;
    font-style: italic;
    color: #ed1c27;
    justify-content: center;
    text-align: left;
    font-weight: 600;
  }

  .beneficiosads .itemads p{
    font-size: 16px;
    font-style: italic;
    font-weight: 200;
    color: #545454;
    justify-content: center;
    text-align: left;
    padding-top: 5px;
  }

  .beneficiosads .itemads .imgcard{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgba(255,68,68,1) 100%);
    border-radius: 15px 0 0 15px;
    width: 20%;
    display: flex;
    align-items: center;
  }

  .beneficiosads .itemads .imgcard img{
    width: 50px;
    margin: 0 auto;
  }

  /*********ALCANZAR-LO-QUE-QUIERO********/

.Alcanzar-bg{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgb(245, 94, 94) 100%);
  }

  .Alcanzar{
    justify-content: center;
    text-align: center;
  }

  .Alcanzar b{
    font-size: 45px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }


  .Alcanzar p{
    font-size: 25px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  .Alcanzar p a{
    color: #ed1c27;
    cursor: pointer;
    text-decoration: underline;
  }

  .Alcanzar .appdavi p{
    font-size: 25px;
    font-style: italic;
    color: #545454;
    height: 5px;
  }

  .Alcanzar .appdavi p b{
    font-size: 35px;
    font-style: italic;
    font-weight: 600;
    color: #ed1c27;
  }

  .Alcanzar .imgapp img{
    width: 100px;
    justify-content: center;
  }

  .AlcanzarAPP b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }


  .AlcanzarAPP p{
    font-size: 20px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  .AlcanzarAPP p a{
    color: #ed1c27;
    cursor: pointer;
    text-decoration: underline;
  }

  /*********************BENEFICIOS-ALCANZAR-LO-QUE-QUIERO********************/

.carrusel-alcanza{
    margin-top: 20px;
    margin-bottom: 100px;
  }

  .carousel-indicators{
    bottom: -60px;
  }

  .carousel-indicators li{
    background: rgb(142, 142, 142);
    border-radius: 50px;
    height: 0.5px;
    width: 18px;
  }

  .carousel-indicators .active{
    background-color: #ed1c27;
  }



  .img-textUno{
    width: 100%;
    height: 230px;
    display: block;
    border-radius: 20px;
    padding: 30px 30px;
    background-image: url('../img/7E3EO-1fa17f0f-4b82-40ec-8411-163789aff212_bg-alcanzar-quiero-UNO.png');
    background-size: cover;
    box-shadow: 0 2px 6px rgb(187, 187, 187);
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .img-textUno img, .img-textDos img, .img-textTres img, .img-textCuatro img, .img-textCinco img{
    width: 150px;
    margin-bottom: 5px;
  }

  .img-textUno a, .img-textDos a, .img-textTres a, .img-textCuatro a, .img-textCinco a{
    color: #ffffff;
    text-decoration: #ffffff underline;
    cursor: pointer;
  }

  .img-textDos{
    width: 100%;
    height: 230px;
    display: block;
    border-radius: 20px;
    padding: 30px 30px;
    background-image: url('../img/VRujP-b9c26606-60d5-437c-97ab-8c35c818d5d0_bg-alcanzar-quiero-DOS.png');
    background-size: cover;
    box-shadow: 0 2px 6px rgb(187, 187, 187);
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .img-textTres{
    width: 100%;
    height: 230px;
    display: block;
    border-radius: 20px;
    padding: 30px 30px;
    background-image: url('../img/S9ryF-19dcd5b7-7917-4a14-ad0d-8b73645472c8_bg-alcanzar-quiero-TRES.png');
    background-size: cover;
    box-shadow: 0 2px 6px rgb(187, 187, 187);
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .img-textCuatro{
    width: 100%;
    height: 230px;
    display: block;
    border-radius: 20px;
    padding: 30px 30px;
    background-image: url('../img/ofZ31-fac9322d-14ad-4901-b438-b199a0de44d9_bg-alcanzar-quiero-CUATRO.png');
    background-size: cover;
    box-shadow: 0 2px 6px rgb(187, 187, 187);
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .img-textCinco{
    width: 100%;
    height: 230px;
    align-items: center;
    display: block;
    border-radius: 20px;
    padding: 30px 30px;
    background-image: url('../img/z4fAl-c00d7a05-494b-4216-ad31-8ac34739a6a9_bg-alcanzar-quiero-CINCO.png');
    background-size: cover;
    box-shadow: 0 2px 6px rgb(187, 187, 187);
    margin-top: 5px;
    margin-bottom: 5px;
  }

  .img-textUno h3, .img-textDos h3, .img-textTres h3, .img-textCuatro h3, .img-textCinco h3{
    font-size: 20px;
    font-style: italic;
    color: #fff;
    font-weight: 600;
  }

  .img-textUno p, .img-textDos p, .img-textTres p, .img-textCuatro p, .img-textCinco p{
    font-size: 15px;
    font-style: italic;
    color: #fff;
    font-weight: 400;
  }

  /*******************SEGUROS**********************/
.Seguros-bg{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgb(245, 94, 94) 100%);
  }

  .Seguros{
    justify-content: center;
    text-align: center;
    padding-bottom: 100px;
  }

  .Seguros b{
    font-size: 45px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }


  .Seguros p{
    font-size: 25px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .Seguros p a{
    color: #fff;
    cursor: pointer;
    text-decoration: underline;
  }

  .Modal-Canales {
    font-weight: 500;
    color: #ed1c27;
  }

  .itemtdd p a{
    text-decoration: #ed1c27 underline;
    color: #ed1c27;
    font-weight: 500;
    cursor: pointer;
  }


  /*********************FRAUDES-TIPS************************/

.Fraudes{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgb(245, 94, 94) 100%);
    margin-top: 80px;
    margin-bottom: 80px;
  }

  .Fraudes{
    justify-content: center;
    text-align: center;
  }

  .Fraudes b{
    font-size: 50px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }


  .Fraudes p{
    font-size: 25px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .Fraudes p a{
    color: #fff;
    cursor: pointer;
    text-decoration: underline;
  }

  .Fraudes img{
    width: 350px;
    padding-bottom: 30px;
  }

  .Fraudes .tia-segura{
    padding-top: 30px;
  }

  .Fraudes .tia-segura img{
    width: 250px;
  }

  .Fraudes .tia-segura a{
    cursor: pointer;
  }

  /*********************PROMOCIONES************************/


  .Promo{
    justify-content: center;
    text-align: center;
  }

  .Promo b{
    font-size: 50px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }


  .Promo p{
    font-size: 23px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  .Promo p a{
    color: #fff;
    cursor: pointer;
    text-decoration: underline;
  }

  .Fraudes img{
    width: 350px;
    padding-bottom: 30px;
  }

  .Fraudes .tia-segura{
    padding-top: 30px;
  }

  .Fraudes .tia-segura img{
    width: 250px;
  }

  .Fraudes .tia-segura a{
    cursor: pointer;
  }


  /*********DATOS***********/
  .Datos{
    background: linear-gradient(151deg, rgba(215,0,0,1) 0%, rgb(245, 94, 94) 100%);
    margin-top: 80px;
  }

  .Datos{
    justify-content: center;
    text-align: center;
  }

  .Datos b{
    font-size: 50px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .Datos strong{
    font-size: 35px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }


  .Datos p{
    font-size: 25px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .Datos p a{
    color: #fff;
    cursor: pointer;
    text-decoration: underline;
  }

  .Datos  img{
    width: 250px;
    padding-bottom: 30px;
  }

   .iconDatos img{
    width: 100px;
    padding-bottom: 30px;
  }

  .Datos .TextDatos{
    padding-top: 30px;
  }

  .Datos .TextDatos img{
    width: 250px;
  }

  .Datos .TextDatos a{
    cursor: pointer;
  }




/********************************/
/********FOOTER-DEL-SITIO********/
/********************************/

/**FOOTER**/

.bg-footer{
    font-size: 15px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
    background-color: #545454;
}


/*********************************/
/********MODALES-DEL-SITIO********/
/*********************************/


.modal-content .video iframe{
    border-radius: 30px;
    box-shadow: 2px 2px 10px rgb(92, 92, 92);
  }
/*************************MODAL FORMULARIO***************************/
.modal-body input{
    border-radius: 50px;
   }

  .modal-body select{
    border-radius: 50px;
  }

  .modal-body textarea{
    border-radius: 20px;
  }




  .bg-footer{
    font-size: 15px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
    background-color: #545454;
    padding-left: 50px;
    padding-right: 50px;
  }


      /********************MODAL VIDEOS************************/

  .modal-body img{
    width:70px;
    margin-left: 440px;
    margin-top: -50px;
    z-index: 1;
    position: relative;
    cursor: pointer;
  }



      /********************MODAL INFO ADELANTO DE SALARIO************************/

  .modal-header img{
    width:70px;
    margin-left: 450px;
    margin-top: -50px;
    z-index: 1;
    position: relative;
    cursor: pointer;
  }

  .modal-content{
    border-radius: 20px;
    padding: 0px;
  }


  .modal-header{
    border-radius: 0px;
    border-collapse: collapse;
  }

  .modal-body {
    font-size: 20px;
    color: #545454;
    font-style: italic;
    justify-content: center;
    text-align: center;
  }

  .modal-body b {
    font-size: 20px;
    color: #ed1c27;
    font-style: italic;
    justify-content: center;
    text-align: center;
  }

  .modal-body p {
    font-size: 15px;
    color: #545454;
    font-style: italic;
    justify-content: center;
    text-align: center;
  }

  .modal-body p a {
    color: #ed1c27;
    font-weight:600;
    text-decoration: #ed1c27 underline;
    cursor: pointer;

  }






/*********************************/
/********MEDIA-Q-DEL-SITIO********/
/*********************************/

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


.logo-superior {
    position: fixed;
    z-index: 100;
    width: 80px;
    margin: 0%;
}

}

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


.logo-superior {
    position: fixed;
    z-index: 100;
    width: 70px;
    margin: 0%;
}

}

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


    .modal-body img{
      width:70px;
      margin-left: 445px;
      margin-top: -30px;
      z-index: 1;
      position: relative;
      cursor: pointer;
    }
  }

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


    .modal-body img{
      width:60px;
      margin-left: 415px;
      margin-top: -35px;
      z-index: 1;
      position: relative;
      cursor: pointer;
    }
  }

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


    .modal-body img{
      width:65px;
      margin-left: 335px;
      margin-top: -30px;
      z-index: 1;
      position: relative;
      cursor: pointer;
    }
  }

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


    .modal-body img{
      width:65px;
      margin-left: 310px;
      margin-top: -30px;
      z-index: 1;
      position: relative;
      cursor: pointer;
    }
  }

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



    .modal-body img{
      width:65px;
      margin-left: 295px;
      margin-top: -30px;
      z-index: 1;
      position: relative;
      cursor: pointer;
    }
  }


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



.ManejoDinero b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
}

.Alcanzar b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .Seguros b{
    font-size: 30px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .Fraudes b{
    font-size: 30px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .Promo b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

/******TARJETA-DEBITO********/
.Manejo b{
    font-size: 20px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
}

.Manejo p{
    font-size: 16px;
    font-style: italic;
    color: #545454;
    text-align: center;
}

.cambio .textCambio p{
    font-size: 16px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
  }

  .cambio .textCambio p b{
    font-size: 16px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
  }

  .cambio div b{
    font-size: 20px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .ManejoFinanzas b{
    font-size: 20px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .ManejoFinanzas p{
    font-size: 16px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

.cambioDos .textCambioDos p{
    font-size: 16px;
    font-style: italic;
    color: #ffffff;
}
.cambioDos .textCambioDos p b{
  font-size: 16px;
    font-style: italic;
    color: #ffffff;
}

.cambioDos div b{

  font-size: 20px;
  font-style: italic;
  color: #fff;
}

.ManejoTres b{
    font-size: 20px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .ManejoTres p{
    font-size: 16px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  .ManejoTres strong{
    color: #545454;
    font-size: 18px;
    text-align: center;
    font-style:italic;
  }

}

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


}

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


.ManejoDinero b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
}

.Alcanzar b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .Seguros b{
    font-size: 30px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }


  .Fraudes b{
    font-size: 30px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .Promo b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

}

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


.logo-superior {
    position: fixed;
    z-index: 100;
    width: 40px;
    margin: 0%;
}

.ManejoDinero b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
}

.Alcanzar b{
    font-size: 30px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .Seguros b{
    font-size: 30px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

/******TARJETA-DEBITO********/
.Manejo b{
    font-size: 20px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
}

.Manejo p{
    font-size: 16px;
    font-style: italic;
    color: #545454;
    text-align: center;
}

.cambio .textCambio p{
    font-size: 16px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
  }

  .cambio .textCambio p b{
    font-size: 16px;
    font-style: italic;
    color: #ffffff;
    text-align: center;
  }

  .cambio div b{
    font-size: 20px;
    font-style: italic;
    color: #fff;
    text-align: center;
  }

  .ManejoFinanzas b{
    font-size: 20px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .ManejoFinanzas p{
    font-size: 16px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  .cambioDos .textCambioDos p{
    font-size: 16px;
    font-style: italic;
    color: #ffffff;
}
.cambioDos .textCambioDos p b{
  font-size: 16px;
    font-style: italic;
    color: #ffffff;
}

.cambioDos div b{

  font-size: 20px;
  font-style: italic;
  color: #fff;
}

.ManejoTres b{
    font-size: 20px;
    font-style: italic;
    color: #ed1c27;
    text-align: center;
  }

  .ManejoTres p{
    font-size: 16px;
    font-style: italic;
    color: #545454;
    text-align: center;
  }

  .ManejoTres strong{
    color: #545454;
    font-size: 18px;
    text-align: center;
    font-style:italic;
  }

}

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


.logo-superior {
    position: fixed;
    z-index: 100;
    width: 40px;
    margin: 0%;
}

}