.header
  background-color: var(--base)
  z-index: 5
  +media-breakpoint-up(md)
    +position(fixed, top 0, right 0)
    left: var(--global-nav-width)
    height: var(--header-height__md-up)
  +media-breakpoint-down(sm)
    position: relative
    height: var(--header-height__sm-down)
  .a-switch
    margin-left: .5rem

.header__inner
  display: flex
  justify-content: space-between
  align-items: center
  height: 100%

.header__start
  display: flex

.header__end
  display: flex
  height: 100%

.header__title
  text-decoration: none
  display: flex
  align-items: center
  transition: all .2s ease-out
  text-decoration: none
  &:hover
    opacity: .8

.header__title-image
  +media-breakpoint-up(md)
    height: 2.25rem
  +media-breakpoint-down(sm)
    height: 1.75rem

.header-show-mobile-nav
  display: none
  cursor: pointer
  height: 100%
  justify-content: center
  align-items: center
  width: 3rem
  +position(relative)
  display: flex

.header-show-mobile-nav-items
  display: none
  +media-breakpoint-down(sm)
    display: flex
    height: 100%
    margin-right: -1rem
