@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
:root {
	--base: #414141; /* Donker grijs*/
    --theme1: #259db3; /* Blauw */
	--theme2: #f07f21; /* Oranje */
    --theme3: #bfe6ed; /* LightBlauw */
    --font: 'Poppins', sans-serif;
}
body{ color: var(--base); font-size: 1.2rem;}
html {scroll-behavior: smooth;}
.bg-theme1{ background-color: var(--theme1); }
.bg-theme2{ background-color: var(--theme2); }
.bg-theme3{ background-color: var(--theme3); }
.mh{ margin-top: 160px; }
.bg-nav{ background-color: #fff;}
a, a:visited{ color: var(--theme1);}
a:hover{ color: var(--theme2);}
h1, h2, h3, h4{ font-weight: 700; margin-bottom: 1rem;}
.navbar{
	border-top: 6px solid var(--theme2);
	padding: 1rem 1rem;
	transition: all 0.3s;
    box-shadow: 0 2px 2px rgb(0 0 0 / 10%);
}
.nav-link{
	font-weight: 700;
	font-size: 1.2rem;
	color:  var(--theme1);
}
.active a.nav-link{
	    background-color: var(--theme2);
		color: #fff;
}
@media only screen and (min-width: 768px) {
	.navbar-expand-md .navbar-nav .nav-link {
		padding-right: 0.7rem;
		padding-left: 0.7rem;
	}
}
.btn{ font-size: 1.2rem; }
.btn-theme {
    color: #fff!important;
    background-color: var(--theme2);
	box-shadow: inset 0 0 0 0 var(--theme1);
	-webkit-transition: ease-out 0.2s;
	-moz-transition: ease-out 0.2s;
	transition: ease-out 0.2s;
    border-color: var(--theme2);
	border-radius: 0;
}
.btn-theme:not(:disabled):not(.disabled).active, .btn-theme:not(:disabled):not(.disabled):active, .show>.btn-theme.dropdown-toggle, .btn-theme:hover, .btn-theme.focus, .btn-theme:focus {
    border-color: var(--theme1);
	box-shadow: inset 400px 0 0 0 var(--theme1);
}
.btn-theme2 {
    color: var(--theme1)!important;
    background-color: #fff;
    border-color: var(--theme1);
	border-radius: 0;
}
.btn-theme2:not(:disabled):not(.disabled).active, .btn-theme2:not(:disabled):not(.disabled):active, .show>.btn-theme2.dropdown-toggle, .btn-theme2:hover, .btn-theme2.focus, .btn-theme2:focus {
    color: var(--theme2)!important;
    border-color: var(--theme2);
}
/* Floating form: label on border*/
.form-floating>.form-control {
    padding: 0;
}
.form-floating .float-up{
	transform: scale(.85) translateY(-1.1rem) translateX(0.15rem);
}
.form-floating>.form-control, .form-floating>.form-select {
    height: calc(2.3rem + 2px );
}
.form-floating>label {
    padding: .1rem .75rem .2rem .75rem;
	background-color: #fff;
	height: 30px;
	width: auto;
	margin: 3px 0 0 1px;
	transition: opacity .1s ease-in-out,transform .1s ease-in-out!important;
}
.form-floating>.form-control:focus, .form-floating>.form-control:not(:placeholder-shown) {
    padding: .4rem 1rem 0 .6rem;
}
.form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label {
    opacity: .9;
    transform: scale(.85) translateY(-1.1rem) translateX(0.15rem);
}
.form-control:focus, .form-select:focus {
    border-color: #a7a6a6;
    box-shadow: 0 0 0 0.25rem rgb(207 207 207 / 40%);
}
.form-floating>.form-select {
    padding-top: .6rem;
}
.breadcr {
    display: block;
}
.breadcr ul {
    margin: 0 0 0 -30px;
}
.breadcr ul li {
    display: inline-block;
}
.breadcr ul li:after {
    content: " » ";
}
.breadcr ul li:last-child:after {
    content: " ";
}
#adminmenu{
	background-color: #fff;
	z-index: 2003;
	position: fixed;
	top: 0;
	padding: 0.1rem 0.1rem;
}
.parallax-window{
    min-height: 400px;
	margin-top: 120px;
}
.parallax-window .container{
	margin-top: 4rem;
}
#vervolg .parallax-window{
	min-height: 400px;
}
#vervolg .parallax-window h1{
	display: inline-block;
	color: #fff;
	background-color: var(--theme1);
	font-size: 3rem;
	padding: 10px 20px;
}
.startmodal{ cursor: pointer; }
.play{
	top: 50%;
	left: 50%;
	width: 50px;
	height: 50px;
	border-radius: 25px;
	background-color: var(--theme2);
	color: #fff;
	border: 2px solid #fff;
    box-shadow: 0 2px 2px rgb(0 0 0 / 10%);
}
.startmodal:hover .play{
	background-color: var(--theme1);	
	box-shadow: 0 4px 4px rgb(0 0 0 / 20%);
}
.play i{ padding: 23px 0 0 15px; }
footer a, footer a:visited{
	color: #fff;
	text-decoration: none;
}
footer a:hover{ color: var(--theme2);}
footer #bottom-line{
	background-color: #fff;
	color: var(--base);
}
footer #bottom-line a{ color: var(--theme2); }
footer #bottom-line a:hover{ color: var(--theme1); }
.review{
	border: 2px solid var(--theme1);
	padding-bottom: 40px;
	transition: border .5s ease;
}
.review .button{
	bottom: 0;
	text-decoration: none;
	display: block;
	width: 100%;
	height: 40px;
	background-color: var(--theme1);
	color: #fff;
	padding: 5px 0;
	transition: height .5s ease, padding .5s ease, background-color .5s ease;
}
.review:hover{
	border: 2px solid var(--theme2);
} 
.review:hover .button{
	background-color: var(--theme2);
	height: 50%;
	padding: 30px 0 0 0;
}
#locatie{
	margin-top: 120px;
}
#locatie h1{
	top: 50px;
	z-index: 123;
	display: inline-block;
    color: #fff;
    background-color: var(--theme1);
    font-size: 3rem;
    padding: 10px 20px;
}

@media only screen and (max-width: 768px) {
	#vervolg .parallax-window{
		min-height: 200px;
	}
	#vervolg .parallax-window h1 {
		font-size: 1.5rem;
	}
	.parallax-window .container{
	margin-top: 1rem;
}
}