/* Include root css */
@import url("root.css");

a {
  text-decoration: none;
  color: unset;
  font-family: 'avenir-lt-pro', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1.125rem;
}
a:hover:not(.button) {
  text-decoration: underline;
}
a:hover.no-underline {
  text-decoration: none !important;
}

button {
  font-family: 'avenir-lt-pro', sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1.125rem;
}

div, span, p {
  font-family: 'avenir-lt-pro', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1.1rem;
  color: var(--black);
}

strong {
  font-weight: bold;
}

h1, .h1 {
  font-family: "avenir-lt-pro", sans-serif;
  font-weight: 800;
  font-style: normal;
  font-size: 3rem;
  word-wrap: break-word;
}

@media (max-width: 576px) {
  h1 {
    font-size: 2.25rem;
  }
}

h2 {
  font-family: "avenir-lt-pro", sans-serif;
  font-weight: 900;
  font-style: bold;
  font-size: 2.25rem;
}
@media (max-width: 576px) {
  h2 {
    font-size: 2rem;
  }
}

h3 {
  font-family: "avenir-lt-pro", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1.75rem;
}

h4 {
  font-family: "avenir-lt-pro", sans-serif;
  font-weight: 800 !important;
  font-style: normal;
  font-size: 1.35rem !important;
}

span.headernav, span.persnaam, p.headernav, p.persnaam {
  font-family: 'avenir-lt-pro', sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1.125rem;
}
span.accent, p.accent {
  font-family: "avenir-lt-pro", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 1.25rem;
}
span.newsdate, p.newsdate {
  font-family: 'avenir-lt-pro', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1.5rem;
}
span.eventdate, p.eventdate {
  font-family: 'avenir-lt-pro', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1.125rem;
}

.z {
  color: var(--black);
}

.bd {
  color: var(--bright-blue);
}

.bl {
  color: var(--petrol);
}

.g {
  color: var(--grey);
}

.deep-blue {
  color: var(--deep-blue);
}

.light-blue {
  color: var(--light-blue);
}

.bg-light-blue {
  background-color: var(--light-blue);
}

.bg-dark-blue {
  background-color: var(--deep-blue);
}

.bg-lighter-blue {
  background-color: rgb(129 159 205 / 0.15);
}