@font-face {
	font-family: "Normaal";
	src: url("../fonts/Nunito.ttf");
}

@font-face {
	font-family: "Titel";
	src: url("../fonts/OriginalSurfer.ttf");
}

@font-face {
	font-family: "Kop";
	src: url("../fonts/Delius.ttf");
}

html, body {
	color: #fff;
	font-size: min(1px, 0.13vw, 0.13vh);
}

.hidden {
	display: none;
}

a:not(.box) {
	text-decoration: underline 2rem #8ff;
	cursor: pointer;
	color: inherit;
	
	&:hover {
		color: #cff;
	}
}
a.box {
	text-decoration: none;
	cursor: pointer;
	color: inherit;
	
	&:hover {
		opacity: 0.8;
	}
}

input[type=text] {
	background-color: #cfd;
	outline: none;
	border-radius: 24rem;
	padding: 8rem 16rem;
	width: 400rem;
	text-align: left;
	border: 2rem solid #864;
	
	&::placeholder {
		color: #0004;
	}
}

.nog_invullen {
	border-color: #f00 !important;
}

#pagina {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	overflow-y: scroll;
	overflow-x: clip;
	background-color: #2e5a4c;
	display: flex;
	flex-flow: column nowrap;
	align-content: stretch;
	font: 20rem/1 "Normaal", sans-serif;
	
	& div {
		flex-shrink: 0;
	}
}

button {
	cursor: pointer;
	background-color: #8f8;
	outline: none;
	border-radius: 24rem;
	padding: 16rem 24rem;
	border: none;
	box-shadow: 0 0 16rem #000;
	font: 30rem/1 "Normaal", sans-serif;
	
	@media (hover: hover) {&:hover {
		filter: brightness(80%);
	}}
}

img.knop {
	cursor: pointer;
	
	&:hover {
		opacity: 0.8;
	}
}

.deel {
	position: relative;
}


.plaats_center {
	position: absolute;
	max-width: 100%;
	width: max-content;
	transform: translate(-50%, -50%);
	text-align: center;
	text-wrap: balance;
}


/* CONTACT INFO */

#deel_fill {
	height: 0;
	flex-grow: 1;
}

#deel_contact {
	height: 200rem;
	background-color: #222;
}

#contact_titel {
	top: 40rem;
	left: 50%;
	font: bold 30rem/1 "Normaal", sans-serif;
}

#contact_email_label {
	position: absolute;
	top: 100rem;
	right: calc(50% + 20rem);
	font: 30rem/1 "Normaal", sans-serif;
	transform: translate(0, -50%);
}

#contact_email {
	position: absolute;
	top: 100rem;
	left: 50%;
	font: 30rem/1 "Normaal", sans-serif;
	transform: translate(0, -50%);
}

#contact_kvk_label {
	position: absolute;
	top: 150rem;
	right: calc(50% + 20rem);
	font: 30rem/1 "Normaal", sans-serif;
	transform: translate(0, -50%);
}

#contact_kvk {
	position: absolute;
	top: 150rem;
	left: 50%;
	font: 30rem/1 "Normaal", sans-serif;
	transform: translate(0, -50%);
}