.hr {
    /* centre verticalement les enfants entre eux */
    align-items: center;
    color:#2bc2e7 ;
    /* active flexbox */
    display: flex;

    /* garde le texte centré s’il passe sur plusieurs lignes ou si flexbox n’est pas supporté */
    text-align: center;
}

.hr::before,
.hr::after {
    /* la couleur est volontairement absente ; ainsi elle sera celle du texte */
    border-top: .0625em solid;
     color:#2bc2e7 ;
    /* nécessaire pour afficher les pseudo-éléments */
    content: "";

    /* partage le reste de la largeur disponible */
    flex: 1;

    /* espace les traits du texte */
    margin: 0 .5em;