/* ================ */
/*  Page d’accueil  */
/* ================ */

/* Validation W3C CSS : aucune erreur */

/*

    1. Galerie (grid container)
    2. Presentation et focus
    3. Nuage

*/

/* Le container Grid de l’accueil est dans 6-layout.css */

/* ==================================== */
/* ============ 1. Galerie ============ */
/* ==================================== */

/* ===== Grid container secondaire ==== */
    .galerie {
        display: grid;
        display: -ms-grid;
        grid-row-gap: 1em;
        grid-column-gap: 1em; }

    @media screen and (min-width: 580px) {
        .galerie {
            -ms-grid-columns: 1fr 1fr;
            grid-template-columns: 1fr 1fr;}
            }
    @media screen and (min-width: 992px) {
        .galerie {
            -ms-grid-columns: 1fr 1fr 1fr;
            grid-template-columns: 1fr 1fr 1fr;}
            }
    @media screen and (min-width: 1200px) {
        .galerie {
            -ms-grid-columns: 1fr 1fr 1fr 1fr;
            grid-template-columns: 1fr 1fr 1fr 1fr;}
            }

/* Formats */

    .galerie { padding: 1em 1em; }
    .galerie_item {
        width:100%;
        max-width: 270px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 1em;
        box-shadow: 0px 8px 38px -19px rgba(0,0,0,0.75);
        -webkit-box-shadow: 0px 8px 38px -19px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 8px 38px -19px rgba(0,0,0,0.75);}

    .galerie_titre {
        background:#293f64;
        font-weight: 500;
        text-align: center;
        padding: 0.3em 0.4em;
        border-radius: 0 0 2px 2px;}

    .galerie_item.appel {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 1em;
        background-color: #293f64; }

    .galerie_item a div img {
        -o-object-fit: contain;
        object-fit: contain; }  /* ajuste images à la taille de leur containeur */

/* =================================== */
/* ==== 2. Présentation et focus ===== */
/* =================================== */

    .presentation {padding: 1em;} /* main-grid-item accueil */
    .slogan {
        padding: 0.4em 0 0.5em 0;
        font-size: 1.5em;
        line-height: 1.3em;
        color: #326295;}

    .presentation p {
        font-weight: 400;
        text-align: center;
        line-height: 1.6em;}

    /* ==== Focus ==== */

    .focus {padding: 1em 2em; margin-bottom: 2em;} /* main-grid-item accueil */
    .focus ul { margin-top: 0; }
    .focus .soustitre {
        font-size: 1em;
        margin-top: 0; }

/* =================================== */
/* ============ 3. Nuage ============= */
/* =================================== */

    .cloud {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 1em 2em;
        margin-bottom: 1em;
        text-align: center;
        line-height: 180%;}

    @media screen and (min-width: 768px) {
        .cloud {border-left: 1px solid #ffaa46;}
        }