:root {
  --fontFamilyHeadlines: "STIX Two Text";
  --fontFamilyDefault: "Noto Sans";

  --margin: 24px;
  --marginInverse: -24px;

  --gapBetweenParagraphs: 2em;
  --fontSizeTitleRegular: 24px;
  --lineHeightTitleRegular: 32px;

  --innerPageSize: 1280px;
}

/* colors */
:root {
  --colorLightGrey: #e4e4e4;
  --colorDarkGrey: #343430;
  --colorGreen: #5a5c40;
  --colorDarkGreen: #363928;
  --colorGrassGreen: #50854d;
  --colorLightGreen: #d8ded6;
  --lightMediumGreen: #bfccbd;
  --colorBrown: #5a5c40;
  --colorYellow: #ebdf80;
  --colorMapItems: #5a5c40;
  /* --colorLightGreen: #bfccbd; */
}

@media (min-width: 576px) {
  :root {
    --fontSizeTitleRegular: 32px;
    --lineHeightTitleRegular: 48px;
  }
}

html {
  background-color: #5a5c40;
}

body {
  color: var(--colorBrown);
  font-family: var(--fontFamilyDefault);
  font-size: 18px;
  line-height: 28px;
}

h1 {
  font-size: 32px;
  font-weight: bold;
}

h2 {
  color: #5a5c40;
  font-size: 30px;
  line-height: 40px;
  margin-bottom: 15px;
  font-weight: bold;
  letter-spacing: -0.5px;
  font-family: var(--fontFamilyDefault);
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

b,
strong {
  font-weight: 600;
}

img {
  vertical-align: middle;
  height: auto;
  width: 100%;
  max-width: 100%;
}

a,
.link,
a:hover,
a:focus,
.link:hover,
.link:focus {
  text-decoration: none;
}
.text-formatted a {
  text-decoration: underline;
}