@charset "utf-8";
/* CSS Document */

/* mobiel menu */

@media (max-width: 767.98px) {
	.navbar {
		position: relative;
		width: 100%;
		align-items: flex-start;
		border: none;
		background-color: transparent;
		padding: 52px 12px 0;
		margin: 0;
		background-image: url('images/d.png');
		background-size: calc(100% - 24px) auto;
		background-position: center 52px;
		background-repeat: no-repeat;
		min-height: calc(42vw + 62px);
		z-index: 10;
	}
	body:not(.calm-mode) .navbar:before {
		position: absolute;
		content: "";
		display: block;
		top: 52px;
		left: -2vw;
		width: 104vw;
		height: 75px;
		rotate: -3deg;
		transform-origin: right;
		background-color: var(--thema);
		pointer-events: none;
	}
	.page-id-12 .navbar {
		min-height: calc(105vw + 52px);
	}
	.navbar > .container-fluid {
		padding: 0;
	}
	.navbar > .container-fluid {
		flex-direction: row-reverse;
	}
	#navbar {
		background-color: var(--bg);
		padding-top: 7vw;
		margin-top: -2vw;
	}
	#navbar ul.navbar-nav, ul#submenu {
		position: relative;
		width: 100%;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}
	ul#submenu {
		padding: 12px 0 0 0;
		margin-bottom: 0;
	}
	#navbar ul li, ul#submenu li {
		display: block;
		width: 100%;
	}
	#navbar ul li.wpm-languages {
		display: none;
	}
	.navbar-nav > li > a, ul#submenu li a, body > ul.wpm-language-switcher > li > * {
		position: relative;
		display: block;
		width: fit-content;
		text-decoration: none;
		text-transform: uppercase;
		font-weight: 900;
		font-size: 28px;
		line-height: 1.2;
		color: var(--tekst);
		font-family: 'Logical', sans-serif;
		padding: 0 !important;
		text-align: right;
		pointer-events: all;
	}
	.navbar-nav > li > a:hover, .navbar-nav > li > a.active, .navbar-nav > li > a.active:hover, .navbar-nav > li > a:focus, .navbar-nav > li > a.active:focus {
		color: var(--tekst) !important;
		background-color: transparent;
	}
	.navbar-nav > li > a.active:after, .parent-pageid-56 .navbar-nav > .nav-item-58 > a:after, .single-voorstelling .navbar-nav > .nav-item-58 > a:after, .parent-pageid-138 .navbar-nav > .nav-item-141 > a:after, ul#submenu li.current_page_item a:after, body.calm-mode #toggle-modus:after, #toggle-zoekbalk[aria-pressed=true]:after, .search-results #toggle-zoekbalk:after, body > ul.wpm-language-switcher > li.active > *:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 4px;
		left: 0;
		bottom: 2px;
		background-color: var(--tekst);
	}
	body > ul.wpm-language-switcher > li.wpm-item-language-nl > *:before {
		position: absolute;
		display: inline-block;
		content: "/";
		top: 0;
		right: -19px;
		pointer-events: none;
	}
	
	/* specifiek voor mobiel */
	.navbar-toggler {
		position: relative;
		display: inline-block;
		margin: 10px 1px 10px 0;
		padding: 0;
		border: none;
		background-color: transparent !important;
		pointer-events: all;
	}

	.navbar-toggler:hover, .navbar-toggler:focus {
		background-color: transparent !important;
		outline: none;
		box-shadow: none;
	}

	.navbar-toggler .navbar-toggler-icon {
		width: 60px;
		height: 60px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='butt' stroke-linejoin='arcs'%3E%3Cline x1='3' y1='12' x2='21' y2='12'%3E%3C/line%3E%3Cline x1='3' y1='6' x2='21' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='18' x2='21' y2='18'%3E%3C/line%3E%3C/svg%3E");
	}

	.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='butt' stroke-linejoin='arcs'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
	}

	body.calm-mode #toggle-modus:after, #toggle-zoekbalk[aria-pressed=true]:after, .search-results #toggle-zoekbalk:after, body > ul.wpm-language-switcher > li.active > *:after {
		height: 4px;
		bottom: -10px;
	}
	body.calm-mode #toggle-modus:after {
		bottom: -6px;
	}
	body > ul.wpm-language-switcher > li.active > *:after {
		bottom: 0;
	}
	#toggle-modus, #toggle-zoekbalk, body > ul.wpm-language-switcher {
		position: absolute;
		top: 12px;
		right: 195px;
		background: none;
		border: none;
		cursor: pointer;
		z-index: 10;
	}
	#toggle-zoekbalk {
		right: 146px;
	}
	body > ul.wpm-language-switcher {
		right: 20px;
		display: flex;
		gap: 25px;
	}
	#toggle-modus img {
		height: 30px;
		width: auto;
	}
	#toggle-zoekbalk img {
		height: 40px;
		width: auto;
	}
	.custom-tooltip {
		display: none;
	}

	/* zoekveld */
	.search-form-container {
		position: absolute;
		width: calc(100vw - 24px);
		height: 0;
		top: calc(112px + 10vw);
		left: 12px;
		transition: all 0.35s ease-in-out;
		z-index: 10;
		overflow: hidden;
	}
	.search-form-container.active {
		height: 70px;
	}
	.search-form-container input[type="search"] {
		width: calc(100vw - 24px);
		height: 70px;
		font-weight: bold;
		color: var(--tekst);
		background-color: var(--bg);
		padding: 12px 12px 12px 70px;
		border: none;
		margin: 0;
		box-shadow: 0 0 0 6px var(--tekst) inset;
		border-radius: 0;
		background-image: url('images/zoek.png');
		background-repeat: no-repeat;
		background-size: 40px auto;
		background-position: 20px center;
	}
	.search-form-container input[type="submit"] {
		display: none; /* verberg standaard knop */
	}
}

/* groot menu */

@media (min-width: 768px) {
	body > ul.wpm-language-switcher {
		display: none;
	}
	.navbar {
		position: relative;
		width: 100%;
		align-items: flex-start;
		border: none;
		background-color: transparent;
		padding: 30px 30px 0;
		margin: 0;
		background-image: url('images/d.png');
		background-size: 80% auto;
		background-position: 10vw 30px;
		background-repeat: no-repeat;
		min-height: calc(36vw + 30px);
		z-index: 10;
	}
	.page-id-12 .navbar {
		height: calc(54vw + 30px);
	}
	.search .navbar {
		min-height: calc(22vw + 160px);
	}
	.navbar > .container-fluid {
		padding: 0;
	}
	#navbar {
		padding: 0;
	}
	#navbar ul.navbar-nav, ul#submenu {
		width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
	}
	ul#submenu {
		padding: 40px 0 0 0;
		margin-bottom: 0;
	}
	#navbar ul li, ul#submenu li {
		position: relative;
		display: block;
	}
	#navbar ul li.wpm-languages {
		position: absolute;
		top: 30px;
		right: 30px;
	}
	#navbar ul li.wpm-languages.nav-item-language-nl {
		right: calc(30px + 6vw);
	}
	#navbar ul li.wpm-languages.nav-item-language-nl a:before {
		position: absolute;
		display: inline-block;
		content: "/";
		top: 0;
		right: -1.5vw;
		pointer-events: none;
	}
	.navbar-nav > li > a, ul#submenu li a {
		text-decoration: none;
		text-transform: uppercase;
		font-weight: 900;
		font-size: 2.5vw;
		line-height: 1.2;
		color: var(--tekst) !important;
		font-family: 'Logical', sans-serif;
		background-color: transparent;
		padding: 0 !important;
		-webkit-border-radius: 0px;
		border-radius: 0px;
	}
	.navbar-nav > li > a:hover, .navbar-nav > li > a.active, .navbar-nav > li > a.active:hover, .navbar-nav > li > a:focus, .navbar-nav > li > a.active:focus {
		color: var(--tekst) !important;
		background-color: transparent;
	}
	.navbar-nav > li > a:hover:after, .navbar-nav > li > a.active:after, .parent-pageid-56 .navbar-nav > .nav-item-58 > a:after, .single-voorstelling .navbar-nav > .nav-item-58 > a:after, .parent-pageid-138 .navbar-nav > .nav-item-141 > a:after, ul#submenu li a:hover:after, ul#submenu li.current_page_item a:after, #toggle-modus:hover:after, body.calm-mode #toggle-modus:after, #toggle-zoekbalk:hover:after, #toggle-zoekbalk[aria-pressed=true]:after, .search-results #toggle-zoekbalk:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 0.3vw;
		left: 0;
		bottom: 0.15vw;
		background-color: var(--tekst);
	}
	#toggle-modus:hover:after, body.calm-mode #toggle-modus:after {
		height: 0.4vw;
		bottom: -1.9vw;
	}
	#toggle-zoekbalk:hover:after, #toggle-zoekbalk[aria-pressed=true]:after, .search-results #toggle-zoekbalk:after {
		height: 0.4vw;
		bottom: -0.9vw;
	}
	#toggle-modus, #toggle-zoekbalk {
		position: absolute;
		top: calc(30px + 0.5vw);
		right: calc(30px + 12.9vw);
		background: none;
		border: none;
		cursor: pointer;
		z-index: 10;
	}
	#toggle-zoekbalk {
		right: calc(30px + 9.5vw);
	}
	#toggle-modus img {
		height: 3vw;
		width: auto;
	}
	#toggle-zoekbalk img {
		height: 4vw;
		width: auto;
	}
	.custom-tooltip {
		--bs-tooltip-bg: var(--tekst);
		--bs-tooltip-color: var(--bg);
		--bs-tooltip-border-radius: 0;
		--bs-tooltip-opacity: 1;
		font-family: 'Asap', sans-serif;
		font-size: 24px;
	}

	/* zoekveld */
	.search-form-container {
		position: absolute;
		width: 45vw;
		height: 0;
		top: calc(30px + 6vw);
		right: 30px;
		transition: all 0.35s ease-in-out;
		z-index: 10;
		overflow: hidden;
	}
	.search-form-container.active {
		height: 115px;
	}
	.search .search-form-container {
		top: calc(30px + 22vw);
	}
	.search-form-container input[type="search"] {
		width: 45vw;
		height: 115px;
		font-weight: bold;
		color: var(--tekst);
		background-color: var(--bg);
		padding: 12px 12px 44px 109px;
		border: none;
		margin: 0;
		box-shadow: 0 0 0 6px var(--tekst) inset;
		border-radius: 0;
		background-image: url('images/zoek.png');
		background-repeat: no-repeat;
		background-size: 65px auto;
		background-position: 30px center;
	}
	.search .search-form-container, .search .search-form-container input[type="search"] {
		width: calc(100vw - 60px);
		height: 130px;
	}
	.search-form-container input[type="submit"] {
		display: none; /* verberg standaard knop */
	}
}