* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
html {
  /* font-size: 10px; */
  /* 10 / 16 = 0,625 percentage of users browser font-size setting */
  /*   font-size: 62.5%;
  @media (max-width: @landscape-tablet) {
    font-size: 56.25%;
  }
  @media (max-width: @landscape-tablet) {
    font-size: 50%;
  } */
  font-size: 62.5%;
}
@media (max-width: 75em) {
  html {
    font-size: 65%;
  }
}
@media (max-width: 44em) {
  html {
    font-size: 56%;
  }
}
body {
  font-family: 'Montserrat', sans-serif;
  line-height: 1.4;
  font-weight: 400;
  background-color: var(--color-background-patterned);
  background-image: radial-gradient(circle, rgba(0, 0, 0, 0.03) 1px, transparent 1px);
  background-size: 18px 18px;
}
input:focus,
select:focus {
  outline: none;
}
/* Create a semi-transparent overlay color based on the primary color */
/* Create a semi-transparent overlay color based on the primary color */
/* Create a semi-transparent overlay color based on the primary color */
:root {
  --color-background: #fcfcfa;
  --color-background-patterned: #fdfaf3;
  --color-background-shade: #eee;
  --color-primary: #00492f;
  --color-primary-tint: #006644;
  --color-primary-shade: #001a11;
  --color-visited-links: #007b5e;
  --color-primary-easiest-shade: #00422a;
  --color-primary-easy-shade: #002518;
  --color-primary-overlay-hard: #e6edea;
  --color-primary-overlay-medium: rgba(230, 237, 234, 0.5);
  --color-primary-overlay-soft: rgba(230, 237, 234, 0.3);
  --color-primary-overlay-softer: rgba(230, 237, 234, 0.2);
  --color-primary-shade-overlay: rgba(0, 26, 17, 0.15);
  --color-primary-tint-overlay: rgba(0, 102, 68, 0.15);
  --color-primary-dark: #002518;
  --color-grey-dark-1: #333;
  --color-accent: #1db47f;
  --color-highlight: #ffdf01;
  --color-warning: #e2701b;
  --color-success: #00925e;
  --color-secondary-accent: #00a96d;
  --color-secondary-highlight: #336ab9;
  --info-highlight-background: #fee79d;
  --color-background-light: #e6f4ef;
  --color-background-mainpage: #e6f4ef;
  --info-highlight-background2: #34bc8c;
  --color-section-separator: #e2e2e3;
  --color-divider-grey: #d9d9d9;
  --color-white-text: #f1f3f4;
  --color-black-text: #18181b;
  --header-size: 14.5rem;
  --ad-banner-height: min(90px, 10rem);
  --mobile-standard-box-width: 390px;
}
@media (max-width: 44em) {
  :root {
    --ad-banner-height: min(100px, 8rem);
  }
}
@media (max-width: 44em) {
  :root {
    --header-size: 13rem;
  }
}
.section {
  padding-left: 1.5rem;
  margin-bottom: 6rem;
}
@media (max-width: 44em) {
  .section {
    padding-left: 1.5rem !important;
  }
}
h1 {
  color: var(--color-primary);
  margin-bottom: 2rem;
  text-align: left;
  font-size: 2rem;
}
h2.section-header {
  color: var(--color-primary);
  margin-bottom: 2rem;
  text-align: left;
  font-size: 2rem;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.new-amsterdam {
  font-family: 'New Amsterdam', sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.2rem;
}
.container {
  /* 1140px */
  max-width: 130rem;
  margin: 0 auto;
  padding: 0 3.2rem;
}
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  /* Allow interaction with content below the overlay */
}
.overlay.medium {
  background: var(--color-primary-overlay-medium);
}
.overlay.soft {
  background: var(--color-primary-overlay-soft);
}
.overlay.softer {
  background: var(--color-primary-overlay-softer);
}
.overlay.orange {
  /* background: #fee79d5d; */
  background: #e6f4ef85;
}
.overlay.gradient {
  background: linear-gradient(to bottom, var(--color-primary-overlay-hard), var(--color-primary-overlay-medium));
}
.right-scroller {
  display: flex;
  justify-content: center;
  overflow-y: hidden;
  overflow-x: auto;
  gap: 1.5rem;
  white-space: nowrap;
  scroll-behavior: smooth;
}
.background-container {
  position: relative;
}
.background-container .background-img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
  z-index: 0;
  filter: grayscale(0.9) contrast(150%) brightness(120%);
  mix-blend-mode: multiply;
}
.background-container .background-img.light-filter {
  filter: grayscale(0.4) contrast(130%) brightness(110%) saturate(110%);
  mix-blend-mode: multiply;
}
.background-container .background-img.heavy-filter {
  filter: grayscale(100%) contrast(120%) brightness(110%);
  mix-blend-mode: multiply;
}
.background-container .background-img[data-src] {
  opacity: 0;
}
.background-container .background-img-nofilter {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
  z-index: 0;
}
.background-container .selected-race-card-img {
  filter: grayscale(0.6) contrast(120%) brightness(110%);
  mix-blend-mode: normal;
  aspect-ratio: 3/2;
  background: #f0f0f0;
  width: 100%;
  height: auto;
  transition: opacity 0.3s;
}
.background-container .selected-race-card-img[data-src] {
  opacity: 0;
}
.section-separator-top {
  border-top: 2px solid var(--color-section-separator);
}
.icon {
  width: 2rem;
  /* Adjust this to your desired size */
  height: 2rem;
  fill: currentColor;
  display: inline-block;
  font-size: 2rem;
}
.primary-color {
  color: var(--color-primary) !important;
}
.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ad-banner {
  height: var(--ad-banner-height);
  min-height: 50px;
  max-height: 100px;
}
.ad-banner .ad-container {
  min-width: 300px;
  width: 100%;
  height: 100%;
  max-width: 728px;
  margin: 0 auto;
}
@media (max-width: 44em) {
  .ad-banner .ad-container {
    min-width: 320px;
  }
}
.ai-disclaimer,
.info-disclaimer {
  margin-top: 2rem;
  background-color: #ffebee;
  border: 1px solid #ffcdd2;
  border-radius: 4px;
  padding: 10px;
  margin-bottom: 20px;
  font-size: 1.5rem;
  line-height: 1.3;
}
.ai-disclaimer p,
.info-disclaimer p {
  margin: 0;
}
.ai-disclaimer a,
.info-disclaimer a {
  color: #d32f2f;
  text-decoration: underline;
}
.info-disclaimer {
  background-color: #e3f2fd;
  border-color: #bbdefb;
}
.info-disclaimer a {
  color: #1976d2;
}
@media (max-width: 44em) {
  .phone-min-height-51rem {
    min-height: 5.5rem;
  }
}