/* css/magazine.css */

/* Contenedor para la imagen de la revista */
.magazine-viewer {
    width: 100%; /* Ocupa el 100% del espacio horizontal disponible en <main> */
    
    /* Le ponemos un límite para que no se vea gigante en pantallas de escritorio */
    max-width: 750px; 
    
    /* Un pequeño margen por si acaso */
    margin-left: auto;
    margin-right: auto;

    /* Efectos visuales para que parezca un objeto real */
    border-radius: 8px;
    /*box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), 0 0 0 10px rgba(255, 255, 255, 0.5); /* Sombra y un borde blanco semitransparente */
}

/* La imagen dentro del contenedor */
.magazine-viewer img {
    width: 100%; /* La imagen se ajusta al 100% del tamaño de su contenedor (.magazine-viewer) */
    height: auto; /* La altura se ajusta automáticamente para mantener la proporción */
    display: block; /* Elimina cualquier espacio extra debajo de la imagen */
    border-radius: 4px; /* Un redondeo sutil en las esquinas de la propia imagen */
}