html {
	scroll-behavior: smooth;
}

body {
	background-color: #e3d6bf;
}

.contentblok.verkortjaarverslag {
	margin-top: 9rem;
}
.contentblok.verkortjaarverslag p {
	margin-bottom: 0;
}
.terug_wrapper {
	position: fixed;
    top: 30px;
    right: 30px;
    z-index: 99999;
    color: #000;
    width: 100%;
	height: 0;
}
.terug_wrapper a {
	color: #333;
    display: block;
    position: absolute;
    right: 0;
    top: 4px;
}
.terug_wrapper a:hover {
    color: #00a2bd;
}
.cd-top {
	display: none;
}
img {
	vertical-align: middle;
	border-style: none;
}
IMG.mobiel-kleiner {
	width: 75%;
}

.background-wrap {
	background-size: cover;
	background-position: center;
}

h3 {
	margin-bottom: 35px;
	margin-top: 35px;
}

.img-fluid {
	max-width: 100%;
	height: auto;
}

.grid {
	margin-top: 25px;
}

.box {
	padding-top: 30px;
    position: relative;
}

.box .inner-box {
	height: 100%
}

.vlak-lichtgrijs {
	background-color: #ebebeb;
}

h3 {
	margin-top: 0px;
}

.bgBlauw h2 {
	font-size: 4rem !important;
}

img.dekkingsgraad {
	width: 595px !important;
	height: 314px;
	margin-left: -66px;
}

.button-rechts {
	position: absolute;
	right: 30px;
	bottom: 15px;
}

.button-meer {
	position: absolute;
	bottom: 30px;
	left: 0;
	width: 100%;
	text-align: center;
	font-size: 2em;
}

.owl-pagination {
	margin-top: 15px;
	display: none;
}

.content h2 {
	font-size: 3.3em;
}

.boven,
.onder {
	cursor: pointer;
}

.bgBlauw h2 {
	font-size: 7rem !important;
}
p.subtitel {
	display: block;
	border-bottom: 1px solid #00a2bd;
	padding-bottom: 10px;
	margin-bottom: 20px!important;
	color: #00a2bd;
}
p.subtitel-wit {
	display: block;
	border-bottom: 1px solid #fff;
	padding-bottom: 10px;
	margin-bottom: 20px!important;
	color: #fff;
}
.tekst-wit {
	color: #fff;
}

.tekst-zwart {
	color: #000;
}

.tekst-oranje {
	color: #F79608;
}

.tekst-grijs {
	color: #8f8f8f;
}

.tekst-blauw {
	color: #00a2bd;
}

.tekst-oranje {
	color: #F79608;
}

.tekst-bruin {
	color: #3A2808;
}

/* HEADER TITEL */
header.titel {
	/* background: transparent linear-gradient(243deg, #F79608 0%, #01A0BA 77%, #00A2BD 100%) 0% 0% no-repeat padding-box; */
	background-color: #3A2808;
	padding-bottom: 8rem !important;
	padding-top: 3rem !important;
}
#blok02 {
	background: transparent linear-gradient(243deg, #F79608 0%, #01A0BA 77%, #00A2BD 100%) 0% 0% no-repeat padding-box;
}
header.titel h1 {
	font-size: 9.5rem;
	font-weight: 500;
}
header.titel h3 {
	font-size: 3rem;
	font-weight: 300;
}


/* FONT SIZES */
.rem15 {
	font-size: 1.5rem;
}
.rem20 {
    font-size: 2rem;
}
.rem25 {
    font-size: 2.5rem;
}
.rem30 {
    font-size: 3rem;
}
.rem40 {
    font-size: 4rem;
}
.rem60 {
    font-size: 6rem;
}

/* GRID */
.padding-vierkant {
	width: 100%;
	padding: 0 35px;
}

.grid-item {
	text-align: center;
}

.grid-item a:hover>i,
.grid-item a:hover {
	color: #333;
}

.square-breed {
	width: 100%;
}

.square-breed:after {
	content: "";
	display: block;
	padding-bottom: 100%;
}

.square {
	width: 100%;
	background-color: #f9f9f9;
}

.square:after {
	content: "";
	display: block;
	padding-bottom: 100%;
}

.content {
	position: absolute;
	width: 100%;
	height: 100%;
	padding: 0 10px;
}


/* VLAKKEN EN TEKSTKLEUR */
.vlak-oranje {
	background-color: #F79608;
}

.vlak-grijs {
	background-color: #909090;
}

.vlak-blauw {
	background-color: #00a2bd;
}

.vlak-wit {
	background-color: #fff;
}

.vlak-lichtgrijs {
	background-color: #EFEFEF;
}

.vlak-bruin {
	background-color: #3A2808;
}

.vlak-lichtbruin {
	background-color: #9A8D77;
}

.vlak-blauw-wit {
	background: rgb(0, 162, 189);
	background: linear-gradient(180deg, rgba(0, 162, 189, 1) 0%, rgba(0, 162, 189, 1) 13%, rgba(239, 232, 221, 1) 13%, rgba(239, 232, 221, 1) 100%);
}
.vlak-lichtbruin {
	background-color: #efe8dd;
}



/* FANCYBOX */
.fancybox-is-open .fancybox-bg {
	opacity: .8 !IMPORTANT;
	transition-timing-function: cubic-bezier(.22, .61, .36, 1) !IMPORTANT;
}

.fancybox-button {
	height: 35px !IMPORTANT;
	padding: 5px !IMPORTANT;
	width: 35px !IMPORTANT;
}

.fancybox-content {
	max-width: 1200px;
	padding: 60px;
}

.fancybox-slide--html .fancybox-close-small {
	right: 15px;
	top: 15px;
	border: 1px solid #333;
	border-radius: 50%;
}

/* ANIMATIES */
.flip {
	-webkit-animation: spin 3s linear infinite;
	-moz-animation: spin 3s linear infinite;
	animation: spin 3s linear infinite;
}

@-moz-keyframes spin {
	50% {
		-moz-transform: rotateY(90deg);
	}
}

@-webkit-keyframes spin {
	50% {
		-webkit-transform: rotateY(90deg);
	}
}

@keyframes spin {
	50% {
		-webkit-transform: rotateY(90deg);
		transform: rotateY(90deg);
	}
}

.field {
	position: absolute;
	right: 0;
	bottom: 30px;
	width: 100px;
}

.mouse {
	width: 40px;
	height: 75px;
	border: 3px solid #fff;
	border-radius: 40px;
	position: relative;
}

.mouse::before {
	content: '';
	width: 10px;
	height: 10px;
	position: absolute;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	background-color: #fff;
	border-radius: 50%;
	opacity: 1;
	animation: wheel 2s infinite;
	-webkit-animation: wheel 2s infinite;
}

@keyframes wheel {
	to {
		opacity: 0;
		top: 60px;
	}
}

@-webkit-keyframes wheel {
	to {
		opacity: 0;
		top: 60px;
	}
}

.mover {
	animation: move 5s infinite;
}

@keyframes move {

	40%,
	100% {
		opacity: 1;
		transform: translate(20px, 0);
	}

	0% {
		opacity: 0;
		transform: translate(-150px, 0);
	}

	40% {
		opacity: 1;
	}
}

.mover2 {
	animation: move2 5s infinite;
}

@keyframes move2 {

	30%,
	100% {
		opacity: 1;
		transform: translate(20px, 0);
	}

	0% {
		opacity: 0;
		transform: translate(-140px, 0);
	}

	30% {
		opacity: 1;
	}
}



/* MEDIA */
@media only screen and (min-width: 992px) {
	.square-breed:after {
		padding-bottom: 50%;
	}

	.content {
		padding: 0 30px;
	}

	.padding-vierkant {
		width: 100%;
		padding: 0 50px;
	}

	IMG.mobiel-kleiner {
		width: 100%;
	}

}

@media only screen and (min-width: 1200px) {
	.container-fluid.wrap {
		max-width: 1600px;
		margin: 0 auto;
	}

	.bgBlauw h2 {
		font-size: 7rem !important;
	}

	img.dekkingsgraad {
		width: 90% !important;
		height: auto;
		margin-left: 0;
	}

	.footer-open {
		width: 100%;
		padding: 30px 55px;
		position: relative;
		margin-left: -60px;
		bottom: -60px;
	}

	.naar-boven {
		margin-top: -7rem;
	}
}


@media (min-width: 576px) {}

@media (min-width: 768px) {}

@media (min-width: 992px) {}

@media (min-width: 1200px) {
	header.titel {
		padding-bottom: 11rem !important;
		padding-top: 5rem !important;
	}
}

@media (min-width: 1400px) {}

@media (min-width: 1920px) {}

@media (min-width: 2560px) {}