/* kraan animatie */

body:not([data-editor-mode="content"]) .section-img-animation {
	/* transform: translateX(-100vw) rotate(15deg); */
	opacity: 0;
}

body:not([data-editor-mode="content"]) .section-img-animation.in-view {
	animation: kraan-animation 6.56s
		linear(
			0,
			0.0237,
			0.0888,
			0.186,
			0.3058,
			0.4393,
			0.5783,
			0.7155,
			0.8448,
			0.9616,
			1.0622,
			1.1446,
			1.2077,
			1.2516,
			1.2772,
			1.2861,
			1.2805,
			1.2627,
			1.2356,
			1.2017,
			1.1638,
			1.124,
			1.0847,
			1.0474,
			1.0137,
			0.9844,
			0.9604,
			0.9419,
			0.9288,
			0.9211,
			0.9182,
			0.9195,
			0.9243,
			0.9318,
			0.9414,
			0.9522,
			0.9635,
			0.9748,
			0.9856,
			0.9953,
			1.0038,
			1.0108,
			1.0163,
			1.0201,
			1.0225,
			1.0234,
			1.0231,
			1.0218,
			1.0197,
			1.017,
			1.014,
			1.0107,
			1.0075,
			1.0044,
			1.0016,
			0.9991,
			0.9971,
			0.9955,
			0.9943,
			0.9936,
			0.9933,
			0.9934,
			0.9937,
			0.9943,
			0.9951,
			0.9959,
			0.9969,
			0.9978,
			0.9987,
			0.9995,
			1.0002,
			1.0008,
			1.0013,
			1.0016,
			1.0018,
			1.0019,
			1.0019,
			1.0018,
			1.0016,
			1.0014,
			1.0012,
			1.0009,
			1.0007,
			1.0004,
			1.0002,
			1,
			0.9998,
			0.9996,
			0.9995,
			0.9995,
			0.9995,
			0.9995,
			0.9995,
			0.9995,
			0.9996,
			0.9997,
			0.9997,
			0.9998,
			0.9999,
			0.9999,
			1
		)
		0.2s forwards;
}

@keyframes kraan-animation {
	from {
		right: -200px;
		top: -100px;
		opacity: 0;
	}
	to {
		right: -80px;
		top: 0;
		opacity: 1;
	}
}

@media (min-width: 769px) {
	@keyframes kraan-animation {
		from {
			right: -300px;
			top: -200px;
			opacity: 0;
		}
		to {
			right: -90px;
			top: -40px;
			opacity: 1;
		}
	}
}

@media (min-width: 992px) {
	@keyframes kraan-animation {
		from {
			right: -400px;
			top: -200px;
			opacity: 0;
		}
		to {
			right: -200px;
			top: -40px;
			opacity: 1;
		}
	}
}

/* rotate animation */

body:not([data-editor-mode="content"]) .header .content-on-video .rotate-text {
	position: absolute;
	transform-origin: bottom center;

	animation: letter-turn 1s
		linear(
			0,
			0.0008,
			0.003,
			0.0068,
			0.0121,
			0.0189,
			0.0272,
			0.0371,
			0.0484,
			0.0613,
			0.0756,
			0.0915,
			0.1089,
			0.1278,
			0.1482,
			0.1702,
			0.1936,
			0.2186,
			0.245,
			0.273,
			0.3025,
			0.3335,
			0.366,
			0.4001,
			0.4356,
			0.4727,
			0.5112,
			0.5513,
			0.5929,
			0.636,
			0.6806,
			0.7268,
			0.7744,
			0.8236,
			0.8742,
			0.9264,
			0.9801,
			0.9828,
			0.957,
			0.9328,
			0.91,
			0.8888,
			0.869,
			0.8508,
			0.8341,
			0.8189,
			0.8052,
			0.7931,
			0.7824,
			0.7733,
			0.7656,
			0.7595,
			0.7549,
			0.7518,
			0.7502,
			0.7502,
			0.7516,
			0.7546,
			0.759,
			0.765,
			0.7725,
			0.7815,
			0.792,
			0.8041,
			0.8176,
			0.8327,
			0.8492,
			0.8673,
			0.8869,
			0.908,
			0.9306,
			0.9548,
			0.9804,
			0.9963,
			0.9837,
			0.9727,
			0.9631,
			0.9551,
			0.9485,
			0.9435,
			0.94,
			0.938,
			0.9375,
			0.9386,
			0.9411,
			0.9452,
			0.9507,
			0.9578,
			0.9664,
			0.9765,
			0.9881,
			0.9994,
			0.9934,
			0.9889,
			0.986,
			0.9845,
			0.9846,
			0.9862,
			0.9893,
			0.9939,
			1
		)
		1s both;
}

@keyframes letter-turn {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: translateY(10px) rotate(25deg);
	}
}

/* animate img container diensten */

body:not([data-editor-mode="content"]) .img-animate-container {
	animation: container-animation 1.56s
		linear(
			0,
			-0.0003,
			-0.0013,
			-0.0028,
			-0.0047,
			-0.0071,
			-0.0099,
			-0.013,
			-0.0162,
			-0.0197,
			-0.0232,
			-0.0268,
			-0.0303,
			-0.0337,
			-0.037,
			-0.04,
			-0.0428,
			-0.0452,
			-0.0472,
			-0.0487,
			-0.0496,
			-0.0499,
			-0.0496,
			-0.0485,
			-0.0465,
			-0.0437,
			-0.04,
			-0.0353,
			-0.0295,
			-0.0225,
			-0.0144,
			-0.005,
			0.0057,
			0.0179,
			0.0314,
			0.0465,
			0.0632,
			0.0816,
			0.1017,
			0.1235,
			0.1472,
			0.1728,
			0.2004,
			0.23,
			0.2617,
			0.2957,
			0.3318,
			0.3702,
			0.411,
			0.4543,
			0.5,
			0.5457,
			0.589,
			0.6298,
			0.6682,
			0.7044,
			0.7383,
			0.77,
			0.7996,
			0.8272,
			0.8528,
			0.8765,
			0.8983,
			0.9184,
			0.9368,
			0.9535,
			0.9686,
			0.9821,
			0.9943,
			1.005,
			1.0144,
			1.0225,
			1.0295,
			1.0353,
			1.04,
			1.0438,
			1.0465,
			1.0485,
			1.0496,
			1.0499,
			1.0496,
			1.0487,
			1.0472,
			1.0452,
			1.0428,
			1.0401,
			1.037,
			1.0337,
			1.0303,
			1.0268,
			1.0232,
			1.0197,
			1.0162,
			1.013,
			1.0099,
			1.0072,
			1.0047,
			1.0028,
			1.0013,
			1.0003,
			1
		)
		1s forwards;
}

@keyframes container-animation {
	from {
		right: -500px;
	}
	to {
		right: -80px;
	}
}

@media (min-width: 769px) {
	@keyframes container-animation {
		from {
			right: -900px;
		}
		to {
			right: -180px;
			top: 100px;
		}
	}
}

@media (min-width: 992px) {
	@keyframes container-animation {
		from {
			right: -1000px;
		}
		to {
			right: -80px;
			top: 100px;
		}
	}
}

/* about us animation */

body:not([data-editor-mode="content"]) .section-img-animation.about-us.in-view {
	animation: about-animation 6.56s
		linear(
			0,
			0.0237,
			0.0888,
			0.186,
			0.3058,
			0.4393,
			0.5783,
			0.7155,
			0.8448,
			0.9616,
			1.0622,
			1.1446,
			1.2077,
			1.2516,
			1.2772,
			1.2861,
			1.2805,
			1.2627,
			1.2356,
			1.2017,
			1.1638,
			1.124,
			1.0847,
			1.0474,
			1.0137,
			0.9844,
			0.9604,
			0.9419,
			0.9288,
			0.9211,
			0.9182,
			0.9195,
			0.9243,
			0.9318,
			0.9414,
			0.9522,
			0.9635,
			0.9748,
			0.9856,
			0.9953,
			1.0038,
			1.0108,
			1.0163,
			1.0201,
			1.0225,
			1.0234,
			1.0231,
			1.0218,
			1.0197,
			1.017,
			1.014,
			1.0107,
			1.0075,
			1.0044,
			1.0016,
			0.9991,
			0.9971,
			0.9955,
			0.9943,
			0.9936,
			0.9933,
			0.9934,
			0.9937,
			0.9943,
			0.9951,
			0.9959,
			0.9969,
			0.9978,
			0.9987,
			0.9995,
			1.0002,
			1.0008,
			1.0013,
			1.0016,
			1.0018,
			1.0019,
			1.0019,
			1.0018,
			1.0016,
			1.0014,
			1.0012,
			1.0009,
			1.0007,
			1.0004,
			1.0002,
			1,
			0.9998,
			0.9996,
			0.9995,
			0.9995,
			0.9995,
			0.9995,
			0.9995,
			0.9995,
			0.9996,
			0.9997,
			0.9997,
			0.9998,
			0.9999,
			0.9999,
			1
		)
		0.2s forwards;
}

@keyframes about-animation {
	from {
		right: -500px;
	}
	to {
		right: -80px;
	}
}

@media (min-width: 769px) {
	@keyframes about-animation {
		from {
			right: -900px;
		}
		to {
			right: -180px;
			top: -100px;
		}
	}
}

@media (min-width: 992px) {
	@keyframes about-animation {
		from {
			right: -1000px;
		}
		to {
			right: -500px;
			top: -500px;
		}
	}
}