html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100vh;
}

*,
*:after,
*:before {
  box-sizing: inherit;
  font-family: 'Inconsolata', monospace;
}

input:focus {
  outline: none;
}

select {
  max-width: 100%;
  text-overflow: ellipsis;
  word-wrap: break-word;
  height: var(--input-height);
  padding: 0 10px;
}

button {
  text-transform: uppercase;
  height: var(--input-height);
  margin-top: var(--spacer-s);
}

@font-face {
  font-family: 'power_symbols';
  src: url('../fonts/Unicode_IEC_symbol.woff2') format('woff2'),
    url('../fonts/Unicode_IEC_symbol.woff') format('woff'),
    url('../fonts/Unicode_IEC_symbol.ttf') format('truetype'),
    url('../fonts/Unicode_IEC_symbol.odt') format('opentype');
  font-weight: normal;
  font-style: normal;
}

html,
body {
  background: radial-gradient(farthest-side, #d8dee4, #afc0d8 130%);
}

body {
  position: absolute;
  display: flex;
  flex-direction: row;
  align-items: center;
}

@media (max-width: 1030px) {
  body {
    align-items: unset;
  }
}

.main-container {
  flex: 1 auto;
}

.-label {
  color: var(--color-text-muted);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}