:root {
  --border_radius: 4px;

  --control_background: rgba(105, 105, 150, 0.2);
  --control_background_hover: rgba(105, 105, 150, 0.4);
  --control_border: 1px solid rgba(80, 80, 90, 0.9);
  --control_box_shadow: 2px 2px 2px black;
  --control_transparent_background: rgba(10, 10, 16, 0.5);
  --control_dark_transparent_background: rgba(10, 10, 16, 0.7);

  --text_color: rgba(200, 200, 240, 0.65);
  --text_color_hover: rgba(200, 200, 225, 0.65);
  --text_color_error: rgba(203, 120, 120, 0.8);
  --heading_text_color: rgba(132, 160, 230, 0.8);
  --heading_other_text_color: rgba(132, 160, 230, 0.65);
  --text_color_transition: color 0.3s;

  --default_font_size: 14px;
  --default_spacing: 8px;
}

* {
  font-family: 'Nunito', sans-serif;
  font-size: var(--default_font_size);
}

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

a {
  outline: 0;
  color: var(--text_color);
  text-decoration: none;
  font-weight: bold;
}

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: var(--default_font_size);
  font-weight: normal;
  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: 8px;
  height: 8px;
}

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

.scrollable-content, ::-webkit-scrollbar-thumb {
  background: var(--control_background_hover) !important;
}

.scrollbar-corner, ::-webkit-scrollbar-corner {
  background: transparent;
}
