body,
h1,
h2,
p,
ul,
li {
    margin: 0;
    padding: 0;
}

/* Estilo del cuerpo de la página */
body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    background-color: #95407a;
}


.container {
    display: flex;
    height: 100vh;
    /* Establece la altura del contenedor al 100% del viewport */
    position: relative;

}

img.imgpersona {
    position: absolute;
    top: 15rem;
    left: 8.5rem;
    width: 40%;
    height: 80%;
    z-index: 1;
    /* Asegura que la imagen esté detrás de otros elementos */
}

.home {
    flex: 1;
    padding: 20px;
    text-align: center;

    margin-top: 3.5rem;
    font-family: 'Poppins', sans-serif;

}

.titulo-principal {
    font-size: 4.3rem;
    color: #fbeff4;
    height: 5rem;
}

.lugar {
    width: 45%;
    margin-left: auto;
    margin-right: auto;
}

.titulo-home {
    margin-left: auto;
    margin-right: 8rem;
    color: #fbeff4;
    font-family: 'Arial';
    font-size: 2.3rem;
}

.p-home {
    text-align: right;
}

.home2 {

    flex: 1.2;
    /* Ambas columnas ocupan la mitad del ancho disponible */
    padding: 20px;
    text-align: center;
    color: #fff;
    background-color: #fbeff4;
    color: #95407a;
}

.info-invitacion {
    display: flex;
    flex-wrap: wrap;
    font-family: sans-serif;
    font-size: 23px;
    color: #fbeff4;

}




.div1 {
    flex: 1;
    margin-top: 8rem;


}

.divinfo {
    margin-left: 15rem;

}

.div2 {
    flex: 1;


}

.resaltado {
    font-weight: bold;
    font-size: 26px;
    color: #fff;
    font-family: 'Poppins', sans-serif;
}

.imgmujer2 {

    width: 80%;
}


/* Media query para dispositivos con un ancho de pantalla de 600px o menos */
@media screen and (max-width: 600px) {
    .info-invitacion {
        flex-direction: column;
    }

    .div1,
    .div2 {
        flex: none;
        width: 100%;
    }
}

.infohome2 {
    margin-top: 4rem;
}

.logo {

    width: 100%;
    margin-bottom: 2.5rem;
}

.img-logo {
    width: 40%;
}

.fecha {
    font-size: 2.7rem;

    font-family: 'Poppins', sans-serif;
}

.fecha p {
    margin-top: -1rem;
    font-size: 1.7rem;
}

.info-contacto {
    margin-top: -1.5rem;
    margin-bottom: 2.5rem;
}


.info-mapa {

    background-color: #fbeff4;
}

.info-mapa {
    display: flex;
    flex-wrap: wrap;
    
}

.imgmapa {
    width: 80%;
    display: block;
    /* Asegura que la imagen sea un bloque para aplicar márgenes automáticos */
    margin-left: auto;
    margin-right: auto;

}

.info-mapa1 {
    margin-top: 3rem;
    flex: 1;
    padding: 20px;
    box-sizing: border-box;
    max-width: 60%;

}

.titulo-info-mapa {
    font-size: 1.7rem;
    
}

.info-mapa2 {
    margin-top: 3rem;
    flex: 1;
    max-width: 40%;
    /* Establece el máximo al 70% */
    padding: 20px;
    box-sizing: border-box;
    /* Para incluir el padding en el ancho total */
    color: #95407a;
    margin-bottom: 5rem;
}

.cupo-limi {
    margin-left: 4rem;
    margin-top: 3rem;
}
.boton-container {
    width: 60%; /* Ajusta el ancho según tus necesidades */
    overflow: hidden;
    margin-top: 5rem;
}

.boton-inscribete {
    background-color: #95407a;
    color: #fbeff4;
    width: 100%;
    height: 5rem;
    font-size: 1.5rem;
    border: none; /* Puedes quitar el borde si no es necesario */
    cursor: pointer; /* Cambia el cursor al pasar sobre el botón */
    border-radius: 20px; /* Ajusta el radio según el nivel de redondez deseado */
}

/* Media query para dispositivos con un ancho de pantalla de 600px o menos */
@media screen and (max-width: 600px) {

    .info-mapa1,
    .info-mapa2 {
        flex: none;
        width: 100%;
    }
}




/* Media query para cuando el ancho de la pantalla sea 600px o menos */
@media (max-width: 600px) {
    .container {
        flex-direction: column;
        /* Cambia la dirección del eje principal a columna */
    }

    .home,
    .home2 {
        flex: none;
        /* Ambas columnas ocupan el 100% del ancho disponible */
    }
}


footer {
    background-color: #95407a;
    color: #fbeff4;
    padding: 10px;
    text-align: center;
}
.titulo-footer{
    font-size: 1.4rem;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.imgpatrocinadores{

    margin-bottom: 2rem;
}