@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('fonts/roboto.medium.ttf');
    src: local('Roboto Medium'), local('roboto.medium'),
    url('fonts/roboto.medium.ttf') format('truetype');
}
@font-face {
    font-family: 'Roboto';
    font-style: bold;
    font-weight: 300;
    font-display: swap;
    src: url('fonts/roboto.bold.ttf');
    src: local('Roboto Bold'), local('roboto.bold'),
    url('fonts/roboto.bold.ttf') format('truetype');
}
html {
	font-family: Roboto;
}	
* {
    margin: 0;
    padding: 0;
    z-index: 1;
}
body {
	width: 100%;
	box-sizing: border-box;
	font-family: Roboto;
}
main {
	width: 100%;

}
.wrapper {
	display: flex;
	flex-flow: row wrap; 
	justify-content: center;
}
.flyer {
	max-width: 740px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 25px;
}
.content {
	max-width: 740px;
	display: block;
	border: solid black;
	border-width: 0px 0px 0px 5px;
}
.logo {
	display: block;
	width: 30%;
}
.flyer_tekst {
	margin: 25px;
	margin-bottom: 0px;
	text-align: center;
	color: #775932;
	font-size: 20px;
	font-weight: 300;
}
.smiley {
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: center;
	color: #775932;
	font-size: 20px;
	font-weight: 300;
}
.smile {
	width: 120px;
}
.bg_geel {
	width: 100%;
	height: 10px;
	background-color: #EDDA07;
}
.bg_blauw {
	width: 100%;
	height: 6px;
	background-color: #142ACC;
}
.bg_rood {
	width: 100%;
	height: 6px;
	background-color: #B30900;
}
.flyer_footer {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	background-color: black;
	color: #DCCBBC;
	align-items: center;
}
.datum {
	margin: 20px;
	font-size: 30px;
	min-width: 207px;
}
.adres {
	margin: 20px;
	font-size: 25px;
	min-width: 200px;
}
.section {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.titel {
	background-color: black;
	color: #DCCBBC;
	width: 100%;
}
.inhoudf {
	display: flex;
	flex-direction: row;
	margin: 10px;
	padding: 0px;
}
.ja {
	width: 50%;
	text-align: center;
	padding: 10px;
	background: rgba(0, 220, 0, 0.9);
}
.nee {
	width: 50%;
	text-align: center;
	padding: 10px;
	background: rgba(220, 0, 0);
	opacity: 0.2;
}
.content_tekst {
	margin: 10px;
	color: #775932;
}
h3 {
	margin: 3px;
	margin-left: 10px;
}
.timer {
	text-align: center; 
	padding: 11px;
	padding-left: 25px;
	color: #775932;
	font-size: 25px;
	position: relative;
	right: 0px;
}
.timer_wrapper {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-left: 10px;
	width: 300px ;
}
.timerw {
	border: solid #775932;
	border-width: 3px 3px 0px 3px;
	background-color: black;
	color: #DCCBBC;
	text-align: center;
	width: 75px;
}
.timer_boven {
	border-bottom: 3px solid black;
}
.timer_box {
	font-size: 45px;
	margin: 4px;
	font-style: bold;
}
.timer_onder {
	padding-left: 4px;
	padding-right: 4px;
	border-top: 3px solid #775932;
}
#leeg {
	border-bottom: 3px solid black;
}
.content_wrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
.loop {
	width: 100%;
}
.texel {
	width: 100%;
}
.tekst_c {
	text-align: center;
	margin: 10px;
	color: #775932;
}
.o_wrapper {
}
.pers_foto {
	width: 300px;
	height: 225px;
	margin: 10px;
}
.pers { 
	display: flex;
	flex-direction: row;
}
.p {
	display: flex;
	flex-direction: row;
}
.contact_info {
	height: 45px;
	margin-bottom: 0px;
	margin-top: auto;
}
.c { 
	display: flex;
	flex-direction: column;
}
.perf_id {
	float: right;
	margin-left: 5px;
}
.footer {
	display: flex;
	width: 100%;
	flex-direction: row;
	justify-content: center;
	background-color: black;
}
.ft_txt {
	text-align: center;
	color: #DCCBBC;
	background-color: black;
	margin: 2px;
}
h2 {
	font-size:45px;
}
.bevestiging {
	font-size: 45px;
}