:root {
  --primary: rgba(77,4,77,1);
  --secondary: black;
  --accent: #c60ac6;
  --font: sans-serif;
  --font-color: white;
  --main-background: linear-gradient(0deg, var(--secondary) 0%, var(--primary) 100%);
  --correct: #49f2a0;
  
  /* headers (texts, questions, etc) */
  --header-font-size: 10vw;
  --header-font-color: var(--secondary);
  
  /* buttons */ 
  --button-color: color-mix(in srgb, var(--secondary) 30%, transparent);
  --button-color-active: var(--secondary);
  --button-font-size: 10vw;
  --button-border-style: 1vw solid color-mix(in srgb, var(--accent) 30%, transparent);
  --button-border-style-active: 1vw solid var(--accent);
  --button-border-radius: 2vw;
  --button-font-color: var(--font-color);
}