:root {
  --root-font-size: 62.5%;
  --root-font-family: 'Roboto', sans-serif;

  --theme-line-height: 1.3;

  --theme-container-padding: 20px 20px 20px 20px;
  --theme-container-padding-mobile: 20px 20px 20px 20px;

  --theme-container-margin: 0px auto 150px auto; /* Needs 150px bottom at least */
  --theme-container-margin-mobile: 0px auto 150px auto; /* Needs 150px bottom at least */

  --theme-container-max-width: 1000px;
  --theme-container-max-width-mobile: auto;

  --image_background_scaling: 56.25%;
  --task-image_background_scaling: 56.25%;
  
  --font-xxl: 3.0rem;
  --font-xl: 2.4rem;
  --font-lg: 2.0rem;
  --font-med: 1.8rem;
  --font-sm: 1.4rem;
  --font-xs: 1.2rem;

  --game-cover-image-display: block;
  --task-cover-image-display: block;

  --game-header-logo-display: block;
  --task-header-logo-display: block;

  --primary-color: rgb(53, 46, 60);
  --secondary-color: rgb(238, 128, 52);
  --tertiary-color: rgb(249, 232, 208);

  --primary-color-overlay: rgba(53, 46, 60,.7);
  --secondary-color-overlay: rgba(238, 128, 52,.7);
  --tertiary-color-overlay: rgba(249, 232, 208,.7);

  --primary-color-light: rgb(106, 90, 122);
  --secondary-color-light: rgb(238, 170, 123);
  --tertiary-color-light: rgb(249, 244, 238);

  --primary-border-color: white;
  --secondary-border-color: white;
  --tertiary-border-color: white;

  --primary-border-size: 5px;
  --secondary-border-size: 0px;

  --primary-font-color: white;
  --secondary-font-color: white;
  --tertiary-font-color: black;

  --primary-header-font-color: white;
  --secondary-header-font-color: white;
  --tertiary-header-font-color: rgb(238, 128, 52);

  --primary-font-color-faded: #818181;
  --secondary-font-color-faded: rgb(73, 73, 73);
  --tertiary-font-color-faded: rgb(28, 28, 28);

  --primary-button-color: rgb(255, 116, 3);
  --secondary-button-color: rgb(90, 180, 200);
  --tertiary-button-color: rgb(255, 116, 3);

  --primary-button-color-active: rgb(255, 90, 0);
  --secondary-button-color-active: rgb(107, 215, 240);
  --tertiary-button-color-active: rgb(255, 155, 73);

  --primary-button-font-color: white;
  --secondary-button-font-color: white;
  --tertiary-button-font-color: white;

  --primary-button-border:2px solid white;
  --secondary-button-border:1px solid white;

  --primary-alert-color: rgb(255, 57, 1);
  --secondary-alert-color: rgb(255, 116, 3);
  --tertiary-alert-color: rgb(255, 116, 3);

  --primary-alert-font-color: white;
  --secondary-alert-font-color: white;

  --primary-shadow: 5px 5px 5px 3px rgba(0, 0, 0, 0.3);
  --secondary-shadow: 5px 5px 20px 5px rgba(0, 0, 0, 0.3);

  --primary-radius: 6px;
  --secondary-radius: 6px;
  --form-radius: 3px;
  
  --color-game-status-full-color: #FF3901;
  --color-game-status-full-font-color: white;

  --color-game-status-over-color: rgb(57, 123, 200);
  --color-game-status-over-font-color: white;

  --color-game-status-playing-color: rgb(57, 123, 200);
  --color-game-status-playing-font-color: white;

  --color-task-status-clue-color: rgb(57, 123, 200);
  --color-task-status-clue-font-color: white;

  --form-input-color: white;
  --form-input-font-color: black;

  --status-message-margin: 20px auto 20px auto;

  --logo-header-background-color: rgb(252, 232, 205);
  --logo-header-alignment: center;
  --logo-header-max-height: 150px;
  --logo-header-margin: 20px 20px 20px 20px;

  --logo-task-header-background-color: black;
  --logo-task-header-alignment: center;
  --logo-task-header-max-height: 150px;
  --logo-task-header-margin: 20px 20px 20px 20px;

  
}
