:root {
  --font-family-header: "Climate Crisis";
  --font-family-regular: "Sora";

  --color-error: #ff6261;
  --color-muted: #6f6f6f;

  --skeleton-background: #c0c0c0;
  --skeleton-animation: 2s linear infinite skeleton-loader;
}

@keyframes skeleton-loader {
  0% {
    opacity: 0.5;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0.5;
  }
}

* {
  box-sizing: border-box;
  font-family: var(--font-family-regular);
}

html,
body {
  width: 100%;
  min-height: 100vh;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
}

h1 {
  font-family: var(--font-family-header);
}

a {
  color: currentColor;
  cursor: pointer;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

#root {
  flex: 1;
}

.page-container {
  display: flex;
  flex: 1;
  width: 100%;
}