header {
    padding: 15px 4% !important;
}

.div_header {
    height:100%;
    justify-content: space-between;
}

.div_logo_afpabike, .div_logo_afpa {
    display: flex;
    align-items: center;
}

.div_header_button {
    display: flex;
    height:100%;
    justify-content: center;
    align-items: center;
}

.header_button {
    cursor: pointer;
}

.div_button_primaire {
    display: flex;
    justify-content: space-evenly;
}

.div_button_secondaire {
    display: flex;
    justify-content: space-around;
    max-height: 60px;
    z-index: 11;
}

.menu_burger {
    height: 100%;
    display: none;
    align-items: center;
    font-size: -webkit-xxx-large;
    color: #86bd24 !important;
}

.div_button_secondaire_intermediaire {
    display: flex;
    justify-content: space-around;
    height: 100%;
    display: grid;
    justify-items: center;
}

.header_button_secondaire {
    min-height: 40px;
    height: 100%;
    max-height: 50px;
}

.pastille_select {
    background-color: #86bd24;
    height: 7px;
    width: 7px;
    margin-top: 3px;
    border-radius: 2px;
    opacity: 0;
}

.pastille_compte_utilisateur, .pastille_cloche {
    opacity: 1 !important;
    margin-bottom: 4px;
    position: absolute;
    top: -15px;
    right: 19.5px;
}

/* ---------------------------------------- NOTIFICATIONS ---------------------------------------- */

#container_cloche {
    cursor: pointer;
}

.div_nb_notif {
    position: relative;
    width: 25px;
    height: 25px;
    top: -192%;
    left: -26%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nb_notif {
    font-weight: bold;
}

.nb_notif_99 {
    font-size: 11px;
}

.notif_menu {
    min-width: 12%;
    margin-top: -13px !important;
    border: 2px solid #86bd54;
    border-radius: 10px;
    justify-items: center;
}




/* ---------------------------------------- MENU ---------------------------------------- */

.compte_menu {
    min-width: 12%;
    margin-top: 12px !important;
    border: 2px solid #86bd54;
    border-radius: 10px;
    justify-items: center;
}

.div_compte_menu_utilisateur {
    display: flex;
    align-items: center;
}

.compte_nom_prenom {
    font-size: 20px;
    padding: 0px 15px 0px 0px;
    margin: 0;
    font-weight: bold;
}

.div_circle_initial {
    display: block;
    border-radius: 50%;
    overflow: hidden;
    width: 88px;
    height: 88px;
    margin-left: 16px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.circle_initial {
    border-radius:100%;
    width:100%;
    height:100%;
    border:2px solid #000000; 
}

.initial {
    position: absolute;
    color: black;
    font-size: 30px;
    font-weight: bold;
}

.div_button_compte_menu {
    width: 100%;
    display: grid;
    justify-items: center;
    padding: 5px;
    background-color: #b5b5b5;
    margin-bottom: -8px;
    border-radius: 0px 0px 8px 8px;
}

.button_compte {
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 5px;
    margin: 5px;
    border-radius: 10px;
}

/* ---------------------------------------- BOOTSTRAP ---------------------------------------- */


@media (max-width: 767.98px) {
    .div_button_primaire {
        display: none;
    }

    .menu_burger {
        display: flex !important;
    }

    .div_button_secondaire {
        display: none;
    }
}

@media (max-width: 1199.98px) {
    .div_button_secondaire {
        justify-content: space-between;
    }
}