/* ! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */

	* {
		box-sizing: border-box;
	}

	*:focus {
		outline: 0;
	}

	html {
		color: #222;
		font-size: 1em;
		line-height: 1.4;
	}

	::-moz-selection {
		background: #b3d4fc;
		text-shadow: none;
	}

	::selection {
		background: #b3d4fc;
		text-shadow: none;
	}

	hr {
		display: block;
		height: 1px;
		border: 0;
		border-top: 1px solid #ccc;
		margin: 1em 0;
		padding: 0;
	}

	audio,
	canvas,
	iframe,
	img,
	svg,
	video {
		vertical-align: middle;
	}

	fieldset {
		border: 0;
		margin: 0;
		padding: 0;
	}

	textarea {
		resize: vertical;
	}



/* ===== styles ===== */

body {
	font-size: 16px;
	line-height: 20px;
	/* font-family: Helvetica, Helvetica Neue, Arial; */
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1 {
	font-weight: 500;
	margin: 0 0 20px 0;
	font-size: 36px;
	line-height: 40px;
}

h2 {
	font-weight: 500;
	margin: 0 0 20px 0;
	font-size: 26px;
	line-height: 30px;
}

h3 {
	font-weight: 500;
	margin: 0 0 20px 0;
	font-size: 26px;
	line-height: 30px;
}

p {
	font-weight: 300;
	margin: 0 0 20px 0;
}

a.button {
	background: #fff;
	padding: 15px;
	display: block;
	float: left;
	text-decoration: none;
	color: #fff;
	margin: 0 0 20px 0;
	background: #f36d2a;
	-webkit-border-top-right-radius: 16px;
	-webkit-border-bottom-left-radius: 16px;
	-moz-border-radius-topright: 16px;
	-moz-border-radius-bottomleft: 16px;
	border-top-right-radius: 16px;
	border-bottom-left-radius: 16px;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	font-weight: 300;
}

a.button:hover {
	background: #ccc;
}

a.buttonb {
	background: #fff;
	padding: 15px;
	width: 100%;
	display: block;
	float: left;
	text-decoration: none;
	color: #fff;
	margin: 0 0 0 0;
	background: #f36d2a;
	-webkit-border-top-right-radius: 16px;
	-webkit-border-bottom-left-radius: 16px;
	-moz-border-radius-topright: 16px;
	-moz-border-radius-bottomleft: 16px;
	border-top-right-radius: 16px;
	border-bottom-left-radius: 16px;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	font-weight: 300;
	text-align: center;

}

a.buttonb:hover {
	background: #ccc;
}

.wrapper {
	width: calc(100% - 40px);
	max-width: 1240px;
	margin: 0 20px;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
}

.danger-container {
	margin: 0;
}

#done {
	text-decoration: line-through;
}

/* header */

	.header-container {
		border-bottom: 2px solid #f36d2a;
		background: #fff;
		float: left;
		width: 100%;
		height: 120px;
		position: relative;
	}

	.header-container .logo-container {
		width: 300px;
		height: 80px;
		float: left;
		margin: 20px 0;
	}

	.header-container .logo-container img {
		width: auto;
		height: 100%;
	}

	.header-container .menu-container {
		width: auto;
		float: right;
	}

	.header-container .menu-container ul {
		margin: 0;
		padding: 0;
		float: left;
	}

	.header-container .menu-container ul li {
		float: left;
		list-style: none;
		margin: 0 10px 0 0;
	}

	.header-container .menu-container ul li:last-child {
		margin: 0;
	}

	.header-container .menu-container ul li a {
		background: #fff;
		padding: 15px;
		display: block;
		float: left;
		text-decoration: none;
		color: #fff;
		margin: 30px 0;
		background: #ccc;
		-webkit-border-top-right-radius: 16px;
		-webkit-border-bottom-left-radius: 16px;
		-moz-border-radius-topright: 16px;
		-moz-border-radius-bottomleft: 16px;
		border-top-right-radius: 16px;
		border-bottom-left-radius: 16px;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
		font-weight: 300;
	}

	.header-container .menu-container ul li a.current {
		background: #f36d2a;
	}

	.header-container .menu-container ul li.facebook a {
		margin: 30px 0 30px 20px;
	}
	.header-container .menu-container ul li.facebook a,
	.header-container .menu-container ul li.twitter a {
		width: 50px;
		text-align: center;
		background: #000;
	}

	.header-container .menu-container ul li a:hover {
		background: #f36d2a;
	}

	#programma p{
		color: #f36d2a;
		font-weight: 400;
	}

/* banner */

	.banner-container {
		border-bottom: 2px solid #f36d2a;
		float: left;
		width: 100%;
		height: 200px;
		position: relative;
		background-image: url(../img/header/1.jpg);
		background-size: cover;
		background-position: center center;
		/* background-repeat: no-repeat;
		backface-visibility: hidden;
		animation: slidebg 10s linear infinite 0s; */
	}

	.banner-container2 {
		border-bottom: 2px solid #f36d2a;
		float: left;
		width: 100%;
		height: 480px;
		position: relative;
		background-image: url(../img/header/2.jpg);
		background-size: cover;
		background-position: center center;
		/* background-repeat: no-repeat;
		backface-visibility: hidden;
		animation: slidebg 10s linear infinite 0s; */
	}

	.banner-container3 {
		border-bottom: 2px solid #f36d2a;
		float: left;
		width: 100%;
		height: 480px;
		position: relative;
		background-image: url(../img/header/3.jpg);
		background-size: cover;
		background-position: center center;
		/* background-repeat: no-repeat;
		backface-visibility: hidden;
		animation: slidebg 10s linear infinite 0s; */
	}

	.banner-container4 {
		border-bottom: 2px solid #f36d2a;
		float: left;
		width: 100%;
		height: 480px;
		position: relative;
		background-image: url(../img/header/6.jpg);
		background-size: cover;
		background-position: center center;
		/* background-repeat: no-repeat;
		backface-visibility: hidden;
		animation: slidebg 10s linear infinite 0s; */
	}

	/* @keyframes slidebg {
		16% {
			background-image: url(../img/header/1.jpg);
			animation: ease-in-out;
		}

		33% {
			background-image: url(../img/header/2.jpg);
		}

		50% {
			background-image: url(../img/header/3.jpg);
		}

		66% {
			background-image: url(../img/header/4.jpg);
		}

		83% {
			background-image: url(../img/header/5.jpg);
		}

		100% {
			background-image: url(../img/header/6.jpg);
		}
	} */

	/* Slideshow */

	/* .slideshow-container {
		
	} */

/* main */

	.danger {
		padding: 4px 12px;
		background-color: #ffdddd;
		border-left: 6px solid #f44336;
		text-align: left;
		max-width: 640px;
		margin: 0 auto 40px auto;
	}

	.main-container {
		float: left;
		width: 100%;
		position: relative;
		margin: 80px 0 40px 0;
	}

	.main-container section {
		margin: 0 0 40px 0;
		padding: 0 0 20px 0;
		width: 100%;
		/* border-bottom: 1px solid #ccc; */
		overflow: hidden;
		position: relative;
	}

	.main-container section:after {
		content: '';
		position: absolute;
		bottom: 0;
		height: 1px;
		width: 100%;
		max-width: 640px;
		left: 50%;
		-webkit-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		transform: translate(-50%,0);
		background: #ccc;
	}

	.main-container section.small {
		max-width: 640px;
		margin: 0 auto 40px auto;
	}

	.main-container section:last-child {
		margin: 0;
	}

	.main-container section:last-child:after {
		display: none;
	}

	.main-container section:last-child.small {
		margin: 0 auto;
	}

	/* sponsors */

		.main-container section.sponsors:after {
			display: none;
		}

		.main-container section .image-container {
			width: calc(25% - 30px);
			float: left;
			margin: 0 40px 40px 0;
			overflow: hidden;
			border: 1px solid #ccc;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			transition: all 0.5s ease-in-out;
		}

		.main-container section .image-container:hover {
			border: 1px solid #f36d2a;
		}

		.main-container section .image-container:nth-child(4n+4) {
			margin: 0 0 40px 0;
		}

		.main-container section .image-container a img {
			width: 100%;
		}

	/* fotos */

		.foto-button-container a.button {
			width: calc(50% - 20px);
			margin: 0 40px 20px 0;
			
		}

		.foto-button-container a.button:nth-child(2n+2) {
			margin: 0 0 20px 0;
		}

		.slider {
			margin: 0 0 20px 0;
		}
		
		.slider .owl-nav {
			position: absolute;
			top: 50%;
			width: 100%;
		}

		.slider .owl-nav .owl-prev,
		.slider .owl-nav .owl-next {
			width: 50px;
			height: 50px;
			position: absolute;
			top: 50%;
			margin-top: -25px;
			left: 40px;
			border: none;
			background: #ccc;
			color: #fff;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			transition: all 0.5s ease-in-out;

		}

		.slider .owl-nav .owl-prev:before,
		.slider .owl-nav .owl-next:before {
			content: "";
			position: absolute;
			left: 0;
			top: 0;
			width: 50px;
			height: 50px;
		}

		.slider .owl-nav .owl-prev:hover,
		.slider .owl-nav .owl-next:hover {
			background: #f36d2a;
		}
  
		.slider .owl-nav .owl-next {
			left: auto;
			right: 40px;
		}

	/* contact */

		.contact-container input {
			border: none;
			background: #ccc;
			line-height: 50px;
			height: 50px;
			padding: 0 20px;
			width: 100%;
			display: block;
			float: left;
			margin: 0 0 10px 0;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
		}

		.contact-container .left-container input:last-of-type {
			margin: 0;
		}

		.contact-container textarea {
			border: none;
			background: #ccc;
			line-height: 20px;
			height: 170px;
			padding: 15px 20px;
			width: 100%;
			display: block;
			float: left;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
		}
		
		.contact-container .left-container {
			display: block;
			float: left;
			width: calc(50% - 20px);
			margin: 0 40px 40px 0;
		}

		.contact-container .right-container {
			display: block;
			float: right;
			width: calc(50% - 20px);
			margin: 0 0 40px 0;
		}

		.contact-container .submit-container {
			width: 100%;
			display: block;
			float: left;
		}

		.contact-container .submit-container input {
			background: #fff;
			padding: 15px;
			display: block;
			float: left;
			text-decoration: none;
			color: #fff;
			margin: 0 0 20px 0;
			background: #f36d2a;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			transition: all 0.5s ease-in-out;
			font-weight: 300;
			line-height: 20px;
			position: relative;
			width: auto;
			left: 50%;
			-webkit-transform: translate(-50%,0);
			-ms-transform: translate(-50%,0);
			transform: translate(-50%,0);
			min-width: 200px;
		}
		
		.contact-container .submit-container input:hover {
			background: #ccc;
		}

/* FAQ */

		.collapsible {
			background-color: #f36d2a;
			color: #fff;
			cursor: pointer;
			padding: 18px;
			width: 100%;
			border: none;
			text-align: left;
			outline: none;
			font-size: 15px;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			transition: all 0.5s ease-in-out;
			margin-bottom: 10px;
		}

		.active, .collapsible:hover {
			background-color: #ccc;
		}

		.content {
			padding: 10px 18px 0 18px;
			display: none;
			overflow: hidden;
			background-color: #f1f1f1;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
		}

/* Sponsoring */

.progress {
	margin: 20px 0;
}

.progresscontainer {
	width: 100%;
	background-color: #ddd;
	border-radius: 10px;
}

.status {
	text-align: right;
	padding: 25px 5px;
	color: white;
	width: 100%;
	background-color: #f36d2a;
	font-size: xx-large;
	font-weight: bolder;
	border-radius: 10px;
	text-align: center;
}

.donatiecontainer {
	margin: 30px 0;
}

.bedanktcontainer {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	width: 100%;
	text-align: center;
	margin-bottom: 40px;
}

.bedanktcontainer .bedankt {
	flex: calc(33.3% - 15px);
	width: calc(33.3% - 15px);
	border: #f36d2a solid 1px;
	border-radius: 10px;
	padding: 10px;
	margin: 15px 15px 0 0;
	flex-grow: 0;
	text-align: center;
}

.bedanktcontainer .bedankt h3 {
	font-size: 20px;
}

.bedanktcontainer .bedankt h4 {
	font-size: 15px;
}

.bedanktcontainer .anoniem {
	flex: 100%;
	text-align: center;
}

.bedanktcontainer .high {
	flex: calc(50% - 15px);
}

/* footer */

	.footer-container {
		background: #f36d2a;
		float: left;
		width: 100%;
		height: 120px;
		position: relative;
	}

	.footer-container .logo-container {
		width: 300px;
		height: 80px;
		float: left;
		margin: 20px 0;
	}

	.footer-container .disclaimer-container a {
		text-decoration: none;
		color: #fff;
		line-height: 120px;
		float: right;
	}

/* Donaties */

.donatiesov {
	display: flex;
	flex-wrap: wrap;
}

.donatiesov .donatie {
	border: 1px solid #f36d2a;
	border-top-right-radius: 16px;
    border-bottom-left-radius: 16px;
	text-align: center;
	padding: 10px;
	margin: 10px;
}

.klein {
	flex: 25%;
}

.middel {
	flex: 50%;
}

.groot {
	flex: 100%;
}

.doneerform {
	width: 100%;
	background-color: rgb(204,204,204,0.2);
	padding: 15px;
	border-top-right-radius: 16px;
    border-bottom-left-radius: 16px;
}

.doneerform form {
	width: 100%;
	display: block;
}

.doneerform form input {
	width: 100%;
	display: block;
	margin-bottom: 20px;
	border: 1px solid #f36d2a;
	border-top-right-radius: 16px;
    border-bottom-left-radius: 16px;
	line-height: 50px;
	margin-top: 5px;
	font-size: 22px;
	font-weight: 500;
	padding-left: 10px;
}

.doneerform form input[type='submit'] {
	background-color: #f36d2a;
	color: white;
	font-size: larger;
	font-weight: 500;
	transition: 0.5s ease-in-out;
	border: none;
}

.doneerform form input[type='submit']:hover {
	background-color: #ccc;
}

.doneerform form label {
	font-size: larger;
	font-weight: 500;
}

.anoniemrow {
	display: flex;
	margin-bottom: 10px;
}

.anoniemrow input {
	flex: 20%;
	height: 20px;
}

.anoniemrow label {
	flex: 80%;
	align-self: baseline;
}

.dona {
	text-align: center;
	margin: 20px;
	margin-top: 50px;
}

.cancel form button {
	margin: 20px;
	padding: 20px;
	color: white;
	background-color: #f36d2a;
	border-top-right-radius: 16px;
	border-bottom-left-radius: 16px;
	transition: 0.5s ease-in-out;
	border: none;
	font-size: 22px;
	margin-left: 0;
}

.cancel form button:hover {
	background-color: #ccc;
}

@media only screen and ( max-width: 1279px ) {
}

@media only screen and ( max-width: 1119px ) {
}

@media only screen and ( max-width: 959px ) {

	.header-container {
		height: auto;
	}

	.header-container .logo-container {
		width: 100%;
		height: 60px;
		float: left;
		margin: 40px 0 0 0;
	}

	.header-container .logo-container img {
		left: 50%;
		position: relative;
		-webkit-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		transform: translate(-50%,0);
		height: 100%;
		width: auto;
	}

	.header-container .menu-container {
		width: 100%;
		margin: 40px 0 40px 0;
	}

	.header-container .menu-container ul {
		left: 50%;
		position: relative;
		-webkit-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		transform: translate(-50%,0);
		height: 100%;
		width: auto;
	}
}

@media only screen and ( max-width: 799px ) {

	.banner-container {
		height: 320px;
	}

	.banner-container2 {
		height: 220px;
	}

	.main-container section .image-container {
		width: calc(50% - 20px);
	}

	.main-container section .image-container:nth-child(2n+2) {
		margin: 0 0 40px 0;
	}
}

@media only screen and ( max-width: 639px ) {

	.header-container .menu-container ul {
		width: 100%;
	}

	.header-container .menu-container ul li {
		float: left;
		list-style: none;
		margin: 0;
		width: 100%;
	}

	.header-container .menu-container ul li a {
 		margin: 0 0 10px 0;
		width: 100%;
		text-align: center;
	}

	.header-container .menu-container ul li.facebook {
		margin: 0 10px 0 0;
	}

	.header-container .menu-container ul li.facebook,
	.header-container .menu-container ul li.twitter {
		width: calc(50% - 5px);
	}

	.header-container .menu-container ul li.facebook a {
		margin:0;
	}

	.header-container .menu-container ul li.facebook a,
	.header-container .menu-container ul li.twitter a {
		width: 100%;
	}

	/* fotos */

		.foto-button-container a.button {
			width: 100%;
			margin: 0 0 20px 0;
			
		}

	/* contact */

	.contact-container .left-container {
		width: 100%;
		margin: 0 0 10px 0;
	}

	.contact-container .right-container {
		width: 100%;
	}
	
	.footer-container {
		height: auto;
	}

	.footer-container .logo-container {
		width: 100%;
		height: 60px;
		float: left;
		margin: 40px 0 0 0;
	}

	.footer-container .logo-container img {
		left: 50%;
		position: relative;
		-webkit-transform: translate(-50%,0);
		-ms-transform: translate(-50%,0);
		transform: translate(-50%,0);
		height: 100%;
		width: auto;
	}

	.footer-container .disclaimer-container {
		width: 100%;
		display: block;
		float: left;
	}

	.footer-container .disclaimer-container a  {
		line-height: 20px;
		margin: 40px 0;
		text-align: center;
		width: 100%;
	}

	.donatiestitel {
		font-size: 25px;
		line-height: 30px;
	}

}

@media only screen and ( max-width: 479px ) {

	.banner-container {
		height: 240px;
	}

	.banner-container2 {
		height: 240px;
	}

	.main-container section .image-container {
		width: 100%;
		margin: 0 0 40px 0;
	}

	.bedanktcontainer .bedankt {
		flex: calc(50% - 15px);
	}

	.bedanktcontainer .high {
		flex: 100%;
	}


}