body {
  margin: 0;
}

header,
header > div,
header > div > nav,
footer {
  width: 100%;
}

  header > div > * {
    white-space: nowrap;
  }

header {
  position: fixed;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  z-index: 1;
}

header > div {
  display: table;
  font-size: 90%;
}

header > div:first-child {
  height: 40px;
}

header > div:last-child {
  height: 52px;
}

header > div > *,
nav {
  display: table-cell;
  vertical-align: middle;
}

header > div > *,
nav,
nav > span,
footer > div {
  padding: 0px 4px;
}

#logo > a,
header > div:first-child > a {
  padding: 0px 16px;
}

#logo > a > img {
  width: 24px;
  height: 24px;
}

#logo > a > img,
header > div:first-child > a > img,
header > div:first-child > a > span {
  vertical-align: middle;
}

header > div:first-child > a > img {
  width: 20px;
  height: 20px;
}

header > div:first-child > a > span {
  padding-left: 8px;
}

#title {
  margin: 0;
  padding: 8px 16px;
  font-weight: 300;
  font-size: 20pt;
}

#container {
    display: flex;
    flex-direction: column;
    position: absolute;
    width: 100%;
    top: 92px;
    height: calc(100% - 92px);
}

#content {
    flex-grow: 1;
}

.toolbar {
    display: flex;
    flex-direction: row;
    padding: 8px 4px 4px 4px;
}