section {
    min-height: fit-content;
}
section:not(:first-of-type){
    border-top: 1px solid;
}
    section ul {
        padding-left: 1rem;
    }
    
        section ul li {
            margin-bottom: 1rem;
        }


/* ANNUAIRES ------------------------------- */    

.annuaire {
    width: 100%;
    margin:var(--padding) 0;
}
    .annuaire caption {
        font-size: var(--t2);
    }

    .annuaire caption, 
    .annuaire thead {
        display: none;
    }

    table.annuaire, tr, th, td {
        border-collapse: collapse;
    }

    /* TBODY*/
    .annuaire tbody {
        height: fit-content;
        overflow-y: scroll;
        scroll-snap-type: y mandatory;
        scroll-padding: var(--hauteurMenu);
        overflow-y: hidden;
    }
    .annuaire tbody tr {
        scroll-snap-align: start;
    }
        .annuaire tbody tr th {
            padding-top: calc(var(--padding)*2);
        }
            .annuaire tbody tr:first-child th {
                padding-top: 0;
            }
            .annuaire tbody tr th strong {
                display: inline;
                margin-bottom: 0;
                font-size: var(--fs-xl);
            }
            .annuaire tbody tr th > figure {
                display: none;
                height: 0;
                width: 0;
            }

    .annuaire th, 
    .annuaire td {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
        .annuaire th {
            text-align: left;
            font-size: var(--fs-xl);
        }
        .annuaire td {
            padding: .5rem 0;
            justify-content: center;
            border-bottom: 1px dashed;
        }
            .annuaire td:last-of-type {
                border-bottom: 1px solid;
            }
            td, td a {
                font-size: var(--fs-m);
            }
                td a {
                    font-weight: var(--fw-gras);
                    display: inline-block;
                    width: fit-content;
                    border:none;
                    word-break: break-all;
                }
                    td a:before {
                        content: "→ ";
                        white-space: pre;
                    }

    /*TFOOT*/
    .annuaire tfoot, tr {
        border-collapse:separate;
    }

    .annuaire tfoot tr {
        margin: 1rem 0;
    }
        .table-footlink {
            margin-top: calc(var(--padding)*2);
            text-align: center;
        }
            .table-footlink a{
                border-bottom: 2px solid;
    }


@media screen and (min-width: 1024px) {
/* ANNUAIRES ------------------------------- */  
.annuaire {
    text-align: left;
    }  
    .annuaire caption, 
    .annuaire thead {
    display:revert;
    }

    .annuaire caption {
        text-align: left;
        height: 5rem;
        padding: 1rem 0;
    }

    /* THEAD */ 
    .annuaire thead {
        position: -webkit-sticky; /* Safari */
        position: sticky;
        top: calc(var(--hauteurMenu) + var(--bordermenu));

        background-color: var(--vertclair);

    }
        .annuaire thead tr {
            height: calc(var(--hauteurMenu) + var(--bordermenu));
        }

            .annuaire thead tr th{
                    font-size: 14px;
                    font-weight: var(--fw-normal);
                }
                .annuaire thead tr th:before {
                        content: "↓ ";
                        white-space: pre;
        
                    }

                    .annuaire td, .annuaire th {
                        display: revert;
                        width: auto;
                    }
                    .annuaire th {
                        font-size: var(--fs-l);

                    }

                    .annuaire td {
                        padding-right: var(--padding);
                        /* white-space: nowrap; */
                        /* height: 100%; */
                        width: 15%;
                    }


    /* TBODY */        
    .annuaire tbody tr {
        scroll-snap-align: center;
        border-bottom: 1px solid var(--vert);

    }      
        .annuaire tbody tr:nth-child(1) {
            border-top: 1px solid var(--vert);
        }    
        .annuaire tbody tr:hover{
            background-color: var(--blanc);
        }
            .annuaire tbody tr th {
                padding-top: 0;
                padding-right: calc(var(--padding)/2);
                width: 20%;
                height: 5em;
            }
                .annuaire tbody tr:hover th > figure {
                    display: flex;
                    padding: .5rem var(--padding) .5rem .5rem;
                    height: 100%;
                    width: 100%;
                }
                .annuaire tbody tr:hover th > figure img {
                    object-fit: scale-down;
                }
                .annuaire tbody tr:hover th > figure + strong {
                    display: none;
                    height: 0;
                    width: 0;
                }

            td.expertise {
                white-space: normal;
                width: 30%;
            }
            td.siteweb {
                padding-right: 0;
                width: 20%;
            }

}