body {
	font-optical-sizing: auto;
}

header {
	background-color: var(--color-bg-blue);
	width: 100%;
}

.allContent:has(#cookieNotice) {
	margin-top: 81px;
}

.allContent:has(#cookieNotice) .container-fluid.movable {
	margin-top: 21px;
}

.fixed {
	position: fixed;
}

.header-container {
	top: 0;
	width: 100%;
	z-index: 100;
}

.header-container header {

}

.container-fluid.movable {
	margin-top: 81px;
}

header .topBar {
	display: grid;
	grid-template-columns: minmax(255px, 320px) 1fr auto minmax(120px, auto);
	max-width: 1600px;
	padding: 20px 20px 15px;
}

header .topBar .logo img {
	width: 255px;
}

header .topBar .icons {
	margin-top: 8px;
	text-align: right;
}

header .topBar .icons .iz-icon.open {
	color: var(--color-text-white);
}

/*header .topBar .icons .iz-icon.bx-shopping-bag:after {*/
	/*align-items: center;*/
	/*background-color: var(--color-bg-white);*/
	/*border-radius: 50%;*/
	/*color: var(--color-text-orange);*/
	/*content: attr(data-amount);*/
	/*display: flex;*/
	/*font-size: 0.8rem;*/
	/*height: 20px;*/
	/*justify-content: center;*/
	/*line-height: 1;*/
	/*position: absolute;*/
	/*top: -5px;*/
	/*right: -8px;*/
	/*width: 20px;*/
/*}*/

header .topBar nav {
	padding-top: 13px;
}

header .topBar nav ul li {
	padding: 0 20px 0 0;
}

header .topBar nav ul li a {
	color: var(--color-text-white);
	font: var(--font-extra-bold);
	font-size: 1.125rem;
	text-decoration: none;
}

header .topBar nav ul li.active a,
header .topBar nav ul li a:hover {
	color: var(--color-text-orange);
}

header .topBar .icons a {
	color: var(--color-text-orange);
	font-size: 1.4rem;
	margin-left: 8px;
	transition: color .2s;
}

.header-shop-icon {
	position: relative;
}

.header-shop-icon .shop-counter-span {
	align-items: center;
	background-color: var(--color-bg-white);
	border-radius: 50%;
	color: var(--color-text-orange);
	content: attr(data-amount);
	display: flex;
	font-size: 0.8rem;
	height: 20px;
	justify-content: center;
	line-height: 1;
	position: absolute;
	top: -5px;
	right: -8px;
	width: 20px;
}

header .topBar .icons a:first-child {
	margin-left: 0;
}

.topBar nav ul li a:hover,
.topBar nav ul li.active a {
	border-bottom: 2px solid var(--color-bg-orange);
	padding-bottom: 3px;
	text-decoration: none;
}

header .topBar .icons a:hover {
	color: var(--color-text-white);
}

header .topBar nav.top-right a {
	color: var(--color-text-orange);
	font: var(--font-extra-bold);
	font-size: 0.875rem;
}

header .topBar nav.top-right a:hover,
header .topBar nav.top-right .active a {
	border-bottom-color: var(--color-bg-white);
	color: var(--color-text-white);
}

/* Header slider */

.header-wrapper {
	background-color: var(--color-bg-green-light);
	padding: 24px;
}

.swiper-container.header-slider {
	border-radius: 13px;
}

.swiper-container.header-slider,
.swiper-container.header-slider .swiper-wrapper,
.swiper-container.header-slider .swiper-slide {
	padding-bottom: 38.8%;
}

.swiper-container.header-slider .swiper-slide img {
	width: 100%;
}

.swiper-container.header-slider .header-content {
	bottom: 0;
	margin: 0 auto;
	max-width: 1600px;
	/*padding: 40px 25px;*/
	position: absolute;
	width: 100%;
	z-index: 40;
}

.swiper-container.header-slider .header-content .blockContainer :is(h1, h2, h3, p:not(.label)) {
	color: var(--color-white);
}

.swiper-container.header-slider .header-content .blockContainer > div {
	padding: 60px 75px;
}

/*.header-content {*/
/*}*/

#content {
	padding: 0;
}

#content[data-shop="1"] {
	padding: 35px 0 60px;
}

.superBlockContainer > div,
.blockContainer > div,
.contentCenter .pageTitle {
	margin: 0 auto;
	max-width: 1600px;
	padding: 40px 25px;
	width: 100%;
}

.contentCenter .pageTitle {
	padding: 0 0 20px;
}

.blockContainer > div {

}

.superBlockContainer .blockContainer > div {
	padding: 0;
}

/* Search page */
body[data-id="102"] .blockContainer:has(.iz-breadcrumb),
body[data-id="102"] section#content .contentCenter .blockContainer,
body[data-id="102"] .iz-breadcrumb {
	background-color: var(--color-bg-green-light);
}

body[data-id="102"] section#content .contentCenter .blockContainer > div {
	padding-top: 0;
}

.blockContainer.bg-image {
	align-items: flex-end;
	aspect-ratio: 3 / 1;
	display: flex;
}

.blockContainer.bg-image > div {
}

.blockContainer.bg-image .blockItemType-text h2,
.blockContainer.bg-image .blockItemType-text p {
	text-shadow: 0 0 5px var(--color-text-black);
}

.blockContainer.bg-image .blockItemType-text h2 {
	filter: none;
}

.blockContainer.bg-image.blockColor-2 .blockItemType-text h2 {
	color: var(--color-text-white);
}

.blockContainer.bg-image.blockColor-4 .blockItemType-text h2 {
	color: var(--color-text-white);
}

.blockContainer.bg-image .blockItemType-text a {
	text-shadow: none;
}

.blockContainer .blockTitle {
	margin: 0 auto 25px auto;
	/*margin: 0 auto 40px auto;*/
}

.blockContainer.searchpage > div {
	max-width: 1200px;
}

.blockContainer .searchResultsHeader h1 {
	display: none;
}

.blockContainer .blockitems, .blockitem .formblockitems {
	grid-column-gap: 75px;
}

body[data-id="102"] section#content .contentCenter .blockContainer {
	background-image: url(/images/app/devragendokter/icon-circle-orange.svg);
	background-repeat: no-repeat;
	background-position: bottom -206px right -369px;
	background-size: 740px;
	position: relative;
}

body[data-id="102"] .contentCenter .blockContainer > div {
	/*bottom: 0;*/
	/*position: absolute;*/
	/*right: 0;*/
}

.search-overlay {
	background-color: rgba(0, 0, 0, 0.65);
	bottom: 0;
	height: calc(100vh - 81px);
	left: 0;
	opacity: 0;
	position: absolute;
	right: 0;
	top: 81px;
	transition: opacity .2s, visibility .2s;
	visibility: hidden;
	width: 100vw;
	z-index: 100;
}

.search-overlay.open {
	opacity: 1;
	visibility: visible;
}

.search-wrapper {
	margin: 21px auto 0 auto;
	max-width: 1050px;
	min-height: 550px;
	width: 100%;
}

.no-search-results {
	margin-top: 30px;
}

.search-wrapper h2 {
	float: left;
}

.search-wrapper .tabs,
.search-wrapper .results-for-tab {
	margin-left: 45px;
}

.search-wrapper .tabs {
	padding: 35px 0;
}

.search-wrapper .results-for-tab > h2 {
	margin-bottom: 25px;
}

.search-wrapper .search-result {
	font-size: 1.125rem;
	padding-right: 200px;
}

.search-wrapper .search-result .title {
	font: var(--font-extra-bold);
	font-size: 1.4375rem;
}

.search-wrapper .search-result .title a {
	color: var(--color-text-black);
}

.search-wrapper .search-result .searchReadMore {
	font: var(--font-bold);
	font-size: 0.875rem;
	margin-top: 10px;
}

.search-wrapper .tabs .tab {
	background-color: var(--color-bg-orange);
	border: 1px solid var(--color-bg-orange);
	border-radius: 20px;
	color: var(--color-bg-white);
	transition: background-color .2s, color .2s;
}

.search-wrapper .tabs .tab:hover {
	background-color: var(--color-bg-white);
	color: var(--color-text-orange);
}

.siteSearch {
	height: 52px;
	margin: 42px auto 0 auto;
	padding-left: 30px;
}

.siteSearch .categories {
	bottom: 0;
	font-size: 0.8rem;
	left: 27px;
	margin-bottom: 5px;
	position: absolute;
	width: 100%;
}

.siteSearch .categories .category {
	background-color: var(--color-bg-blue);
	border-radius: 10px;
	color: var(--color-text-white);
	display: inline-block;
	padding: 2px 7px 0 30px;
	width: fit-content;
}

.siteSearch label {
	display: none;
}

.siteSearch form {
	position: relative;
}

.siteSearch form input,
.siteSearch form span {
	position: absolute;
}

.siteSearch form span:not(.iz-icon) {
	color: var(--color-text-orange);
	font-size: 1.7rem;
	right: -20px;
	top: 6px;
	z-index: 5;
}

.siteSearch form span.iz-icon {
	cursor: pointer;
	margin-left: -22px;
	margin-top: 6px;
	z-index: 10;
}

.siteSearch input[type="text"] {
	appearance: none;
	border: none;
	border-radius: 25px;
	font-size: 1.125rem;
	padding: 15px 30px;
	width: calc(100% + 57px);
}

.siteSearch input[type="text"],
.siteSearch input[type="text"]::placeholder {
	color: var(--color-text-blue);

}

.siteSearch input[type="text"]:focus {
	outline: none;
}

.siteSearch .iz-icon {
}

.search-overlay .siteSearch {
	max-width: 1050px;
	width: 100%;
}

.blockContainer .iz-breadcrumb {
	font-size: 0.75rem;
	padding: 2px 25px;
}

.iz-breadcrumb > div {
	margin: 0 auto;
	max-width: 100%;
	padding: 0;
	width: 1600px;
}

.iz-breadcrumb a {
	color: var(--color-text-blue);
}

.breadcrumb-separator {
	padding: 0 9px;
}


/* Mobile menu */
header .topBar-mobile {
	display: none;
	min-height: 81px;
}

.mobile-sidebar {
	background-color: var(--color-bg-blue);
	border-top: 3px solid var(--color-bg-orange);
	bottom: 0;
	height: 100vh;
	left: 100vw;
	line-height: 3.3;
	padding: 32px 25px;
	position: fixed;
	text-align: right;
	top: 81px;
	transition: left .2s;
	width: 100vw;
	z-index: 10000;
}

body.mobileMenuOpen .mobile-sidebar {
	left: 0;
}

.mobile-sidebar nav a {
	color: var(--color-text-white);
	font: var(--font-extra-bold);
	font-size: 1.625rem;
}

.mobile-sidebar nav.top-right {
	line-height: 2.4;
	margin-top: 30px;
}

.mobile-sidebar nav.top-right a {
	font-size: 1.25rem;
}

.mobile-sidebar nav.top-right a,
.mobile-sidebar .icons a {
	color: var(--color-text-orange);
}

.mobile-sidebar .icons {
	line-height: 1.6;
	margin-top: 20px;
}

.mobile-sidebar .icons a {
	font-size: 1.9rem;
}

/* Form */
.blockContainer .blockItemType-form form button {
	float: right;
}

.blockContainer .blockItemType-form .required-label {
	color: var(--color-text-orange);
}

.blockContainer .blockItemType-form fieldset input {
	margin-right: 3px;
}

.blockContainer .blockItemType-form label,
.blockContainer .blockItemType-form fieldset {
	color: var(--color-text-black);
}

.blockContainer .blockItemType-form input::placeholder,
.blockContainer .blockItemType-form textarea::placeholder {
	opacity: 0;
}

.blockContainer.blockColor-2 .blockItemType-form label,
.blockContainer.blockColor-2 .blockItemType-form fieldset,
.blockContainer.blockColor-4 .blockItemType-form label,
.blockContainer.blockColor-4 .blockItemType-form fieldset {
	color: var(--color-text-white);
}

.blockContainer .formBlock input[type="text"],
.blockContainer .formBlock input[type="password"],
.blockContainer .formBlock input[type="email"],
.blockContainer .formBlock select,
.blockContainer .formBlock select option,
.blockContainer .formBlock textarea {
	border: 1px solid var(--color-bg-white);
}

.blockContainer.blockColor-0 .formBlock input[type="text"],
.blockContainer.blockColor-0 .formBlock input[type="password"],
.blockContainer.blockColor-0 .formBlock input[type="email"],
.blockContainer.blockColor-0 .formBlock select,
.blockContainer.blockColor-0 .formBlock select option,
.blockContainer.blockColor-0 .formBlock textarea {
	border: 1px solid var(--color-bg-gray);
}

/* Article blocks */
.blockContainer .articleBlock h2.title {
	font-size: 1.4375rem;
	line-height: 1.3;
	margin-top: 20px;
}

.blockContainer .articleBlock a.loadMoreRedirect {
	font-size: 1.125rem;
	margin-top: 30px;
}

.articleBlock .filter {
	margin-bottom: 50px;
	/*margin-bottom: 38px;*/
}

.articleBlock .filter .category-wrapper {
	display: grid;
	grid-template-columns: 210px auto;
	padding: 5px 0;
}

/*.articleBlock.layout3 .filter .category-wrapper {*/
/*	display: inline-block;*/
/*	margin-left: 33px;*/
/*}*/

.articleBlock .filter .filter-group-label {
	color: var(--color-text-blue);
	font: var(--font-bold);
}

.blockContainer.blockColor-2 .articleBlock .filter .filter-group-label,
.blockContainer.blockColor-4 .articleBlock .filter .filter-group-label {
	color: var(--color-text-white);
}

.articleBlock .filter span.category {
	background-color: var(--color-bg-blue-lighter);
	border-radius: 10px;
	color: var(--color-text-blue);
	font: var(--font-bold);
	font-size: 0.875rem;
	margin-right: 7px;
	padding: 3px 19px;
}

.blockContainer.blockColor-3 .articleBlock .filter span.category:not(.allCategories) {
	background-color: var(--color-bg-white);
	color: var(--color-text-blue);
}

.articleBlock .filter span.category.active {
	background-color: var(--color-bg-blue);
	color: var(--color-text-white);
}

.blockContainer.blockColor-3 .articleBlock .filter span.category.active:not(.allCategories) {
	background-color: var(--color-bg-blue);
	color: var(--color-text-white);
}

.articleBlock .filter .category-wrapper:has(.allCategories.active) span.category:not(.allCategories) {
	background-color: var(--color-bg-blue-lighter);
	color: var(--color-text-blue);
}

.blockContainer.blockColor-3 .articleBlock .filter .category-wrapper:has(.allCategories.active) span.category:not(.allCategories) {
	background-color: var(--color-bg-white);
	color: var(--color-text-blue);
}

.articleBlock.layout1:has(.swiper-container) {
	overflow: hidden;
}

.articleBlock.layout1 .swiper-slide,
.articleBlock.layout2 .article {
	border-radius: 15px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 20px;
	/*width: calc(100% - 50px) !important;*/
}

.articleBlock.layout1 .swiper-slide a.articleReadMore,
.articleBlock.layout2 .article a.articleReadMore {
	display: inline;
	width: fit-content;
	margin-top: auto;
}

.articleBlock.layout1 .swiper-slide h2.title {
	font-size: 1.4375rem;
	margin-bottom: 15px;
}

.articleBlock.layout1 .swiper-slide .articleContent .image,
.articleBlock.layout2 .article .articleContent .image {
	aspect-ratio: 1;
	mask: url(/images/app/devragendokter/icon-star.svg);
	mask-size: 100%;
	mask-repeat: no-repeat;
	margin: 17px auto 25px;
	max-height: 268px;
	max-width: 268px;
}

.articleBlock.layout1 .swiper-slide .articleContent .image img,
.articleBlock.layout2 .article .articleContent .image img {
	height: 100%;
	width: 100%;
	/*aspect-ratio: 1;*/
}

/*.articleBlock.layout1 .bgColor-1 {*/
/*	background-color: var(--color-bg-green-light);*/
/*}*/

/*.articleBlock.layout1 .bgColor-2 {*/
/*	background-color: var(--color-bg-green);*/
/*}*/

/*.articleBlock.layout1 .bgColor-3 {*/
/*	background-color: var(--color-bg-blue);*/
/*}*/

/*.articleBlock.layout1 .bgColor-4 {*/
/*	background-color: var(--color-bg-blue-light);*/
/*}*/

/*.articleBlock.layout1 .bgColor-5 {*/
/*	background-color: var(--color-bg-orange);*/
/*}*/

.blockContainer .articleBlock.layout1 .bgColor-1 :is(p, a:not(.button-orange), h1, h2, h3),
.blockContainer .articleBlock.layout1 .bgColor-4 :is(p, a:not(.button-orange), h1, h2, h3) {
	color: var(--color-text-black);
	filter: unset;
}

.blockContainer .articleBlock.layout1 .bgColor-2 :is(p, a:not(.button-orange), h1, h2, h3),
.blockContainer .articleBlock.layout1 .bgColor-3 :is(p, a:not(.button-orange), h1, h2, h3),
.blockContainer .articleBlock.layout1 .bgColor-5 :is(p, a:not(.button-orange), h1, h2, h3) {
	color: var(--color-text-white);
	filter: unset;
}

.blockContainer .articleBlock.layout1 .categories a.category {
	background-color: var(--color-bg-white);
	border-radius: 15px;
	color: var(--color-text-blue);
	display: inline-block;
	font: var(--font-bold);
	font-size: 0.875rem;
	margin-bottom: 7px;
	margin-right: 7px;
	padding: 2px 15px;
	white-space: nowrap;
}

.articleBlock.layout1 .swiper-navigation {
	display: grid;
	font-size: 1.4rem;
	gap: 12px;
	grid-template-columns: auto 50px 50px;
	height: 60px;
	margin-top: 20px;
	position: relative;
}

.articleBlock.layout1 .swiper-navigation .swiper-button-prev,
.articleBlock.layout1 .swiper-navigation .swiper-button-next {
	border: 1px solid var(--color-bg-blue);
	border-radius: 50%;
	color: var(--color-text-blue);
	height: 50px;
	left: unset;
	position: relative;
	right: unset;
	transition: background-color .2s, color .2s;
	width: 50px;
}

.articleBlock.layout1 .swiper-navigation .swiper-button-prev:after,
.articleBlock.layout1 .swiper-navigation .swiper-button-next:after {
	content: '';
}

.articleBlock.layout1 .swiper-navigation .swiper-button-prev:hover,
.articleBlock.layout1 .swiper-navigation .swiper-button-next:hover {
	background-color: var(--color-bg-blue);
	color: var(--color-text-white);
}

/* Layout 2 */

.articleBlock.layout2 .articles {
	display: grid;
	gap: 25px;
	grid-template-columns: repeat(4, 1fr);
}

.articleBlock.layout2 .articles p {
	font-size: 1.125rem;
}

.articleBlock.layout1 .articles .groups p {
	font: var(--font-bold);
	font-size: 0.875rem;
	line-height: 1.1;
	padding-bottom: 25px;
}

.articleBlock.layout2 .articles .article-text p {
	margin-bottom: 0;
	padding-bottom: 10px;
}


:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+1) {
	background-color: var(--color-bg-green-light);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+2) {
	background-color: var(--color-bg-green);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-2, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+2) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-white);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+3) {
	background-color: var(--color-bg-blue);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-x, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+3) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-white);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+4) {
	background-color: var(--color-bg-blue-light);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+5) {
	background-color: var(--color-bg-orange);
}
:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-x, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+5) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-white);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+5) a.button-orange {
	background-color: var(--color-bg-white);
	color: var(--color-text-orange);
}

:is(.blockContainer.blockColor-0, .blockContainer.blockColor-1, .blockContainer.blockColor-3, .blockContainer.blockColor-5) .articleBlock.layout1 .articles .article:nth-child(5n+5) a.button-orange:hover {
	background-color: var(--color-bg-orange);
	border: 1px solid var(--color-bg-white);
	color: var(--color-text-white);
}

/* Blauwe achtergrond 4 kolommen */

/* 1, 2, 4, 5 */
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+1),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+8),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+11),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+14) {
	background-color: var(--color-bg-green-light);
}

.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+1) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+8) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+11) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+14) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-black);
}

/* 2, 4, 5, 1 */
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+5),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+12),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+15) {
	background-color: var(--color-bg-green);
}

.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+2) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+5) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+12) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+15) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-white);
}

/* 4, 5, 1, 2 */
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+3),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+6),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+9),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+16) {
	background-color: var(--color-bg-blue-light);
}

/* 5, 1, 2, 4 */
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+4),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+7),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+10),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+13) {
	background-color: var(--color-bg-orange);
}

.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+4) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+7) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+10) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+13) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-white);
}

.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+4) a.button-orange,
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+7) a.button-orange,
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+10) a.button-orange,
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+13) a.button-orange {
	background-color: var(--color-bg-white);
	color: var(--color-text-orange);
}

.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+4) a.button-orange:hover,
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+7) a.button-orange:hover,
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+10) a.button-orange:hover,
.blockContainer.blockColor-2 .articleBlock.layout1 .articles .article:nth-child(16n+13) a.button-orange:hover {
	background-color: var(--color-bg-orange);
	border: 1px solid var(--color-bg-white);
	color: var(--color-text-white);
}

/* Groene achtergrond 4 kolommen */

/* 1, 3, 4, 5 */
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+1),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+8),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+11),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+14) {
	background-color: var(--color-bg-green-light);
}

.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+1) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+8) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+11) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+14) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-black);
}

/* 3, 4, 5, 1 */
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+5),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+12),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+15) {
	background-color: var(--color-bg-blue);
}

.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+2) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+5) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+12) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+15) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-white);
}

/* 4, 5, 1, 3 */
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+3),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+6),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+9),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+16) {
	background-color: var(--color-bg-blue-light);
}

/* 5, 1, 3, 4 */
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+4),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+7),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+10),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+13) {
	background-color: var(--color-bg-orange);
}

.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+4) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+7) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+10) :is(p, a:not(.button-orange):not(.category), h1, h2),
.blockContainer.blockColor-4 .articleBlock.layout1 .articles .article:nth-child(16n+13) :is(p, a:not(.button-orange):not(.category), h1, h2) {
	color: var(--color-text-white);
}


.articleBlock.layout1 .article :is(p, a:not(.button-orange), h1, h2) {
	color: var(--color-text-black);
	filter: none;
}



/* Layout 3 */
.articleBlock.layout3 .articles {
	display: grid;
	gap: 25px;
	grid-template-columns: repeat(4, 1fr);
}

.articleBlock.layout3 .article {
	padding: 8px;
}

.articleBlock.layout3 .article .articleContent {
	border-radius: 10px;
}

.articleBlock.layout3 .article .articleContent h2,
.articleBlock.layout3 .article .articleContent .categories {
	font: var(--font-bold);
	font-size: 1.278rem;
	line-height: 1.2
}

.articleBlock.layout3 .article h2.title {
	filter: unset;
	font-size: 1.4375rem;
	line-height: 1.3;
	margin-top: 0;
	padding-top: 7px;
		overflow-wrap: anywhere;     /* breekt woorden waar nodig, ook middenin */
		word-break: break-word;      /* extra zekerheid voor sommige browsers */
		hyphens: auto;               /* voegt automatisch afbreekstreepjes toe (werkt goed bij normale tekst) */

		 /*Optioneel: als je echt lange URLs hebt */
		/*word-break: break-all;       !* breekt bij elke letter als het moet *!*/
}

.articleBlock.layout3 .article .articleContent .categories a {
	color: var(--color-text-white);
}

.articleBlock.layout3 .article .articleContent .text-wrapper {
	aspect-ratio: 1.02;
	padding: 21px 18px;
	position: relative;
}

.articleBlock.layout3 .article .articleContent .text-wrapper .icon {
/*	align-items: center;
	background-color: var(--color-bg-white);
	border-radius: 50%;
	bottom: 12px;
	color: var(--color-text-blue);
	display: flex;
	height: 30px;
	justify-content: center;
	padding: 5px;
	position: absolute;
	right: 14px;
	width: 30px;
	font-size: 1.2rem */
	display: none;
}


/* Color 1 */
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+1),
.knowledge-wrapper .sidebar .articleBlock .article:nth-child(2n+1) {
	background-color: var(--color-bg-green-light);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+1) .articleContent,
.knowledge-wrapper .sidebar .articleBlock .article:nth-child(2n+1) .text-wrapper {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+1) :is(h2.title, h2.title a),
.knowledge-wrapper .sidebar .articleBlock .article:nth-child(2n+1) .text-wrapper :is(h2.title, h2.title a) {
	color: var(--color-text-light-green);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+1) .articleContent p {
	color: var(--color-text-light-green);
}

/* Color 2 */
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+2),
.knowledge-wrapper .sidebar .articleBlock .article:nth-child(2n+2) {
	background-color: var(--color-bg-green);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+2) .articleContent,
.knowledge-wrapper .sidebar .articleBlock .article:nth-child(2n+2) .text-wrapper {
	background-color: var(--color-bg-blue-light);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+2) :is(h2.title, h2.title a),
.knowledge-wrapper .sidebar .articleBlock .article:nth-child(2n+2) .text-wrapper :is(h2.title, h2.title a) {
	color: var(--color-text-green);
}

/* Color 3 */
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+3) {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+3) .articleContent {
	background-color: var(--color-bg-green-light);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(nn+3):is(h2.title, h2.title a) {
	color: var(--color-text-blue);
}

/* Color 4 */
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+4) {
	background-color: var(--color-bg-blue-light);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+4) .articleContent {
	background-color: var(--color-bg-orange);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+4) :is(h2.title, h2.title a) {
	color: var(--color-text-white);
}

/* Color 5 */
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+5) {
	background-color: var(--color-bg-orange);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+5) .articleContent {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-1, .blockColor-3, .blockColor-5) .articleBlock.layout3 .article:nth-child(5n+5) :is(h2.title, h2.title a) {
	color: var(--color-text-orange);
}


/* Blauwe achtergrond */

/* Color 1 */
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+1),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+8),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+11),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+14) {
	background-color: var(--color-bg-green-light);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+1) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+8) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+11) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+14) .articleContent {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+1) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+8) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+11) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+14) :is(h2.title, h2.title a) {
	color: var(--color-text-light-green);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+1) .articleContent p,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+8) .articleContent p,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+11) .articleContent p,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+14) .articleContent p {
	color: var(--color-text-light-green);
}

/* Color 2 */
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+2),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+5),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+12),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+15) {
	background-color: var(--color-bg-green);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+2) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+5) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+12) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+15) .articleContent {
	background-color: var(--color-bg-blue-light);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+2) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+5) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+12) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+15) :is(h2.title, h2.title a) {
	color: var(--color-text-green);
}

/* Color 4 */
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+3),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+6),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+9),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+16) {
	background-color: var(--color-bg-blue-light);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+3) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+6) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+9) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+16) .articleContent {
	background-color: var(--color-bg-orange);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+3) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+6) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+9) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+16) :is(h2.title, h2.title a) {
	color: var(--color-text-white);
}

/* Color 5 */
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+4),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+7),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+10),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+13) {
	background-color: var(--color-bg-orange);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+4) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+7) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+10) .articleContent,
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+13) .articleContent {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+4) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+7) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+10) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-2) .articleBlock.layout3 .article:nth-child(16n+13) :is(h2.title, h2.title a) {
	color: var(--color-text-orange);
}


/* Groene achtergrond */

/* Color 1 */
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+1),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+8),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+11),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+14) {
	background-color: var(--color-bg-green-light);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+1) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+8) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+11) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+14) .articleContent {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+1) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+8) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+11) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+14) :is(h2.title, h2.title a) {
	color: var(--color-text-light-green);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+1) .articleContent p,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+8) .articleContent p,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+11) .articleContent p,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+14) .articleContent p {
	color: var(--color-text-light-green);
}

/* Color 3 */
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+2),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+5),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+12),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+15) {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+2) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+5) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+12) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+15) .articleContent {
	background-color: var(--color-bg-green-light);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+2) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+5) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+12) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+15) :is(h2.title, h2.title a) {
	color: var(--color-text-blue);
}

/* Color 4 */
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+3),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+6),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+9),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+16) {
	background-color: var(--color-bg-blue-light);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+3) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+6) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+9) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+16) .articleContent {
	background-color: var(--color-bg-orange);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+3) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+6) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+9) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+16) :is(h2.title, h2.title a) {
	color: var(--color-text-white);
}

/* Color 5 */
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+4),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+7),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+10),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+13) {
	background-color: var(--color-bg-orange);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+4) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+7) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+10) .articleContent,
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+13) .articleContent {
	background-color: var(--color-bg-blue);
}
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+4) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+7) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+10) :is(h2.title, h2.title a),
.blockContainer:where(.blockColor-4) .articleBlock.layout3 .article:nth-child(16n+13) :is(h2.title, h2.title a) {
	color: var(--color-text-orange);
}




.articleBlock.layout3 .image {
	font-size: 0;
	line-height: 1;
}

.articleBlock.layout3 .image img {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

.articleBlock.layout3 .content {
	padding: 5px 0; /* 40px 0 5px */
}

/* Layout 4 */
.articleBlock.layout4 .article .articleContent .image {
	aspect-ratio: unset;
	margin: unset;
	mask: unset;
	max-height: unset;
	max-width: unset;
}

.articleBlock.layout4 .article .articleContent .image img {
	border-radius: 8px;
}

.articleBlock.layout4 .categories {
	margin-bottom: 14px;
}

/* Layout 5 */
.articleBlock.layout5 h3 {
	background-position: 0 10px;
	background-size: 15px;
	cursor: pointer;
	font-size: 1.125rem;
	padding-bottom: 15px;
	padding-left: 25px;
	text-decoration: underline;
}

.articleBlock.layout5 .blockContainer > div {
	/*padding: 10px 0 0;*/
	padding: 2px 25px 0 0;
}
.articleBlock.layout5 .line-wrapper {
	height: 46px;
}

.articleBlock.layout5 .line {
	border-bottom: 1px solid var(--color-bg-blue-light);
	color: var(--color-text-blue);
	cursor: pointer;
	text-align: right;
}

.articleBlock.layout5 .line .iz-icon {
	margin-top: -4px;
}

.swiper-pagination-progressbar {
	margin-top: 32px;
	position: relative;
	width: calc(100% - 140px);
}

.swiper-wrapper {
	height: auto !important;
}

.blockContainer.bgNext > div {
	padding-bottom: 10px;
}

.blockContainer.bgPrevious > div {
	padding-top: 10px;
}

/*footer .blockContainer.lastBlock > div {*/
/*	padding-bottom: 10px;*/
/*}*/

footer {
	background-color: var(--color-bg-blue-lighter);
	padding: 50px 0;
}

footer .footer-columns {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	margin-bottom: 20px;
}

footer > div {
	margin: 0 auto;
	max-width: 1200px;
	padding: 0 25px;
	width: 100%;
}

footer .blockItemType-media_file > div {
	text-align: right;
}

footer .blockItemType-media_file img {
	width: 139px;
}

footer .blockContainer > div {
	padding: 0;
}

.blockitem[class*="shape-"] {
	aspect-ratio: 1;
	position: relative;
}

.blockitem[class*="shape-"] > div,
.blockitem[class*="shape-"] > div picture {
	display: flex;
	height: 100%;
	position: relative;
}

.blockitem[class*="shape-"] img {
	mask-size: cover;
	object-fit: cover;
}

.blockitem.shape-circle img {
	mask-image: url('/images/app/devragendokter/icon-circle.svg');
	-webkit-mask-image: url('/images/app/devragendokter/icon-circle.svg');
}

.blockitem.shape-star img {
	mask-image: url('/images/app/devragendokter/icon-star.svg');
	-webkit-mask-image: url('/images/app/devragendokter/icon-star.svg');
}

.blockitem.shape-plus img {
	mask-image: url('/images/app/devragendokter/icon-plus.svg');
	-webkit-mask-image: url('/images/app/devragendokter/icon-plus.svg');
}


body[data-bgcolor="1"] .allContent {
	background-color: var(--color-bg-white);
}

body[data-bgcolor="2"] .allContent {
	background-color: var(--color-bg-blue);
}

body[data-bgcolor="3"] .allContent {
	background-color: var(--color-bg-blue-18);
}

body[data-bgcolor="4"] .allContent {
	background-color: var(--color-bg-green);
}

body[data-bgcolor="5"] .allContent {
	background-color: var(--color-bg-green-18);
}

body[data-bgcolor="6"] .allContent {
	background-color: var(--color-bg-blue-18);
}

/*#content:has(.education-content) {*/
/*	background-color: var(--color-bg-blue-18);*/
/*}*/
/**/
/*#content:has(.knowledge-content) {*/
/*	background-color: var(--color-bg-green-18);*/
/*}*/

.custom-content {
	max-width: 1170px;
	padding-bottom: 30px;
	padding-left: 105px;
	padding-top: 38px;
	width: 100%;
}

.custom-content .education-wrapper {
	display: grid;
	gap: 65px;
	grid-template-columns: 625px 375px;
	padding-top: 40px;
}

.custom-content .knowledge-wrapper {
	display: grid;
	gap: 65px;
	grid-template-columns: 625px 275px;
	padding-top: 40px;
}

.custom-content .knowledge-wrapper .articleBlock.layout3 {
	display: grid;
	gap: 20px;
}

.custom-content .knowledge-wrapper .sidebar span.label {
	color: var(--color-text-blue);
	display: inline-block;
	font: var(--font-bold);
	font-size: 1.125rem;
	margin-bottom: 15px;
}

.custom-content .education .blockContainer > div,
.custom-content .knowledge .blockContainer > div {
	padding-left: 0;
	padding-right: 0;
}

.custom-content .sidebar-content {
	background-color: var(--color-bg-green-light);
	color: var(--color-white);
	font-size: 1.4375rem;
	line-height: 1.2;
	padding: 8px;
}

body[data-bgcolor="2"] .custom-content :is(h1, p),
body[data-bgcolor="4"] .custom-content :is(h1, p) {
	color: var(--color-text-white);

}

.custom-content .sidebar-content > div {
	background-color: var(--color-bg-blue);
	border-radius: 10px;
	padding: 23px 27px 50px;
}

.custom-content .sidebar-content > div > div {
	padding-bottom: 37px;
}

.custom-content .sidebar-content div.label {
	color: var(--color-text-light-green);
	font: var(--font-bold);
	font-size: 1.4375rem;
	line-height: 1.2;
}

.custom-content .blockContainer > div {
	padding-bottom: 0;
}

.custom-content .blockContainer > div {
	padding-top: 10px;
}

.blockitem.backLink {
	display: none;
}

.back-link .blockitem.backLink {
	display: block;
}

.back-link a {
	color: var(--color-text-black);
	font: var(--font-bold);
}

.blockContainer h1.pageTitle,
.pageTitle h1 {
	color: var(--color-text-blue);
	font: var(--font-bold);
	font-size: 3.125rem;
	line-height: 1.1;
}

.blockContainer h1.blockTitle {
	font-size: 2rem;
	margin-bottom: 0;
	padding-bottom: 25px;
}

.search-product-grid.no-image {
	display: block;
}

.stepContent {
	padding-bottom: 45px;
}


.desktop,
.onlyDesktop {
	display: block;
}

.mobile,
.onlyMobile {
	display: none;
}

/* POPUPS */

.iz-popup {
	background-color: var(--color-white);
	bottom: 0;
	position: absolute;
	right: 0;
	z-index: 1000;
}

.iz-popup-button {
	background-color: red;
	bottom: 0;
	position: absolute;
	right: 0;
	z-index: 1000;
}

.iz-popup {
	-webkit-box-shadow: 5px 5px 30px 10px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 5px 5px 30px 10px rgba(0, 0, 0, 0.6);
	box-shadow: 5px 5px 30px 10px rgba(0, 0, 0, 0.6);
	bottom: 50px;
	display: none;
	max-width: calc(100% - 40px);
	position: fixed;
	right: 50px;
	width: 520px;
	z-index: 100000;
}

.iz-popup .popup-close {
	align-items: center;
	background-color: var(--color-white);
	border: 2px solid transparent;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	height: 44px;
	justify-content: center;
	position: absolute;
	right: 25px;
	top: 20px;
	transition: color .25s, background-color .25s, border .25s;
	width: 44px;
}

.iz-popup .popup-close:hover {
	background-color: var(--color-bg-orange);
	color:var(--color-white)
}

.iz-popup .popup-close .iz-icon {
	color: var(--color-black);
	font-size: 30px;
	transition: color .25s, background-color .25s, border .25s;
}

.iz-popup .popup-close:hover .iz-icon {
	color: var(--color-text-orange);
}

.iz-popup .popup-header {
	background-color: var(--color-bg-orange);
	color: var(--color-white);
	font-size: 2rem;
	line-height: 1.5;
	padding: 15px 30px;
}

.iz-popup .popup-title {
	width: calc(100% - 60px);
}

.iz-popup-button {
	background-color: var(--color-bg-orange);
	border: 1px solid var(--color-bg-orange);
	border-radius: 25px;
	bottom: 50px;
	color: var(--color-white);
	cursor: pointer;
	display: none;
	padding: 8px 16px;
	position: fixed;
	right: 50px;
	transition: color .25s, background-color .25s, border .25s;
	z-index: 10000;
}

.iz-popup-button:hover {
	background-color: var(--color-white);
	border: 1px solid var(--color-bg-orange);
	color: var(--color-text-orange);
}

.iz-popup .blockContainer > div {
	padding: 0;
}

.iz-popup .popup-content .blockContainer {
	padding: 30px;
}

.iz-popup .blockContainer:not(.withTitle) .blockItemType-text,
.iz-popup .blockContainer:not(.withTitle) .blockItemType-article,
.iz-popup .blockContainer:not(.withTitle) .blockItemType-form {
	padding-bottom: 0;
	padding-top: 0;
}