Untitled

<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css ">
<style>
 h1 {
font-size: 120px !important;
  color: navy !important;

 }
</style>

	</head>

	<body>

		<div class="container">
			<div class="row">
				<div class="col-sm">
					<h1 > Mastermind </h1>
					<p> Kraak de code! Je kan zo vaak proberen als je wilt! </p>
				</div>
			</div>
		</div>
		<div class="container">
			<div class="row">
				<div class="col-sm">
					<h2> Aantal op de juiste plek: {{ juist }} </h2>
					<h2> Aantal juist maar op de foute plek: {{ fout }} </h2>
				</div>
			</div>
		</div>
		<div class="container">
			<div class="row">
				<div class="col-sm">
					<h3> {{ kleur0 }} </h3>
				</div>
				<div class="col-sm">
					<h3> {{ kleur1 }} </h3>
				</div>
				<div class="col-sm">
					<h3> {{ kleur2 }} </h3>
				</div>
				<div class="col-sm">
					<h3> {{ kleur3 }} </h3>
				</div>
			</div>
		</div>
		<div class="container">
			<div class="row">
				<div class="col-sm">
					<select class="custom-select"name="kleur0" form="mastermind">
						<option value="Rood" {% if kleur0 == "Rood": %} selected {% endif %}>Rood</option>
						<option value="Blauw"{% if kleur0 == "Blauw": %} selected {% endif %}>Blauw</option>
						<option value="Groen"{% if kleur0 == "Groen": %} selected {% endif %}>Groen</option>
						<option value="Oranje"{% if kleur0 == "Oranje": %} selected {% endif %}>Oranje</option>
						<option value="Paars"{% if kleur0 == "Paars": %} selected {% endif %}>Paars</option>
						<option value="Geel"{% if kleur0 == "Geel": %} selected {% endif %}>Geel</option>
					</select>
				</div>
				<div class="col-sm">
					<select class="custom-select"name="kleur1" form="mastermind">
						<option value="Rood" {% if kleur1 == "Rood": %} selected {% endif %}>Rood</option>
						<option value="Blauw"{% if kleur1 == "Blauw": %} selected {% endif %}>Blauw</option>
						<option value="Groen"{% if kleur1 == "Groen": %} selected {% endif %}>Groen</option>
						<option value="Oranje"{% if kleur1 == "Oranje": %} selected {% endif %}>Oranje</option>
						<option value="Paars"{% if kleur1 == "Paars": %} selected {% endif %}>Paars</option>
						<option value="Geel"{% if kleur1 == "Geel": %} selected {% endif %}>Geel</option>
					</select>
				</div>
				<div class="col-sm">
					<select class="custom-select"name="kleur2" form="mastermind">
						<option value="Rood" {% if kleur2 == "Rood": %} selected {% endif %}>Rood</option>
						<option value="Blauw"{% if kleur2 == "Blauw": %} selected {% endif %}>Blauw</option>
						<option value="Groen"{% if kleur2 == "Groen": %} selected {% endif %}>Groen</option>
						<option value="Oranje"{% if kleur2 == "Oranje": %} selected {% endif %}>Oranje</option>
						<option value="Paars"{% if kleur2 == "Paars": %} selected {% endif %}>Paars</option>
						<option value="Geel"{% if kleur2 == "Geel": %} selected {% endif %}>Geel</option>
					</select>
				</div>
				<div class="col-sm">
					<select class="custom-select"name="kleur3" form="mastermind">
						<option value="Rood" {% if kleur3 == "Rood": %} selected {% endif %}>Rood</option>
						<option value="Blauw"{% if kleur3 == "Blauw": %} selected {% endif %}>Blauw</option>
						<option value="Groen"{% if kleur3 == "Groen": %} selected {% endif %}>Groen</option>
						<option value="Oranje"{% if kleur3 == "Oranje": %} selected {% endif %}>Oranje</option>
						<option value="Paars"{% if kleur3 == "Paars": %} selected {% endif %}>Paars</option>
						<option value="Geel"{% if kleur3 == "Geel": %} selected {% endif %}>Geel</option>
					</select>
				</div>
			</div>
		</div>
		<br \>
		<p \>
		<form action="/mastermind" id="mastermind">
			<div class="container">
				<div class="row">
					<div class="col">
						<input class="btn btn-info" type="submit" value="Controleer code">
					</div>
				</div>
			</div>
		</form>


	</body>
</html>