.presentacion__imagen {
width: 50%;
max-width: 100%; /* Esto garantiza que la imagen no se estire más allá de su tamaño original */
height: auto; /* Mantiene la proporción de la imagen */
}
/* Estilos para pantallas de 720px o menos */
@media (max-width: 720px) {
.presentacion__contenido {
width: 90%; /* Aumenta el ancho del contenido a 90% */
margin: 0 auto; /* Centra el contenido */
}
.presentacion__imagen {
width: 100%; /* Las imágenes ocupan el 100% del contenedor */
}
.presentacion__enlaces__link {
width: 100%; /* Los enlaces ocupan el 100% de su contenedor */
}
} .presentacion__contenido { width: 50%; /* Usamos un ancho del 50% para pantallas más grandes / margin: 0 auto; / Centra el contenido */ }
@media (max-width: 720px) { .presentacion__contenido { width: 90%; /* Para pantallas pequeñas, el contenido ocupará el 90% del ancho / } } .presentacion__enlaces__link { width: 50%; display: inline-block; / Para que los enlaces se alineen horizontalmente */ text-align: center; padding: 10px; box-sizing: border-box; }
@media (max-width: 720px) { .presentacion__enlaces__link { width: 100%; /* Los enlaces ocuparán todo el ancho en pantallas pequeñas */ } }
