#openmenu {
    position: fixed;
    display: inline-block;
    visibility: hidden;
}

#openmenu_mob {
    position: fixed;
    display: inline-block;
    visibility: visible;
}

.liste {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
}

.sidenav {
    position: fixed;
    display: inline-block;
    z-index: 1;
    background: white;
    border: 1pt solid grey;
    overflow-x: hidden;
    overflow-y: scroll;
    padding: 30pt 0 0 0;
    top: 150pt;
    bottom: 30pt;
    left: 8pt;
    transition: 0.3s;
}

.sidenav_mob {
    width: 0;
}

.sidenav_other {
    width: 150pt;
}

.sidenav a {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font: 9.5pt sans-serif;
    color: black;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: white;
    background: black;
}

.sidenav a:focus,
.sidenav a.liste_active {
    color: blue;
    background: white;
}

.sidenav .closebtn {
    position: absolute;
    padding: 0 4pt 0 4pt;
    margin: 1pt 0 0 0;
    top: 0;
    right: 0;
    font-size: 20pt;
    color: grey;
}

.sidenav .closebtn:hover {
    color: black;
    background: white;
}

.sidenav .title {
    position: absolute;
    color: blue;
    top: 7pt;
    left: 7pt;
    font-size: 16pt;
}


.filter_button a {
    display: inline-block;
    margin: 3pt 1pt 3pt 1pt;
    font-family: sans-serif;
    font-size: 9pt;
    line-height: 100%;
    text-decoration: none;
    cursor: pointer;
    width: auto;
    overflow: visible;
    padding: 3pt 4pt 2pt 4pt;
    border-radius: 10pt;
    text-align: center;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.filter_color_purple a.toselect {
    background-color: white;
    border: 1pt solid rgb(132, 0, 255);
    color: rgb(132, 0, 255);
}

.filter_color_purple a.toselect:hover {
    background-color: rgb(201, 149, 250);
    color: white;
}

.filter_color_purple a.toselect:active {
    background-color: rgb(132, 0, 255);
    color: white;
}

.filter_color_purple a.selected {
    background-color: rgb(132, 0, 255);
    border: 1pt solid rgb(132, 0, 255);
    color: white;
}

.filter_color_purple a.selected:hover {
    background-color: rgb(201, 149, 250);
    color: rgb(132, 0, 255);
}

.filter_color_purple a.selected:active {
    background-color: white;
    color: rgb(132, 0, 255);
}


.filter_color_yellow a.toselect {
    background-color: white;
    border: 1pt solid rgb(255, 157, 56);
    color: rgb(255, 157, 56);
}

.filter_color_yellow a.toselect:hover {
    background-color: rgb(252, 191, 131);
    color: white;
}

.filter_color_yellow a.toselect:active {
    background-color: rgb(255, 157, 56);
    color: white;
}

.filter_color_yellow a.selected {
    background-color: rgb(255, 157, 56);
    border: 1pt solid rgb(255, 157, 56);
    color: white;
}

.filter_color_yellow a.selected:hover {
    background-color: rgb(252, 191, 131);
    color: rgb(255, 157, 56);
}

.filter_color_yellow a.selected:active {
    background-color: white;
    color: rgb(255, 157, 56);
}


.filter_color_red a.toselect {
    background-color: white;
    border: 1pt solid rgb(255, 0, 0);
    color: rgb(255, 0, 0);
}

.filter_color_red a.toselect:hover {
    background-color: rgb(255, 151, 151);
    color: white;
}

.filter_color_red a.toselect:active {
    background-color: rgb(255, 0, 0);
    color: white;
}

.filter_color_red a.selected {
    background-color: rgb(255, 0, 0);
    border: 1pt solid rgb(255, 0, 0);
    color: white;
}

.filter_color_red a.selected:hover {
    background-color: rgb(247, 151, 151);
    color: rgb(255, 0, 0);
}

.filter_color_red a.selected:active {
    background-color: white;
    color: rgb(255, 0, 0);
}

