:root {
  --navy: rgba(0, 48, 146, 1);
  --navy-light: rgba(21, 93, 238, 1);
  --color-bttnCard: rgb(255, 0, 119);
  --color-bttnCard-hover: rgb(255, 0, 80);
  --blue-dark: rgb(126, 146, 236);
  --teal: rgba(0, 135, 158, 1);
  --blue-light: rgba(21, 241, 221, 0.2);
  /* --textColor-light: rgb(240, 245, 225); */
  --light: rgba(255, 242, 219, 1);
  --textColor-dark: rgb(124, 10, 10);
  --boxSadow: 5px 5px 10px rgb(86, 81, 81);
  /* --border-dark: 2px solid rgb(0, 0, 255); */
  --border-light: 2px solid rgba(21, 241, 221, 0.2);
  --orangeYellow: rgba(255, 171, 91, 1);
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-decoration: none;
  list-style: none;
}
header {
  position: sticky;
  top: 0;
  z-index: 100;
}
.topText {
  background-color: aliceblue;
  margin: 10px;
  padding: 1px;
  border-radius: 8px;
}
.topText h6 {
  font-size: 12px;
}
.topText p {
  font-size: 13px;
}
.btmText {
  border-radius: 10px;
}
.btmText h6 {
  background-color: white;
  color: black;
  font-size: 5px;
  margin: 5px;
  padding: 5px;
  border-radius: 10px;
  border: 2px solid red;
  box-shadow: 0 0 20px red;
}
.mailCont {
  width: 50%;
  background-color: var(--orangeYellow);
  border-radius: 10px;
  border: var(--border-light);
  box-shadow: var(--boxSadow);
}
.form-check-input {
  width: 1.2em; /* Groter maken */
  height: 1.2em;
  background-color: rgb(228, 209, 209); /* Achtergrondkleur */
  border: 3px solid black; /* Randkleur */
}
.form-check-input:checked {
  background-color: #ff5733; /* Oranje kleur */
  border-color: #ff5733;
}
.data550 {
  background-color: white;
  padding: 5px;
}
#ni {
  color: white;
  background-color: var(--color-bttnCard);
  border-radius: 15px;
}
input[type="date"] {
  cursor: pointer;
}

#aantalK,
#familieP,
#quadP,
#buggyP,
#naamP,
#emailP,
#phoneP,
#plaatsP,
#datumP,
#tijdP,
#aantalP,
#dagdeelP {
  color: var(--color-bttnCard);
}
.data550 p {
  font-size: 0.9rem;
}
.data550 h6 {
  font-size: 0.8rem;
}

.mailCont h2,
p {
  color: var(--color-bttnCard);
}
#message {
  margin: 5px 0;
  border-radius: 5px;
}
@media (max-width: 875px) {
  .mailCont {
    width: 100%;
  }
}