:root {
  --border_radius: 4px;

  --control_background: rgba(150, 150, 190, .15);
  --control_background_hover: rgba(150, 150, 190, .3);
  --control_border: 1px solid rgba(70, 70, 70, 0.9);
  --control_box_shadow: 1px 1px 1px black;
  --control_transparent_background: rgba(40, 40, 55, 0.45);
  --control_dark_transparent_background: rgba(15, 15, 15, 0.8);

  --text_color: rgba(200, 205, 220, 0.7);
  --text_color_hover: rgba(200, 205, 220, 0.7);
  --text_color_error: rgba(203, 120, 120, 0.8);
  --heading_text_color: rgba(166, 177, 219, 0.7);
  --heading_other_text_color: var(--heading_text_color);
  --text_color_transition: color 0.3s;
}

* {
  font-family: 'Nunito', sans-serif;
  font-size: 5vh;
}

*::-moz-focus-inner {
  border: 0;
}

a {
  outline: 0;
}

html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  color: var(--text_color);
}

p {
  padding: 0;
  margin: 0;
  color: var(--text_color);
  font-size: medium;
  font-weight: bold;
  text-align: center;
}

h1, h2, h3 {
  padding: 0;
  margin: 0;
  font-weight: bold;
  text-decoration: none;
  white-space: pre;
  text-align: left;
}

h1 {
  color: var(--heading_text_color);
}

h2, h3 {
  color: var(--heading_other_text_color);
}

p {
  margin: 0;
  padding: 0;
  font-weight: normal;
  color: var(--text_color);
}

.scrollable-content {
  overflow-x: hidden;
  overflow-y: scroll;
}

.scrollable-content, ::-webkit-scrollbar {
  width: 10px;
}

.scrollable-content, ::-webkit-scrollbar * {
  background: transparent;
}

.scrollable-content, ::-webkit-scrollbar-thumb {
  background: rgba(90, 90, 90, 0.6) !important;
}