@import url(https://fonts.googleapis.com/css?family=Roboto);
@import url(https://fonts.googleapis.com/css?family=Material+Icons);
@import url("https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
html {
  --mdc-theme-error: #ff5449;
  --mdc-theme-on-error: #ffffff;
  --mdc-theme-error-container: #ffdad4;
  --mdc-theme-on-error-container: #410001;
  --mdc-theme-magentaDeluxe: #FF4E7D;
  --mdc-theme-on-magentaDeluxe: #ffffff;
  --mdc-theme-magentaDeluxe-container: #FFDADF;
  --mdc-theme-on-magentaDeluxe-container: #3F0012;
  --mdc-theme-miamiPink: #F8915D;
  --mdc-theme-on-miamiPink: #ffffff;
  --mdc-theme-miamiPink-container: #FFDBCA;
  --mdc-theme-on-miamiPink-container: #351000;
  --mdc-theme-neutral-variant: #dae5e4;
  --mdc-theme-on-neutral-variant: #3f4848;
  --mdc-theme-neutral-variant-container: #6f7979;
  --mdc-theme-on-neutral-variant-container: #000000;
  --mdc-theme-neutral: #fbfdfd;
  --mdc-theme-on-neutral: #191c1d;
  --mdc-theme-neutral-container: #eff1f1;
  --mdc-theme-on-neutral-container: #191c1d;
  --mdc-theme-primary: #1fbebf;
  --mdc-theme-on-primary: #ffffff;
  --mdc-theme-primary-container: #6ff6f6;
  --mdc-theme-on-primary-container: #002021;
  --mdc-theme-secondary: #f2c025;
  --mdc-theme-on-secondary: #ffffff;
  --mdc-theme-secondary-container: #ffdf8b;
  --mdc-theme-on-secondary-container: #251a00;
  --mdc-theme-tertiary: #41b6ea;
  --mdc-theme-on-tertiary: #ffffff;
  --mdc-theme-tertiary-container: #c1e8ff;
  --mdc-theme-on-tertiary-container: #001e2c;
  --mdc-theme-background: #fbfdfd;
  --mdc-theme-on-background: #191c1d;
  --mdc-theme-surface: #eff1f1;
  --mdc-theme-on-surface: #191c1d;
  --mdc-theme-surface-variant: #dae5e4;
  --mdc-theme-on-surface-variant: #3f4848;
  --mdc-theme-outline: #6f7979;
  --mdc-theme-dark-error: #ffb4a9;
  --mdc-theme-dark-on-error: #680003;
  --mdc-theme-dark-error-container: #930006;
  --mdc-theme-dark-on-error-container: #ffdad4;
  --mdc-theme-dark-magentaDeluxe: #FFB2BF;
  --mdc-theme-dark-on-magentaDeluxe: #670023;
  --mdc-theme-dark-magentaDeluxe-container: #900034;
  --mdc-theme-dark-on-magentaDeluxe-container: #FFDADF;
  --mdc-theme-dark-miamiPink: #FFB591;
  --mdc-theme-dark-on-miamiPink: #571F00;
  --mdc-theme-dark-miamiPink-container: #7A3001;
  --mdc-theme-dark-on-miamiPink-container: #FFDBCA;
  --mdc-theme-dark-neutral-variant: #3f4848;
  --mdc-theme-dark-on-neutral-variant: #bec9c8;
  --mdc-theme-dark-neutral-variant-container: #889392;
  --mdc-theme-dark-on-neutral-variant-container: #000000;
  --mdc-theme-dark-neutral: #191c1d;
  --mdc-theme-dark-on-neutral: #e0e3e3;
  --mdc-theme-dark-neutral-container: #191c1d;
  --mdc-theme-dark-on-neutral-container: #c4c7c7;
  --mdc-theme-dark-primary: #4cdada;
  --mdc-theme-dark-on-primary: #003738;
  --mdc-theme-dark-primary-container: #004f50;
  --mdc-theme-dark-on-primary-container: #6ff6f6;
  --mdc-theme-dark-secondary: #f2c025;
  --mdc-theme-dark-on-secondary: #3e2e00;
  --mdc-theme-dark-secondary-container: #5a4400;
  --mdc-theme-dark-on-secondary-container: #ffdf8b;
  --mdc-theme-dark-tertiary: #74d1ff;
  --mdc-theme-dark-on-tertiary: #003549;
  --mdc-theme-dark-tertiary-container: #004c68;
  --mdc-theme-dark-on-tertiary-container: #c1e8ff;
  --mdc-theme-dark-background: #191c1d;
  --mdc-theme-dark-on-background: #e0e3e3;
  --mdc-theme-dark-surface: #191c1d;
  --mdc-theme-dark-on-surface: #191c1d;
  --mdc-theme-dark-surface-variant: #3f4848;
  --mdc-theme-dark-on-surface-variant: #bec9c8;
  --mdc-theme-dark-outline: #889392;
}

body {
  max-width: 600px;
  margin: 0 auto;
  padding: 5vw;
  background-color: var(--mdc-theme-background);
}

* {
  font-family: Roboto, Helvetica, Arial, sans-serif;
  color: var(--mdc-theme-on-background);
}

h1 {
  font-family: "Amatic SC", sans-serif;
  line-height: 64px;
  font-weight: 400;
  font-size: 57px;
}

p {
  font-family: "Rubik", sans-serif;
  line-height: 24px;
  font-weight: 400;
  font-size: 16px;
}
