#header #menu_user {
    position: fixed;
    right: max(calc(40% - 200pt), 15pt);
    top: 5pt;
    cursor: pointer;
    vertical-align: bottom;
    margin-bottom: 10pt;
    z-index: 100;
}

#header #menu_user img {
    width: 45pt;
    max-width: 45pt;
}

#header #menu_user:hover #menu_user_under {
    display: block;
}

#header #menu_user #menu_user_under {
    display: none;
    position: absolute;
    top: 45pt;
    left: -15pt;
    border-radius: 3pt;
    box-shadow: 0 0 3pt rgba(0, 0, 0, .2);
    background-color: white;
    padding: 3pt;
    z-index: 100;
}

#menu_lecture {
    position: relative;
    cursor: pointer;
    padding-left: 4pt;
}

#menu_lecture .lu {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

#menu_lecture .lu svg {
    display: block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
}

#menu_lecture .pasint {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

#menu_lecture .pasint svg {
    display: block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
}

#menu_lecture .ajouter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

#menu_lecture .ajouter svg {
    display: block;
    width: 1.5em;
    height: 1.5em;
    flex-shrink: 0;
}

#menu_lecture .alire {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

#menu_lecture .alire svg {
    display: block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
}

#menu_lecture .encours {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

#menu_lecture .encours svg {
    display: block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    margin-right: 4px;
}

#menu_lecture:hover #menu_lecture_under {
    display: block;
}

#menu_lecture #menu_lecture_under {
    display: none;
    position: absolute;
    top: 11pt;
    left: 0;
    border-radius: 3pt;
    box-shadow: 0 0 3pt rgba(0, 0, 0, 0.6);
    background-color: white;
    padding: 3pt;
    margin: 0 2pt 0 2pt;
    z-index: 4
}

#header #menu_user2 {
    font: sans-serif;
    position: fixed;
    right: 15pt;
    top: 22pt;
    z-index: 100;
}

.menu_under a,
.menu_under button {
    display: block;
    text-decoration: none;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    color: #414141;
    padding: 3pt 0 3pt 0;
}

.menu_under form {
    display: block;
    margin: 0;
    width: 100%;
}

.menu_under button {
    appearance: none;
    background: transparent;
    border: 0;
    box-sizing: border-box;
    cursor: pointer;
    font: inherit;
    justify-content: flex-start;
    text-align: left;
    width: 100%;
}

#menu_lecture_under {
    width: 140px;
}

.alire {
    color: rgb(255, 123, 0);
    font-weight: 500;
}

.menu_under a.alire,
.menu_under button.alire {
    background-color: transparent;
    border: 0;
    color: rgb(255, 123, 0);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-start;
    width: 100%;
}

.menu_under a.alire:hover,
.menu_under button.alire:hover {
    color: white;
    font-weight: 500;
    background-color: rgb(255, 123, 0);
}

.encours {
    color: blue;
    font-weight: 500;
}

.menu_under a.encours,
.menu_under button.encours {
    background-color: transparent;
    border: 0;
    color: blue;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-start;
    width: 100%;
}

.menu_under a.encours:hover,
.menu_under button.encours:hover {
    color: white;
    font-weight: 500;
    background-color: blue;
}

.lu {
    color: green;
    font-weight: 500;
}

.menu_under a.lu,
.menu_under button.lu {
    background-color: transparent;
    border: 0;
    color: green;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-start;
    width: 100%;
}

.menu_under a.lu:hover,
.menu_under button.lu:hover {
    color: white;
    font-weight: 500;
    background-color: green;
}

.pasint {
    color: grey;
    font-weight: 500;
}

.menu_under a.pasint,
.menu_under button.pasint {
    background-color: transparent;
    border: 0;
    color: grey;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-start;
    width: 100%;
}

.menu_under a.pasint:hover,
.menu_under button.pasint:hover {
    color: white;
    font-weight: 500;
    background-color: grey;
}

.ajouter {
    color: red;
    font-weight: 500;
}

.menu_under a.ajouter,
.menu_under button.ajouter {
    background-color: transparent;
    border: 0;
    color: red;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-start;
    width: 100%;
}

.menu_under a:hover,
.menu_under button:hover {
    background: black;
    color: white;
}