#navigation {
  transition: all .2s ease-out;
  z-index: 999;
  --size: 95rem;
  --gutter: 1.5rem;
  box-sizing: initial;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--size);
  padding-left: var(--gutter);
  padding-right: var(--gutter);
  width: calc(100% - var(--gutter) * 2);
}

#navigation.top_navigation_header {
  display:flex;
  align-items : center;
  justify-content : space-between;
  gap : 1.5rem;
  position: relative;
  padding-top : 2.5rem;
}

#navigation.top_navigation_header img {
  width : 117px;
}

#navigation .bouton_header {
    align-items: center;
    --button-color: var(--color-white, #fff);
    --button-bg: var(--color-primary, #0067ff);
    --button-border-color: transparent;
    background: var(--button-bg, transparent);
    color : var (--button-color, #ffffff)
    border: .125em solid var(--button-border-color, var(--button-bg));
    border-radius: 6.25em;
    display: inline-flex;
    font: inherit;
    font-size: var(--button-font-size, 1rem);
    font-weight: 600;
    justify-content: center;
    line-height: 1.125;
    padding: .625em .75em;
    text-align: center;
    text-decoration: none;
    transition: background .25s ease 0s, border .25s ease 0s, color .25s ease 0s, transform .25s ease 0s;
    vertical-align: middle;
    will-change: background, border, color, transform;
}

#navigation .bouton_header:hover {
  --button-color: var(--color-foreground-revert, #fff);
  --button-bg: var(--color-primary-600, #0a58ca);
  --button-border-color: transparent;
}

#navigation .bouton_header:active {
--button-color: var(--color-foreground-revert, #fff);
    --button-bg: var(--color-primary-700, #0045ab);
    --button-border-color: transparent;
}

#navigation .bouton_header .label {
  margin: .25em;
  color: #fff;
}