:root {
  --bgcolor: #e1418a;
  --fgcolor: #183a42;
  --hdcolor: #ebeaff;
  --accent: #d9e124;
  --secondary: #b915a2;
}

@font-face {
  font-family: "Aptos Black";
  src: url("aptos-black.ttf");
}

body, html {
  height: 100%;
}

body {
  background-color: var(--bgcolor);
  color: var(--fgcolor);
}

h1, h2, h3 {
  font-family: "Aptos Black", Verdana, Arial, sans-serif;
  font-weight: bold;
}

h1 {
}

h2 {
  color: var(--hdcolor);
}

.section-infos h3 {
  border-bottom: 1px solid var(--hdcolor);
  font-size: 100%;
  font-weight: bold;
  padding-top: 0.15rem;
  color: var(--hdcolor);
}

@media (min-width: 768px) {
  .section-infos h3 {
    border-bottom: none;
  }
}

p {
  padding: 0 1rem;
  margin-left: 1rem;
}

a, a:visited, a:hover, a:active {
  color: var(--accent);
  font-weight: bold;
}

a, a:hover, a:active {
  font-weight: bolder;
}

a, a:visited {
  text-decoration: none;
}
a:hover, a:active {
  text-decoration: underline;
}

a.button {
  display: inline-block;
  color: #000 !important;
  background-color: var(--accent);
  border-color: var(--accent);
  border-radius: 1.25rem;
  padding: 1em 2em;
  text-decoration: none;
}
a.button:hover, a.button:active {
  background-color: var(--accent);
}

a.secondary {
  color: var(--fgcolor);
  background-color: var(--secondary);
  border-color: var(--secondary);
}

a.secondary:active, a.secondary:hover {
  background-color: var(--secondary);
}

abbr[title] {
  text-decoration: none;
}