@import "./reset.css";
@import "./components/button/index.css";
@import "./components/headline/index.css";
@import "./components/link/index.css";
@import "./components/link-list/index.css";
@import "./components/rte/index.css";
@import "./templates/_includes/footer/index.css";
@import "./templates/_includes/header/index.css";
@import "./templates/homepage/index.css";

:root {
  --color-Primary: #7fffd4;
  --color-Secondary: #8b008b;
  --color-Hover: #ffd700;
  --color-LightGrey: #eee;
  --color-Font: #666;
  --typo-Default-font-size: 1.6rem;
  --typo-Default-line-height: 1.5;
  --typo-Default-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;
  --typo-Default: var(--typo-Default-font-size) /
    var(--typo-Default-line-height) var(--typo-Default-font-family);
  --typo-H1-font-size: 4.8rem;
  --typo-H1-font-weight: bold;
  --typo-H1-line-height: 1.125;
  --typo-H1: var(--typo-H1-font-weight) var(--typo-H1-font-size) /
    var(--typo-H1-line-height) var(--typo-Default-font-family);
  --typo-H2-font-weight: bold;
  --typo-H2-font-size: 3.2rem;
  --typo-H2-line-height: 1.125;
  --typo-H2: var(--typo-H2-font-weight) var(--typo-H2-font-size) /
    var(--typo-H2-line-height) var(--typo-Default-font-family);
  --typo-H3-font-weight: bold;
  --typo-H3-font-size: 2.4rem;
  --typo-H3: var(--typo-H3-font-weight) var(--typo-H3-font-size) /
    var(--typo-Default-line-height) var(--typo-Default-font-family);
  --spacing-4: 4rem;
  --spacing-8: 8rem;
}

*,
*::after,
*::before {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  font: var(--typo-Default);
}

a:not([class]) {
  color: var(--color-Secondary);
  display: inline-block;
  font-weight: 500;
  margin: 0 -0.2rem;
  padding: 0 0.2rem;
}

a:not([class]):hover,
a:not([class]):focus {
  background-color: var(--color-Hover);
  color: #000;
  text-decoration: none;
}