// Container

body > header.container
  flex-wrap: nowrap
  justify-content: space-between
  align-items: center

// Menu

#menu ul
  display: flex
  align-items: center
  height: 50px

  @media screen and (max-width: $size-small)
    height: 30px

  li
    display: block
    max-height: 100%
  svg
    display: block
    max-height: 100%


// Logo

#logo
  .st1
    fill: var(--color-headline)

  img
    height: 100%
    width: 100%
  a
    width: 186px
    height: 79px
    display: block

    @media screen and (max-width: $size-small)
      width: 120px
      height: 51px


// Button Toggle

.btn-toggle
  font-size: 1.5rem
  background: inherit
  border: inherit
  padding: 0 0 0 1rem
  cursor: pointer
  height: 50px
  @media screen and (max-width: $size-small)
    padding: 0 0 0 .5rem
    height: 30px

.light-theme .btn-toggle
  filter: grayscale(0)!important

.dark-theme .btn-toggle
  filter: grayscale(.5)!important

@media (prefers-color-scheme: dark)
  .btn-toggle
    filter: grayscale(.5)