/* #region Club */


/* Zone contenu */

.index-main #club {

    width: 100% !important;

    max-width: 100% !important;

    min-width: 0 !important;

    box-sizing: border-box;

}


/* Espacement */

#club {

    margin-top: 40px !important;

}


/* Section Club */

.index-main #club .club-section {

    width: 100% !important;

    max-width: 100% !important;

    min-width: 0 !important;

    box-sizing: border-box;

}


/* Titre principal */

.index-main #club #club-section-title {

    display: block !important;

    width: 100% !important;

    max-width: 100% !important;

    margin: 0 0 25px 0 !important;

    padding: 0 !important;

    color: var(--color-title) !important;

    font-family: inherit !important;

    font-size: 22px !important;

    line-height: 1.2 !important;

    font-weight: 800 !important;

    text-transform: uppercase !important;

    text-align: center !important;

    white-space: normal !important;

}


/* Grille */

.index-main #club .club-grid {

    display: grid !important;

    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;

    gap: 15px !important;

    align-items: stretch !important;

    width: 100% !important;

    max-width: 100% !important;

    min-width: 0 !important;

    box-sizing: border-box;

}


/* Carte */

.index-main #club .club-card {

    display: grid !important;

    grid-template-rows: 90px 42px minmax(0, 1fr) !important;

    align-items: start !important;

    justify-items: center !important;

    width: 100% !important;

    max-width: 100% !important;

    min-width: 0 !important;

    padding: 10px 8px !important;

    margin: 0 !important;

    text-align: center !important;

    box-sizing: border-box;

    border-radius: 10px;

    transition: .2s;

}


/* Zone image */

.index-main #club .club-card figure {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: 100% !important;

    height: 90px !important;

    max-width: 100% !important;

    margin: 0 !important;

    padding: 0 !important;

    box-sizing: border-box;

}


/* Image */

.index-main #club .club-card .club-icon {

    display: block !important;

    width: auto !important;

    height: 70px !important;

    max-width: 100px !important;

    max-height: 70px !important;

    object-fit: contain !important;

}


/* Titres des cartes */

.index-main #club #club-card-title-1,
.index-main #club #club-card-title-2,
.index-main #club #club-card-title-3,
.index-main #club #club-card-title-4,
.index-main #club #club-card-title-5 {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: 100% !important;

    max-width: 100% !important;

    height: 42px !important;

    margin: 0 !important;

    padding: 0 !important;

    color: var(--color-title) !important;

    font-family: inherit !important;

    font-size: 10px !important;

    line-height: 1.2 !important;

    font-weight: 800 !important;

    text-transform: uppercase !important;

    text-align: center !important;

    white-space: normal !important;

    overflow-wrap: break-word !important;

    word-break: normal !important;

    box-sizing: border-box;

}


/* Textes des cartes */

.index-main #club .club-card .club-card-text {

    display: block !important;

    align-self: start !important;

    width: 100% !important;

    max-width: 190px !important;

    margin: 8px auto 0 !important;

    padding: 0 !important;

    color: var(--color-text) !important;

    font-family: inherit !important;

    font-size: 9px !important;

    line-height: 1.4 !important;

    font-weight: 400 !important;

    text-align: center !important;

    white-space: normal !important;

    overflow-wrap: break-word !important;

    box-sizing: border-box;

}


/* Hover */

.index-main #club .club-card:hover {

    transform: translateY(-3px);

}


/* #endregion Club */


/* =========================================================
   RESPONSIVE
   Club
   Disposition 2 / 1 / 2
   ========================================================= */

@media (max-width: 1080px) {


    /* #region Grille */


    .index-main #club .club-grid {

        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 15px !important;

    }


    /* #endregion */


    /* #region Carte centrale */


    /*
     * La troisième carte occupe toute la largeur.
     *
     * Résultat :
     *
     * [ 1 ] [ 2 ]
     *
     * [     3     ]
     *
     * [ 4 ] [ 5 ]
     */

    .index-main #club .club-card:nth-child(3) {

        grid-column: 1 / -1;

    }


    /* #endregion */


}