.AppNavigation {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 320px;
  max-width: calc(100vw - 2rem);
  background: var(--colorThemeAccent);
  box-shadow: 0 0 32px #0000005c;
  padding: 0;
  z-index: 10;
  overflow: auto;
  transition: var(--animationBase);
  transform: translateX(-100%);
  opacity: 0;
}

.AppNavigation.is-opened {
  transform: translateX(0);
  opacity: 1;
}

.AppNavigation-closer {
  position: absolute;
  top: 0;
  right: 0;
  width: 2em;
  height: 2em;
  display: flex;
  justify-content: center;
  align-items: center;
  color: black;
  transition: var(--animationBase);
}

.AppNavigation-closer:hover, .AppNavigation-closer:active, .AppNavigation-closer:focus {
  background: hsl(var(--colorBrand-h), calc(var(--colorBrand-s) * 1%), calc(var(--colorBrand-l) * 0.8 * 1%));
  color: white;
}

.AppNavigation-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  flex-direction: column;
  padding: var(--spaceLg);
}

.AppNavigation-button {
  margin-left: var(--spaceLg);
  width: calc(100% - var(--spaceLg) - var(--spaceLg));
  justify-content: center;
}

/*# sourceMappingURL=navigation.min.css.map */
