/* BLOCK TYPE 9 - text */
/* BLOCK TYPE 9 - text */
/* BLOCK TYPE 9 - text */

.block_type_9 {
	position: relative;
	display: grid;
	min-height: 40vw;
	background-color: white;
	padding: 5vw;

	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	font-family: Open Sans, Helvetica, sans serif;
}
.block_type_9::before {
	content: '9';
	background-color: #84de02;
}

.block_type_9.theme_licht {
	background-color: var(--bg-light);
	color: var(--txt-light);
}
.block_type_9.theme_donker {
	background-color: var(--bg-dark);
	color: var(--txt-dark);
}

.block_type_9 > div {
	position: relative;
	width: 100%;
	font-size: var(--txt-subhero);
	font-weight: 400;
	color: var(--clr-black-50);
	line-height: normal;
	text-align: center;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.block_type_9 > div:first-child {
	font-size: var(--txt-cta-big);
	font-family: Gilroy, Open Sans, Helvetica, sans serif;
	font-weight: 400;
	line-height: normal;
	color: inherit;
	padding-bottom: 5vw;
}
.block_type_9 > div a {
	position: relative;
	margin-left: 0.5em;
	color: var(--clr-black-100);
	font-weight: 500;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	transition: color 0.25s ease-in-out;
}
.block_type_9 > div a div {
	position: relative;
	width: 1.5em;
	height: 1.5em;
	margin-left: 0.5em;
	border-radius: 50%;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.block_type_9 > div a svg {
	width: 100%;
	height: 100%;
	color: inherit;
}

/* COLOR */
.block_type_9.color_magenta > div a div svg {
	color: var(--clr-magenta-100);
}
.block_type_9.color_blauw > div a div svg {
	color: var(--clr-blue-100);
}
.block_type_9.color_groen > div a div svg {
	color: var(--clr-green-100);
}
.block_type_9.color_oranje > div a div svg {
	color: var(--clr-orange-100);
}
.block_type_9.color_magenta > div a:hover {
	color: var(--clr-magenta-100);
}
.block_type_9.color_blauw > div a:hover {
	color: var(--clr-blue-100);
}
.block_type_9.color_groen > div a:hover {
	color: var(--clr-green-100);
}
.block_type_9.color_oranje > div a:hover {
	color: var(--clr-orange-100);
}

@media (max-width: 600px) {
	.block_type_9 {
		padding-top: 20vw;
		padding-bottom: 20vw;
	}
}