.departement-menu{
    overflow: scroll;
    max-height: 500px;
}

.bouton-menu{
    width : 90%;
    display: inline-block;
    color: black;
    padding: 5%;
    border-radius: 20px;
    text-align : center;
    vertical-align: middle;
}

.bouton-menu a{
    vertical-align: middle;
}

.bc-vert{
    background-color: rgb(69, 155, 52);
    color: white;
}

.bc-orange{
    background-color: #FFAA32;
    color : white;
}

.bc-orange-dark{
    background-color: #E47B02;
    color: white;
}

.icon-svg{
    display: inline-block;
    width : 22px;
    height: 25px;
    mask: var(--svg) no-repeat center;
    mask-size: contain;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom : 3px;
    vertical-align: middle;
}

.icon-white{
    background-color: white;
}

.icon-home {
    --svg : url("../svg/home2-svgrepo-com.svg");
}

.icon-chevron-right{
    --svg : url("../svg/chevron-right-svgrepo-com.svg");
}

.icon-chevron-left{
    --svg : url("../svg/chevron-left-svgrepo-com.svg");
}

ul{
    list-style: initial;
    list-style-type: "- ";
    padding-left : 20px;
    padding-top : 5px;
    padding-bottom : 5px;
}

thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background-color: #fff;
}

.table thead.sticky tr th {
    background-color: white;
    background-image : url("../svg/sort-svgrepo-com.svg");
    cursor : pointer;
    background-repeat: no-repeat;
    background-position: center right;
    padding-right: 5px;
    background-size : 8px 8px;
}

@media (prefers-color-scheme: dark) {
    .table thead.sticky tr th {
        background-color: hsl(221,14%,24%);
    }
}