/* BLOCK TYPE 21 - case text + project info */
/* BLOCK TYPE 21 - case text + project info */
/* BLOCK TYPE 21 - case text + project info */

.block_type_21 {
	position: relative;
	background-color: white;
	color: var(--clr-black-100);
	padding: 5vw 0 5vw 5vw;

	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5vw;
	grid-template-rows: auto auto;
}
.block_type_21::before {
	content: '21';
	background-color: #84de02;
}
.block_type_21.theme_licht {
	background-color: var(--bg-light);
	color: var(--txt-light);
}
.block_type_21.theme_donker {
	background-color: var(--bg-dark);
	color: var(--txt-dark);
}

.block_type_21 .left {
	opacity: 0;
	transform: translateX(-150px);
	transition: 0.5s ease-in-out;
}

.block_type_21 .number {
	color: var(--txt-gray);
}
.block_type_21 .heading {
	font-size: var(--txt-header-2);
	font-weight: 500;
}
.block_type_21 .right {
	grid-column: 2;
	font-size: var(--txt-standard);
	font-weight: 300;
	background-color: var(--clr-magenta-100);
	padding: 5vw 5vw 5vw 2.5vw;

	opacity: 0;
	transform: translateX(150px);
	transition: 0.5s ease-in-out;
	transition-delay: 0.25s;
}
.block_type_21 .right .content{
	font-family: Open Sans, Helvetica, Arial, sans serif;
	color: white;
	display: grid;
	grid-template-columns: 1fr 99fr;
	column-gap: 3vw;
	row-gap: 1vw;
}
.block_type_21 .right .content label{
	font-family: Gilroy, Open Sans, Helvetica, Arial, sans serif;
	font-size: var(--txt-small);
	font-weight: 300;
	line-height: 2em;
}

.block_type_21.into-view .left,
.block_type_21.into-view .right {
	transform: translateX(0px);
	opacity: 1;
}

@media (max-width: 1000px) {
	.block_type_21 {
		grid-template-columns: 1fr;
		padding: 10vw 5vw;
	}
	.block_type_21 .right {
		grid-column: 1 / -1;
		padding: 10vw 5vw 10vw 5vw;
	}
	.block_type_21 .right .content{
		column-gap: 4vw;
		row-gap: 2vw;
	}
	.block_type_21 .right .content label{
		font-weight: 500;
	}
}


/* .block_type_21 {
	position: relative;
	min-height: 30vh;

	display: grid;
	grid-template-columns: 5vw repeat(2, 1fr);
	grid-template-rows: 5vw 1fr 5vw;
	grid-column-gap: 0px;
	grid-row-gap: 0px;

	background-color: lightgray;
}
.block_type_21::before {
	content: '21';
}
/* THEME */
/* .block_type_21.theme_licht {
	background-color: var(--bg-light);
	color: var(--txt-light);
}
.block_type_21.theme_donker {
	background-color: var(--bg-dark);
	color: var(--txt-dark);
}

.block_type_21 .left {
	grid-area: 2 / 2 / 3 / 3;
	color: inherit;
	padding-right: 5vw;
}
.block_type_21 .left .number {
	font-size: 32px;
	font-weight: 300;
}
.block_type_21 .left .heading {
	font-size: 68px;
	font-weight: 400;
	margin-bottom: 1em;
}
.block_type_21 .left .text {
	font-size: 24px;
	font-weight: 400;
}
.block_type_21 .right {
	grid-area: 2 / 3 / 3 / 4;

	width: 100%;
	height: 100%;
}
.block_type_21 .right .content {
	width: 100%;
	max-height: 100%;

	display: grid;
	grid-template-columns: 25% 1fr;
	grid-template-rows: auto;
	gap: 2em;
	padding: 4em;
}
.block_type_21 .right .content div:nth-child(odd) {
	font-size: 24px;
	font-weight: 300;
}
.block_type_21 .right .content div:nth-child(even) {
	font-size: 24px;
	line-height: 38px;
	font-weight: 400;
} */

/* COLOR */
/* .block_type_21.color_magenta .right .content {
	background-color: var(--clr-magenta-90);
	color: white;
}
.block_type_21.color_blauw .right .content {
	background-color: var(--clr-blue-90);
	color: white;
}
.block_type_21.color_groen .right .content {
	background-color: var(--clr-green-90);
	color: white;
}
.block_type_21.color_oranje .right .content {
	background-color: var(--clr-orange-90);
	color: white;
}  */