:root {
  --background-color: #fff;
  --background-inverse-color: #305e8a;
  --background-active-inverse-color: #42709c;
  --background-focused-inverse-color: #3a6895;
  --background-light-color: #fffef8;
  --border-color: #b6b4b8;
  --border-light-color: #f4f0f6;
  --border-focused-color: #508ce4;
  --border-focused-inverse-color: #3a6895;
  --border-focused-light-color: #d4d0d6;
  --border-inverse-color: #fffef8;
  --border-active-inverse-color: #265080;
  --error-text-color: #b00;
  --link-color: #305e8a;
  --link-disabled-color: #5098c8;
  --link-inverse-color: #fff;
  --link-active-background-color: #45709f;
  --text-color: #000;
  --text-inverse-color: #fff;
  --text-disabled-color: #999;
  --input-background-color: #fdfdff;
  --panel-background-color: #fbfafe;
  --panel-background-focused-color: #f6f2ff;
  --panel-background-light-color: #fcfcf0;
  --panel-border-color: #e4e2ef;
  --required-color: #ff8d49;
  --button-border-radius: .5em;
  --default-border-radius: .35em;
  --transition-time: .15s;
  --header-height: 2.8em;
}

body {
  background: var(--background-color);
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, Open Sans, sans-serif;
  font-weight: 200;
  position: relative;
}

pre {
  font-family: Consolas, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Monaco, Courier New, Courier, monospace;
  font-size: .95em;
}

.button, button, input[type="color"], input[type="date"], input[type="datetime-local"], input[type="datetime"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="submit"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], select, textarea {
  border-radius: var(--default-border-radius);
  padding: .25em .4em;
}

input[type="color"], input[type="date"], input[type="datetime-local"], input[type="datetime"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], select, textarea {
  background-color: var(--input-background-color);
  border: 1px solid var(--border-color);
}

input[type="color"]:focus, input[type="date"]:focus, input[type="datetime-local"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="month"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="week"]:focus, select:focus, textarea:focus {
  background-color: var(--background-color);
  border-color: var(--border-focused-color);
}

.button, button, input[type="submit"] {
  background: var(--background-inverse-color);
  border: 1px solid var(--background-inverse-color);
  color: var(--text-inverse-color);
  cursor: pointer;
  background-repeat: no-repeat;
  padding: .26em .7em;
  text-decoration: none;
  display: inline-block;
}

.button:hover, button:hover, input[type="submit"]:hover {
  background: var(--border-focused-inverse-color);
  color: var(--text-inverse-color);
}

input[disabled] {
  color: var(--text-disabled-color);
}

a {
  color: var(--link-color);
}

a.icon-link {
  color: #0000;
  opacity: .7;
  background-repeat: no-repeat;
  width: 1.4em;
  display: inline-block;
  overflow: hidden;
}

a.icon-link:hover {
  opacity: 1;
}

em {
  color: #a4b;
  font-style: normal;
  font-weight: 400;
}

.logged-out, .logout-overlay {
  color: #eee;
  opacity: .96;
  text-align: center;
  z-index: 100000;
  background-color: #444;
  padding: 22%;
  font-size: 3em;
  font-weight: 500;
  position: fixed;
  inset: 0;
}

.logged-out a, .logout-overlay a {
  color: #fc0;
}

@media only screen and (hover: none) {
  body {
    font-size: 115%;
    font-weight: 300;
  }
}