/* form-fields */
/* zie demo bestanden bij de theorie voor meer CSS ;) */
input:not([type=submit]),
textarea {
	display: block;
	width: 100%;
	max-width: 38rem;
	padding: .75em;
	border: 1px solid oklch(51.028% 0.00006 271.152);
	border-radius: .3rem;
}

form {
	background-color: var(--light-blue);
	border-radius: 1rem;
	padding: 1rem;
	
	fieldset {
		margin-block-start: 2rem;
	}
}

footer {
	margin-block-start: 10rem;
}

main section {
	margin-inline: auto;
	width: 100%;
	max-width: 40rem;
}

label,
fieldset,
input[type=submit] {
	margin-top: 3rem;
}

input[type=submit] {
	border: none;
}

label, legend {
	display: block;
	margin-bottom: .2em;
	font-weight: bold;
}

fieldset label {
	font-weight: normal;
	margin: 0;
	margin-inline-start: 1rem;
}

fieldset div {
	display: flex;
}

input[type=checkbox] {
	width: 1rem;
}

.message-error {
	color: oklch(49.784% 0.19805 29.009);
}

main .container {

	display: flex;
	flex-direction: column;
	align-items: center;
	padding-inline: 1rem;
}

.thank-you-img {
	margin-block: 5rem;
	max-width: 90%;
}


table {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
}

th, td {
  border: 1px solid oklch(89.755% 0.0001 271.152);
  padding: 8px;
  text-align: left;
}

th {
  background-color: oklch(96.715% 0.00011 271.152);
  font-weight: bold;
}

tr:nth-child(even) {
  background-color: oklch(98.212% 0.00011 271.152);
}

tr:hover {
  background-color: oklch(93.705% 0.00011 271.152);
}