:root {
  --w-header-main--hor: 100%;
  --h-header-main--hor: 62px;
  --pdg-header-main--hor: 0 16px;
  --w-header-main--ver: 108px;
  --h-header-main--ver: 100dvh;
  --color-background--header: var(--color-primary);
  --color-on-background--header: var(--color-on-primary);
  --color-background-container--header: var(--color-primary-container);
  --color-on-background-container--header: var(--color-on-primary-container);
  --color-footer:var(--color-secondary);
  --color-on-footer:var(--color-on-secondary); }

.main-container {
  background-color: var(--color-background);
  color: var(--color-on-background); }

.header-main--container {
  position: fixed;
  z-index: 6; }
  .header-main--container.horizontal {
    width: var(--w-header-main--hor);
    height: var(--h-header-main--hor);
    max-height: var(--h-header-main--hor);
    background-color: var(--color-primary);
    color: var(--color-on-primary);
    fill: var(--color-on-primary); }
  .header-main--container.hor-after-ver {
    width: var(--w-header-main--hor);
    height: var(--h-header-main--hor);
    max-height: var(--h-header-main--hor); }
    .header-main--container.hor-after-ver.rail {
      background-color: var(--color-primary);
      color: var(--color-on-primary);
      fill: var(--color-on-primary); }
    .header-main--container.hor-after-ver .header-main--content {
      padding: var(--pdg-header-main--hor); }
.header-main--content {
  width: 100%;
  align-items: center; }
  .header-main--content .low {
    color: var(--color-on-background--header);
    fill: var(--color-on-background--header); }
    .header-main--content .low:where(:hover, :active) .container-svg:before {
      background-color: var(--color-on-background--header); }

.footer-container {
  background-color: var(--color-footer);
  color: var(--color-on-footer); }

@media screen and (min-width: 640px) {
  .header-main--container.hor-after-ver {
    width: var(--w-header-main--ver);
    height: var(--h-header-main--ver);
    max-height: var(--h-header-main--ver); }
    .header-main--container.hor-after-ver .header-main--content {
      flex-direction: column; } }

/*# sourceMappingURL=theme.css.map */