body {
        font-family: helvetica, arial, sans-serif; 
        margin: 2em; 
        background-color: #e7f3fa; 
    }

    h1 {
        color: #065786; 
        text-align: center; 
    }

    .menu a {
        text-decoration: none; 
        color: black; 
    }

    .menu a:hover {
        color: #f8d0f8; 
    }

    .menu-list {
        list-style-type: none; 
        padding: 0; 
        text-align: center; 
    }
    .menu-item {
        display: inline-block; /* pour que les items n'aillent pas à la ligne et se calle les uns derrières les autres */
        width: 30%; /* permet de ne pas dépasser la largeur de la page avec 3 blocks */
        text-align: center; 
        border: 2px solid #065786; 
    }

    .menu-item:hover { /* couleur du block au survol de la sourie */
        border: 2px solid #065786; 
        background-color: #5399c1; 
    }

    .personnal-block {
        background-color: #5399c1; 
        border-radius: 15px; /* pour arrondir les angles */
        border: 3px solid #fff; /* #fff = #ffffff */
        text-align: center; /* pour centrer le texte */
        margin-bottom: 5px; /* permet que les block ne soit pas coller verticallement */
    }
    .horizontal-block {
        text-align: center; 
        padding: 0; 
    }
    .cv-block {
        background-color: #5399c1; 
        border-radius: 15px; 
        border: 3px solid #fff; 
        text-align: center; 
        display: inline-table; 
        width: 30%; 
        height: 350px; 
        margin: 0; 
    }
    .icon { /* on défini la taille des images pour qu'elles soit uniformes */
        width: 100px; 
        height: 90px; 
    }
    /* J'aurais pu faire sans le bloc description .cv-block ul ça aurais marché aussi*/
    .cv-block .description ul {
        display: inline-block; 
        text-align: left; 
        padding-left: 0; 
    }
    .cv-block .description ol {
        display: inline-block; 
        text-align: left; 
        padding-left: 0; 
    }
    /* les ID sont prioritaires sur les classes dont ces règles écraseront les précédentes */
    #experience {
        background-color: #fff; 
        border: 3px solid #5399c1; 
    }
    #langues {
        background-color: #b6f9f6; 
        border: 3px solid #5399c1; 
    }
    /* tir groupé sur table, th et td pour définir les marge et bordures */
    table,
    th,
    td {
        margin: 0 auto; 
        border: 1px solid; 
    }
    /* pour mettre un joli bg */
    thead {
        background-color: #5399c1; 
    }

    .adress {
        width: 100%; 
        text-align: center; 
    }
    .loisirs-block {
        background-color: #5399c1; 
        border-radius: 15px; 
        border: 3px solid #fff; 
        text-align: center; 
        margin-bottom: 5px; 
        margin-top: 5px;
    }
    tfoot th{
        text-align: left;
    }