@font-face {
    font-family: 'Raleway-Bold';
    src: url(./assets/Tipografia/Raleway-Bold.ttf) format('truetype');
}

@font-face {
    font-family: 'Raleway-Light';
    src: url(./assets/Tipografia/Raleway-Light.ttf) format('truetype');
}

@font-face {
    font-family: 'Fontspring';
    src: url(./assets/Tipografia/Fontspring-DEMO-allroundgothic-semi.otf) format('truetype');
}

body,html{
    overflow-x: hidden !important;
}

/*------------------------NAVBAR------------------------*/

.bandera{
    width: 20px;
    height: auto;
}
.a-navbar{
    font-family: 'Fontspring';
    font-size: 13px;
    color: #72A1C6 !important;
    padding-right: 0px !important;
    padding-left: 0px !important;

    padding-bottom: 15px;
    padding-top: 20px;
}

.a-navbar-elegido{
    border-bottom:  4px solid #72A1C6;
}

.a-navbar-last{
    font-family: 'Fontspring';
    color: white !important;
    background-color: #0A4064; 
    border-radius: 20px;
    padding-left: 40px !important;
    padding-right: 40px !important;
    padding-top: 1%;
    padding-bottom: 1%;
    font-size: 13px;
    border: none;
}

.img-navbar{
    height: 50px !important;
    width: auto !important;
}

.menuResponsivo {
    display: none !important;
}

.menu {
    display: block !important;
    box-shadow: 0px 1px 10px #D3D3D3;
    z-index: 999999 !important;
    box-sizing: border-box;
}

.dis{
    display: none !important;
}
.dis2{
    display: display !important;
}

/*----------NOSOTROS----------------*/

.transformar-vida{
    font-family: 'Fontspring';
    color: white;
    padding-top:250px !important;
   background-image: url('./assets/Imagenes/Imagenes-01.png') !important;
    background-size: cover;
    background-position: center;
     padding-bottom:250px !important;
}

@media (min-width: 0px) and (max-width: 500px) {
  /* Your CSS rules go here */
 .transformar-vida{
    font-family: 'Fontspring';
    color: white;
    padding-top:0px !important;
   background-image: url('./assets/Imagenes/Imagenes-01.png') !important;
    background-size: cover;
    background-position: center;
     padding-bottom:0px !important;
     padding:0px !important;
}
}


.boton{
    font-family: 'Fontspring';
    color: white !important;
    background-color: #70A0C5; 
    border-radius: 20px;
    border: none;
    padding-right: 2%;
    padding-left: 2%;
    margin-top: 1%;
}

.botonn{
    font-family: 'Fontspring';
    color: white !important;
    background-color: #70A0C5; 
    position: relative;
    border-radius: 20px;
    border: none;
    padding-right: 15%;
    padding-left: 15%;
    padding-top: 3%;
    padding-bottom: 3%;
    margin-top: 1%;
}

.row-uno-nos{
    padding-top: 2%;
}

.nosotros-titulo{
    font-family: 'Fontspring';
    margin-left: 50%;
}

.p-bold{
    font-family: 'Raleway-Bold';
}

.p-light{
    font-family: 'Raleway-Light';
 }

 .mision{
    font-family: 'Raleway-Bold';
    color: #0A4064;
    padding-top: 1%;
 }
 
 hr{
    width: 30%;
    height: 2px;
    background-color:#0A4064;
    margin-top: 0;
    margin-bottom: 2%;
 }

 .col-izq-der-mision{
    padding-top: 1%;
    color: white;
    background-color: #517891 ;
 }

 .col-centro-mision
{
    padding-top: 1%;
    color: white;
    background-color: #0A4064;
}

.img-mision1{
    width: 50px;
    height: auto;
    padding-bottom: 1%;
 }

 .img-mision2{
    width: auto;
    height: 77.23px;
    padding-bottom: 1%;
 }

 h3{
    font-family: 'Raleway-Bold';
 }

 p{
    font-family: 'Raleway-Light';
 }

 .centro-mision{
    padding-bottom:3%;
 }

 /*--------TRANSPARENCIA--------------*/

 .transparencia{
    font-family: 'Fontspring';
    color: white;
    background-image: url('./assets/Imagenes/Imagenes-02.png');
    background-size: cover;
    background-position: center;
    padding-top: 4%;
    padding-bottom: 4%;
    z-index: 1;
    height: auto;
 }

 .img-cidop{
    width: 200px;
    height: auto;
    padding-top: 5%;
    padding-bottom: 5%;
 }
 
 .vertical{
    height: 280px;
    width: 7%;
    background-color: #517891;
 }

 .p-cidop{
    font-family: 'Raleway-Light';
    color: #517891 ;
    margin-bottom: 0;
 }

 .fondo-azul{
    background-color: #0A4064;
 }

 .fondo-azul p{
    color: white;
    font-family: 'Raleway-Light';
 }

 .fondo-azul2{
    background-color: #70A0C5;
 }

 .fondo-azul2 p{
    color: white;
    font-family: 'Raleway-Light';
 }


 .impacto-social{
    background-color:#0A4064;
 }

 .impacto-social-h{
    color: white;
    font-family: 'Raleway-Bold';
 }

 .impacto-social-p{
    color: white;
    font-family: 'Raleway-Light';
 }

 .impacto-social-h2{
    color: #0A4064;
    font-family: 'Raleway-Bold';
 }

 .impacto-social-p2{
    color: #0A4064;
    font-family: 'Raleway-Light';
 }

 .impacto-social-h3{
    color: #DCE6EF;
    font-family: 'Raleway-Bold';
 }

 .impacto-social-p3{
    color: #70A0C5;
    font-family: 'Raleway-Light';
 }

 .align-center {
    display: flex;
    flex-direction: column;
    justify-content: center;
}


.columna-impacto{
    width: 100%; /* Ancho igual al contenido de la columna */
    padding-top: 1%;
    min-height: 210px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.row-impacto{
    width: 100%;
    height: 270px;
}

.web{
    display: block !important;
}

.responsivo{
    display: none !important;
}

.img-responsivo{
    width: 100%;
    height: auto;
}





/*---------------------DATOS----------------------*/

.padre{
    position: relative;
    width: 100%;
}

.contenedor1{

    width: 100%;
    padding: 0;
    height: auto;
    background-image: url(./assets/fondos-01.png);
    background-size: 100% 100% ; /* La imagen de fondo se ajustará para cubrir todo el div */
    background-repeat: no-repeat;
    position: absolute;
    margin-bottom: 30%;
    z-index: 9999;
    background-color: #E6E6E6;
}

.contenedor2{
    z-index: 1;
    position: relative;
    top: 255px;
    height: auto;
    background-color: #E6E6E6;
    padding-top: 50px;
    padding-bottom: 50px;
}

.contenedor3{
    width: 100%;
    height: 100%;
    background-image: url('./assets/fondos-02.png');
    background-size: 100% 100% ; /* La imagen de fondo se ajustará para cubrir todo el div */
    background-repeat: no-repeat;
    position: absolute;
    z-index: 9999;
    padding-top: 100px;
    top: 540px;
    background-color: #E6E6E6;
}


.p-datos{
    color: #9EB4C2;
    font-family: 'Raleway-Light';
    font-size: large;
    position: absolute;
    right: -85px;
}

.img-saliendo{
    position: absolute; 
    top:-80px;
    width: 300px;
}

.img-saliendo2{
    position: absolute;
    top: -100px;
    width: auto;
    height:350px;
    padding-left: 20%;

}

.columna-cont2{
    padding-right: 2%; 
    position:relative;
}

.columna-cont1{ 
    position:relative;
    align-items: end;
}

.img-izq-medio{
    height: 350px;
    width: auto;
}

.contenedor-medio{
    padding-top: 5%;
    padding-right: 0;
}

.contenedor-der{
    padding-top: 8%;
}


.h6-datos{
    font-family: 'Raleway-Bold';
    color: #0A4064;
    padding-top: 4%;
}

.img-datos{
    width: 250px;
    height: auto;
}
 .con-margen{
    margin-top:550px
 }


 /*---------------------PROYECTO--------------*/


.img-proyecto{
    width: auto;
    height: 610px;
}

.h-proyecto{
    font-family: 'Raleway-Bold';
    color: white;
}

.h-proyecto2{
    font-family: 'Raleway-Bold';
    color: #0A4064;
    padding-left: 3%;
    padding-top: 2%;
}

.contenedor-proyecto{
    background-color: white;
    border-top-left-radius: 4% 30%;
    border-bottom-left-radius: 4% 30%;
}

.triangle {
    width: 0; 
    height: 0; 
    border-left: 50px solid #0A4064;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    left: 0;
    margin-top: 35%;
    transform: translateY(-50%);
}

.triangle2{
    width: auto; 
    height: 100%; 
    border-left: 50px solid white;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    left: 0;
    margin-top: 35%;
    transform: translateY(-50%); 
}

/*-------------------------------CONTACTO-------------------*/

.contacto-izq{
    background-image: url(./assets/Imagenes/Imagenes-03.png);
    background-size: cover;
    width: auto;
    max-height: 1000px;
}

.contacto{
    min-height:650px; 
    max-height: 1000px;
}

.contacto-der-padre{
    height: 100%;
}

.contacto-der{
    background-color: #70A0C5;
}

#inputs{ 
    background-color: transparent;
    border: 2px solid white;
    width:100%;
    padding-top: 8px;
    padding-bottom: 8px;
}

#inputs::placeholder{
    color: white;
    padding-left: 10px;
    font-family: 'Raleway-Light';
}

.boton2{
    font-family: 'Fontspring';
    color: #0A4064 !important;
    background-color: white; 
    border-radius: 20px;
    border: none;
    padding-right: 6%;
    padding-left: 6%;
    margin-left: 2%;
    top: -10px;
    margin-bottom: 3%;
}

.contacto-der-abajo{
    background-color: #0A4064;
}

.cont-saliendo{
    position: relative;
}

.img-saliendo3{
    position: absolute; 
    top:-18px;
    width: 75%;
    height: auto;
}

/*--------------------FOOTER------------------*/

.footer{
    background-color: white;
}

.a-footer{
    font-family:"Fontspring"; 
    color: #0A4064;
}

.a-politica{
    font-family:"Raleway-light"; 
    color:#70A0C5; 
    font-size: small;
}

.boton3{
    font-family: 'Fontspring';
    color: white !important;
    background-color: #70A0C5; 
    border-radius: 20px;
    border: none;
    padding-right: 3%;
    padding-left: 3%;
    margin-left: 2%;
    top: -10px;
    margin-bottom: 3%;
}

.img-footer{
    height: 50px !important;
    width: auto !important;
}

.hr-footer{
    height: 1px;
    width: 75%;
    background-color: #0A4064;
}

.iconos-redes{
    padding-left: 38%; 
    padding-top: 1%;
}

/*---------------------------------------VERSION 2 -------------------------------------*/

.hola{
    font-size:50px;
    font-family: 'Raleway-Bold';
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 1%;
}

.hola img{
    width: auto;
    height: 50px;
}

.hola-p{
    font-family: 'Raleway-Light' !important;
    padding-bottom: 1%;
}

.p-hola{
    font-family: 'Raleway-Bold' !important;
}

.bold-azul{
    font-family: 'Raleway-Bold' !important;
    color: #0A4064;
}

.light-azul{
    font-family: 'Raleway-Light' !important;
    color: #0A4064;
}

.img-fundadora{
    width: 60%;
    height: auto;
    margin-bottom: 1%;
}

.mision-fondo{
    background-color: #DCE6EF;
}

.vision-fondo{
    background-color: #70A0C5;
}

.vision{
    font-family: 'Raleway-Bold';
    color: white;
}

.vision-fondo hr{
    width: 30%;
    height: 2px;
    background-color:white;
    margin-top: 0;
    margin-bottom: 2%;
 }

 .vision-fondo p{
    font-family: 'Raleway-Light';
    color: white;
 }

 .objetivo{

    width: 100%;
    padding: 0;
    height: 400px;
    background-image: url(./assets/fondos-01.png);
    background-size: 100% 100% ; /* La imagen de fondo se ajustará para cubrir todo el div */
    background-color: transparent;
    background-repeat: no-repeat;
    position: absolute;
    margin-bottom: 30%;
    z-index: 9;
}


 .objetivo-h-bold{
    font-family: 'Fontspring';
    font-weight: bold;
    color: white;
    padding-top: 6%;
 }

 .objetivo-h{
    font-family: 'Raleway-Light';
    color: white;
    padding-bottom: 6%;
 }

 .objetivo p{
    font-family: 'Raleway-Light';
    color: white;
 }

 .objetivo img{
    height: auto;
    width: 130px;
 }

 .donativo{
    background-color: #DCE6EF;
    padding-bottom: 3%;
 }

 .donativo span{
    font-size: 190px;
    height: 90px;
    line-height: 130px;
    display: inline-block;
    color: #AABBCA;
    font-family: 'Raleway-Bold';
 }

 .donativo-img{
    height: 90px;
    width: auto;
 }

 .fondo-icono{
    background-image: url('./assets/Version2/Texturas/Fondo.png');
    background-position: center;
    background-size: cover;
 }

 .col-bene{
    background-color: #70A0C5;
 }

 .col-bene2{
    background-color: #DCE6EF;
 }

 .beneficiados-h{
    color: white;
    font-family: 'Raleway-Bold';
 }

 .row-evento{
    background-color: #DCE6EF;
    margin-left: 2.8%;
    margin-right: 2.8%;
    margin-bottom: 2%;
 }

 .padding-evento{
    padding-top:28%;
 }

 .row-evento-p{
    background-color: #70A0C5;
    margin-left: 2.8%;
    margin-right: 2.8%;
    margin-bottom: 2%;
 }

 .h-num-even{
    font-family: 'Raleway-Bold';
    color: #70A0C5;
 }

 .h-num-even-p{
    font-family: 'Raleway-Bold';
    color: white;
 }

 .h-mes-even{
    font-family: 'Raleway-Light';
    color: #70A0C5;
 }

 .h-mes-even-p{
    font-family: 'Raleway-Light';
    color: white;
 }

 .boton-even{
    font-family: 'Fontspring';
    color: white !important;
    background-color: #70A0C5; 
    border-radius: 20px;
    border: none;
    padding-right: 15%;
    padding-left: 15%;
}

.boton-even-p{
    font-family: 'Fontspring';
    color: white !important;
    background-color: #0A4064; 
    border-radius: 20px;
    border: none;
    padding-right: 15%;
    padding-left: 15%;
}

.convocatoria{
    background-color: #DCE6EF;
    background-image: url('./assets/Version2/Texturas/Fondo.png');
    background-position: center;
    background-size: cover;
}

.convocatoria-ab{
    color: #0A4064;
    font-family: 'Raleway-Bold';
}

.convocatoria-a{
    color: #0A4064;
    font-family: 'Raleway-Light';
}

.hr-azul{
    background-color: #0A4064;
    width: 100%;
    height: 15px;
    margin-bottom: 0;
}

.seleccion{
    background-color: #70A0C5 ;
    background-image: url('./assets/Version2/Texturas/Fondo.png');
    background-position: center;
    height: 100%;
}

.h-seleccion{
    color: white;
    font-family: 'Raleway-Bold';
}

.faq{
    background-color: #DCE6EF;
}

.faq-t{
    margin-top: 1%;
    color: #0A4064;
    font-family: 'Raleway-Bold';
}

.faq-p{
    color: #0A4064;
    font-family: 'Raleway-Light';
    margin-bottom: 0;
}

.faq-blanco{
    background-color: white;
    border-top-left-radius: 5% 20%;
    border-bottom-left-radius: 5% 20%;
    border-top-right-radius: 5% 20%;
    border-bottom-right-radius: 5% 20%;
    margin-right: 5%;
    margin-bottom: 2%;
}

.faq-blanco3{
    background-color: white;
    border-top-left-radius: 5% 5%;
    border-bottom-left-radius: 5% 5%;
    border-top-right-radius: 5% 5%;
    border-bottom-right-radius: 5% 5%;
    margin-right: 5%;
    margin-bottom: 2%;
}

.faq-blanco4{
    background-color: white;
    border-top-left-radius: 5% 10%;
    border-bottom-left-radius: 5% 10%;
    border-top-right-radius: 5% 10%;
    border-bottom-right-radius: 5% 10%;
    margin-right: 5%;
    margin-bottom: 2%;
}

.faq-blanco2{
    background-color: white;
    border-top-left-radius: 4% 50%;
    border-bottom-left-radius: 4% 50%;
    border-top-right-radius: 4% 50%;
    border-bottom-right-radius: 4% 50%;
    margin-right: 5%;
    margin-bottom: 2%;
}

.img-faq{
    height: auto;
    width: 130%;
    position: relative;
    left: -75px;
}

.card-art{
    background-color: #70A0C5;
    color: white;
    margin-left:4%; 
    margin-right:1%; 
    margin-bottom:2%;
}

.gracias{
    width: 30%;
    height: auto;
    padding-top: 1%;
}

.b-left{
    margin-left:4%; 
    margin-right:1%;
}

.b-center{
    margin-left:1%; 
    margin-right:1%;
}

.b-right{
    margin-left:1%; 
    margin-right:4%;
}

.altura-even{
    height: 17vh;
}

.img-convo{
    width:20%;height:auto;
}

.img-selec{
    width:50%; height:auto;
}

.modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
}

.modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

.modal-backdrop {
    background-color: transparent !important; /* Fondo opaco con opacidad ajustada */
    display: inline;
}

.closeBtn {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.closeBtn:hover,
.closeBtn:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}


@media only screen and (max-width: 1200px) and (min-width: 0px) {
    /*---------------------NAVBAR RESPONSIVO--------------------------*/
    .web{
        display: none !important;
    }
    
    .responsivo{
        display: block !important;
    }

    .columna-impacto{
        width: 100%; /* Ancho igual al contenido de la columna */
    }

    .img-impacto{
        width: 200px;
        height: auto;
        position: relative;
        z-index: 2;
        top: -28%;
    }
    
    .columna-impacto{
        width: 100%; /* Ancho igual al contenido de la columna */
        height: auto;
    }

    .margen{
        margin-top: 5%;
    }

    .p-cidop{
        font-family: 'Raleway-Light';
        color: #517891 ;
        margin-bottom: 0;
        position: relative;
        top: -28%;
        font-size: large;
        padding-bottom: 5%;
     }

     .padding-evento{
        padding-top:5%;
     }

     .img-saliendo{
        position: relative; 
        top:-80px;
        width: 300px;
    }

    .img-saliendo2{
        position: relative;
        top: -50px;
        width: auto;
        height:350px;
        padding-left: 20%;
    }

    .p-padding{
        padding-top: 60%;
    }

    .objetivo{

        width: 100%;
        padding: 0;
        height: auto;
        background-color: #0A4064;
        position: static;
        margin-bottom: 0;
    }

    .transparencia{
        position: static;
     }

     .donativo{
        background-color: #DCE6EF;
        margin-top: 0;
        padding-bottom: 3%;
     }

     .contenedor1r{
        background-color: #0A4064;
    }
    
    .contenedor2r{
        background-color: #E6E6E6;
        padding-top: 2%;
        padding-bottom: 2%;
    }
    
    .contenedor3r{
        background-color: #70A0C5;
        padding-top: 1%;
    }

    .con-margen{
        margin-top:10px
     }

     .b-left{
        margin-left:7%; 
        margin-top: 0;
        margin-bottom: 5%;
        margin-right:7%;
    }
    
    .b-center{
        margin-left:7%; 
        margin-top: 0;
        margin-bottom: 5%;
        margin-right:7%;
    }
    
    .b-right{
        margin-left:7%; 
        margin-top: 0;
        margin-bottom: 5%;
        margin-right:7%;
    }


    .row-evento{
        padding-bottom: 5%;
        margin-bottom: 5%;
     }
    
     .row-evento-p{
        padding-bottom: 5%;
        margin-bottom: 5%;
     }

     .altura-even{
        height: auto;
    }

    .img-convo{
        width: 70%;
        height: auto;
    }

    .img-selec{
        width: 30%;
        height: auto;
        margin-top: 5%;
    }

    .img-faq{
        height: auto;
        width: 40%;
        position: static;
    }

    .faq-blanco{
        background-color: white;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        margin-right: 0%;
        margin-bottom: 5%;
    }
    
    .faq-blanco2{
        background-color: white;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        margin-right: 0%;
        margin-bottom: 5%;
    }

    .card-art{
        background-color: #70A0C5;
        color: white;
        margin-left:7%; 
        margin-right:7%; 
        margin-bottom:5%;
    }

    .gracias{
        width: 70%;
        height: auto;
        padding-top: 1%;
    }

    .input-margin1{
        margin-bottom: 2%;
    }
    .input-margin2{
        margin-bottom: 1%;
    }
}

@media only screen and (max-width: 1100px) and (min-width: 0px) {
    /*---------------------NAVBAR RESPONSIVO--------------------------*/
    .menu {
        display: none !important;
    }

    .menuResponsivo {
        display: block !important;

    }

    .a-navbar-last{
        font-family: 'Fontspring';
        color: white !important;
        background-color: #0A4064; 
        border-radius: 20px;
        padding-left: 40px !important;
        padding-right: 40px !important;
        padding-top: 1%;
        padding-bottom: 1%;
        font-size: large;
        margin-top: 0%;
    }
}

.web-politica{
    display: block !important;
}

.responsivo-politica{
    display: none !important;
}


@media only screen and (max-width: 600px) and (min-width: 0px) {
    /*---------------------NAVBAR RESPONSIVO--------------------------*/
    .menu {
        display: none !important;
    }

    .menuResponsivo {
        display: block !important;

    box-shadow: 0px 1px 10px #D3D3D3;
    z-index: 999999;
    }

    .web-politica{
        display: none !important;
    }
    
    .responsivo-politica{
        display: block !important;
    }

    .a-navbar-last{
        font-family: 'Fontspring';
        color: white !important;
        background-color: #0A4064; 
        border-radius: 20px;
        padding-left: 40px !important;
        padding-right: 40px !important;
        padding-top: 1%;
        padding-bottom: 1%;
        font-size: large;
        margin-top: 0%;
    }

    .nosotros-titulo{
        font-family: 'Fontspring';
        margin-left: 0;
    }

    .centrar-texto{
        display: flex; /* Habilita el modo de diseño flexbox */
    align-items: center; /* Centra verticalmente el contenido del contenedor */
    justify-content: center; /* Centra horizontalmente el contenido del contenedor */
    text-align: center; /* Asegura que el texto dentro del h1 esté centrado */
    }

    .vertical{
        display: none;
    }

    .centro-mision{
        padding-bottom:0;
     }

     .cont-saliendo{
        position: static;
        padding-top: 4%;
    }
    
    .img-saliendo3{
        position: static; 
        width: 50px;
        height: auto;
    }

    .contenedor-proyecto{
        background-color: white;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .iconos-redes{
        padding-left: 44%; 
        padding-top: 1%;
        padding-bottom: 5%;
    }

    .p-padding{
        padding-top: 0;
    }

    .img-saliendo{
        position: static; 
        width: 300px;
        padding-bottom: 10%;
    }

    .img-saliendo2{
        position: static;
        top: -50px;
        width: auto;
        height:350px;
        padding-left: 20%;
    
    }
    
    .p-datos{
        color: #9EB4C2;
        font-family: 'Raleway-Light';
        font-size: large;
        position: static;
        right: 0;
    }

    .padding-left-responsivo{
        padding-left: 0 !important;
    }

    .img-mision1{
       padding-top: 3%;
        padding-bottom: 1%;
     }
    
     .img-mision2{
        padding-top: 3%;
        padding-bottom: 1%;
     }

     .alinear-responsivo{
        display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
     }

     .transparencia-1{
        padding-top: 5%;
        padding-bottom: 5%;
     }

     .columna-transformar{
        padding-top: 70%;
        padding-bottom: 70%
    }

    .transformar-vida{
        font-family: 'Fontspring';
        color: white;
        background-image: url('./assets/Imagenes/Imagenes-01.png');
        background-size: cover;
        background-position: center;
    }

    .boton{
        font-family: 'Fontspring';
        color: white !important;
        background-color: #70A0C5; 
        border-radius: 20px;
        border: none;
        padding-right: 15%;
        padding-left: 15%;
        padding-top: 2%;
        padding-bottom: 2%;
        margin-top: 1%;
    }

    .boton3{
        padding-right: 15%;
        padding-left: 15%;
        padding-top: 2%;
        padding-bottom: 2%;
    }

    .botonn{
        padding-right: 15%;
        padding-left: 15%;
        padding-top: 2%;
        padding-bottom: 2%;
    }
}