/* ########################### */
/* DANS style-presse.css */
/* ########################### */

/* Conteneur principal (main) - Utilisation de Flexbox pour le centrage */
.presse-container {
    max-width: 1200px;
    margin: 20px auto;
    padding: 0 20px;

    /* 1. ACTIVATION ET CENTRAGE FLEXBOX (LA CLÉ) */
    display: flex;
    /* Active Flexbox */
    flex-direction: column;
    /* Empile les éléments du conteneur (main) verticalement */
    align-items: center;
    /* Centre TOUS les éléments enfants (y compris #ima) horizontalement */
    justify-content: center;
    /* Centre les éléments verticalement (si la hauteur le permet) */

    min-height: 70vh;
}

/* 2. Conteneur de l'image (#ima) */
#ima {
    /* Ce bloc est centré par le parent grâce à align-items: center */
    margin: 20px 0;
    padding: 0;
}

/* 3. L'image (ou l'embed) */
#ima embed {
    /* On garde le display: block et le margin: auto en double sécurité */
    display: block;
    margin: 0 auto;

    /* Assure que l'image s'adapte même si l'attribut width est à 600px dans le HTML */
    max-width: 100%;
    height: auto;

    border: 1px solid #ccc;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Media Query pour s'assurer que l'image s'adapte sur mobile */
@media (max-width: 768px) {
    #ima embed {
        height: 600px;
        /* Réduit la hauteur sur mobile */
    }
}