/*
Theme Name: Anoiksis
Theme URI: https://anoiksis.nl/
Description: The theme for anoiksis.nl.
Author: Het Anoiksis Team
Version: 2.16
License: GPLv2 or later
Tags: fixed-width, threaded-comments, Dutch, rtl-language-support, editor-style, mobile, widescreen, html5
*/


/*
Globale indeling
-------------------------------------------------------------------
1.  CSS reset (afblijven)
2.  Fonts
3.  Globale elementen
4.  Layout met container en 2 kolommen
5.  Header en Topmenu
6.  Sidebars en Widgets
7.  Voorpagina
8.  Vervolgpagina's
9.  Categorie / Taxonomie / Nieuwspagina
10. Single bericht
11. Content
12. Images, Nextgen Gallery, WordPress Galleries
13. Post Formats
14. Navigatie
15. Reacties Weergave
16. Reacties Formulier
17. Footer
18. Print Style
19. Tablet and big smartphone media query
20. Small smartphone media query
21. Widescreen media query
--------------------------------------------------------------------

Kleuren
  #e8f2e9  lichtgroen  rgba(232, 242, 233, 1)
  #d9d1e0  lichtpaars
  #d4daea  grijsblauw  rgba(212, 218, 234, 1)

  #9b83a7 lichtroze (tekst input smalle blokken voorpagina)
  #7b6387 lichtroze (tekst input smalle blokken voorpagina) donkerder voor contrast. rgba( 123, 99, 135, 1 );

  #58bb5d form borders

  #219021 illustraties groen
*/


/*
1. CSS reset
https://github.com/richclark/HTML5resetCSS
======>> Afblijven, dit is puur voor de CSS reset!!
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display:block;
}

nav ul {
	list-style:none;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}

a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

/* change colours to suit your needs */
ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}

/* change colours to suit your needs */
mark {
	background-color:#ff9;
	color:#000;
	font-style:italic;
	font-weight:bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted;
	cursor:help;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse:collapse;
	border-spacing:0;
}

/* change border colour to suit your needs */
hr {
	display:block;
	height:1px;
	border:0;
	border-top:1px solid #cccccc;
	margin:1em 0;
	padding:0;
}

input, select {
	vertical-align:middle;
}

a img {
	border: none;
}

/* Einde CSS reset. Edit vanaf hier
-------------------------------------------------------------- */


/* 2. Fonts
-------------------------------------------------------------- */

@font-face {
	font-family: 'Encode-Sans-Expanded-Regular';
	src:url('fonts/Encode-Sans-Expanded-Regular.ttf.woff') format('woff'),
		url('fonts/Encode-Sans-Expanded-Regular.ttf.svg#Encode-Sans-Expanded-Regular') format('svg'),
		url('fonts/Encode-Sans-Expanded-Regular.ttf.eot'),
		url('fonts/Encode-Sans-Expanded-Regular.ttf.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}

body {
	font-family: 'Encode-Sans-Expanded-Regular', sans-serif;
}

pre {
	font-family: "Courier 10 Pitch", Courier, monospace;
}
code {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

/* 3. Globale Elementen
-------------------------------------------------------------- */

/* Main global 'theme' and typographic styles */

/*
 * Use fontsize in px only for design elements, like text over an image.
 * Use em, rem and % for content elements for accessibility.
 */

html {
	width: 100%;
	background-color: #fff;
	font-size: 1rem;
	line-height: 1.5em;
	text-rendering: optimizelegibility;
}
html { /* niet op body, breekt op mobiel */
	background-image: url('illustraties/achtergrond_patroon-2000x3080.jpg'); /* 300 KB */
	background-size: 500px 770px; /* blijkbaar 1/4e van de afbeelding? */
	background-repeat: repeat-item;
	background-position: top center;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: bold;
	line-height: 1.2em;
	margin: 20px 0 10px 0;
}
h1 {
	font-size: 124%;
	line-height: 1.2em;
}
h2 {
	font-size: 118%;
	line-height: 1.2em;
}
hr {
	background-color: #fff;
	border: 0;
	height: 1px;
	margin-bottom: 18px;
}

/* Text elements */
p {
	margin-bottom: 10px;
}
ul {
	list-style: disc;
	margin: 0 0 18px 1.5em;
}
ol {
	list-style: decimal;
	margin: 0 0 18px 1.5em;
}
ul ul,
ol ol,
ul ol,
ol ul {
	margin-bottom: 0;
}
dl {
	margin: 0 0 24px 0;
}
dt {
	font-weight: bold;
}
dd {
	margin-bottom: 18px;
}
strong {
	font-weight: bold;
}
cite,
em,
i {
	font-style: italic;
}
small {
	font-size: 64%;
}
big {
	font-size: 131.25%;
}
ins {
	background: #ffc;
	text-decoration: none;
}
blockquote {
	font-style: italic;
	padding: 0 3em;
}
blockquote cite,
blockquote em,
blockquote i {
	font-style: normal;
}
pre {
	background: #f7f7f7;
	line-height: 18px;
	margin-bottom: 18px;
	padding: 1.5em;
}
sup,
sub {
	height: 0;
	line-height: 1;
	position: relative;
	vertical-align: baseline;
}
sup {
	bottom: 1ex;
}
sub {
	top: .5ex;
}
.clear {
	clear: both;
}
a:link,
a:visited {
	color: #444;
	font-weight: 600;
	text-decoration: none;
}
a:active,
a:focus,
a:hover {
	color: #000;
	text-decoration: underline;
}

/* Reset non-text input types */
input[type="checkbox"],
input[type="radio"],
input[type="file"],
input[type="hidden"],
input[type="image"],
input[type="week"],
input[type="month"],
input[type="number"],
input[type="tag"],
input[type="range"],
input[type="search"],
input[type="email"],
input[type="tel"],
input[type="time"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="url"],
input[type="password"],
input[type="color"] {
	border: 0;
	border-radius: 0;
	padding: 0;
}

/* text, html5 inputs en textarea */
input[type="text"],
input[type="file"],
input[type="hidden"],
input[type="image"],
input[type="week"],
input[type="month"],
input[type="number"],
input[type="tag"],
input[type="range"],
input[type="search"],
input[type="email"],
input[type="tel"],
input[type="time"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="url"],
input[type="password"],
input[type="color"],
textarea {
	color: #111;
	background: #9b83a7;
	border: 1px solid #9b83a7;
	border-radius: 5px;
	box-shadow: none;
	padding: 5px 10px;
	max-width: 100%;
	line-height: 2rem;
	font-size: 1rem;
}

/* Buttons */
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	height: 2.8rem;
	padding: 10px;
	font-size: 1.4rem;
	line-height: 1.8rem;
	font-weight: normal;
	text-align: center;
	color: #000;
	background-color: #d4daea;
	border: 0px transparent;
	border-radius: 10px;
}
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	cursor: pointer;
}
button[disabled],
input[disabled] {
    cursor: default;
}
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover {
	background-color: #d9d1e0;
	border: 0px transparent;

}
button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
	background-color: #d4daea;
	border: 0px transparent;

}

select {
	background: #f9f9f9;
	padding: 5px;
	line-height: 1.3;
	border: 1px solid #ccc;
	border-radius: 3px;
	/* -webkit-appearance: none; */
	box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
}

/* Text meant only for screen readers */
.screen-reader-text {
	position: absolute;
	left: -9000px;
}


/* 4. Layout met 2 kolommen
--------------------------------------------------------- */

#wrapper {
	margin: 0 auto;
	width: 100%;
	max-width: 960px;
	position: relative;
}
#container {
	margin: 0;
	clear: both;
}
#content {
	/* float: left; not sure... */
	margin: 0;
	max-width: 960px;
	width: 960px;
}
#primary,
#secondary {
	float: right;
	overflow: hidden;
	max-width: 200px;
}
#secondary {
	clear: right;
}
#footer {
	clear: both;
	width: 100%;
}


/* 5. Header
-------------------------------------------------------------- */

#header {
	min-height: 200px;
	padding: 0;
	background-image: url('images/logo-achtergrond.png');
	background-position: -372px -227px;
	background-repeat: no-repeat;
}
#logo {
	width: 144px;
	height: 84px;
}
#logo a {
	display: block;
	width: 190px;
	height: 136px;
}
#logo img {
	margin-top: 20px;
	width: 144px;
	height: 84px;
}

#sublogo {
	position: absolute;
	top: 85px;
	left: 233px;
	width: 362px;
	height: 49px;
}
#sublogo a {
	width: 100%;
	height: 100%;
	text-decoration: none;
}
#sublogo span {
	font-size: 1.5rem;
}
#sublogo-span1 {
	color: #333;

}
#sublogo-span2 {
	color: #c9c1d0;
	text-align: right;
	width: 100%;
	display: inline-block;
	font-weight: 700;
}

/* TopMenu
-------------------------------------------------------------- */

#access {
	display: block;
	margin: 0 auto;
	max-width: 960px;
}
#access .menu {
	font-size: 1em;
	font-size: 1rem;
}
#access .menu ul {
	list-style: none;
	margin: 0;
}
#access .menu li {
	float: left;
	position: relative;
}
#access a {
	display: block;
	line-height: 38px;
	padding: 0 10px;
}
/* Huidige pagina of parent. Ook de hover */
#access ul li.current_page_item > a,
#access ul li.current-menu-ancestor > a,
#access ul li.current-menu-item > a,
#access ul li.current-menu-parent > a,
#access a.hover,
#access a:hover,
#access a:active {
	color: #000;
}
#access ul ul {
	box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
	position: absolute;
	top: 38px;
	left: 0;
	float: left;
	width: 180px;
	z-index: 99999;
	opacity: 0;
	visibility: hidden;
	position: absolute; /* or relative depending on layout */
}
#access ul ul li {
	min-width: 180px;
}
#access ul ul ul {
	left: 100%;
	top: 0;
}
#access ul ul a {
	line-height: 1em;
	padding: 10px;
	width: 160px;
	height: auto;
}

/* de li.hover werkt op een touchscreen, waar geen hover is. */
#access ul li:hover > ul,
#access ul li.hover > ul {
	opacity: 1;
	transition: opacity 0.5s ease;
	visibility: visible;
}


@media screen and (max-width: 600px) {
	.menu-toggle,
	.main-navigation.toggled .nav-menu {
		display: block;
	}

	.main-navigation ul {
		display: none;
	}
}


/* Topmenu rechts boven */
#topmenu-container {
	position: absolute;
	top: 30px;
	right: 0px;
	width: 325px;
	height: 20px;
}
#topmenu-container ul {
	list-style: none;
	margin: 0;
}
#topmenu-container ul li {
	list-style: none;
	padding: 0 10px;
	float: left;
}


/* Zoeken toggle */
button#zoekbutton {
	position: absolute;
	top: 80px;
	right: 75px;
	background-image: url('images/zoek-icoon.png');
	background-repeat: no-repeat;
	background-color: transparent;
	background-size: 46px 46px;
	width: 46px;
	height: 46px;
	padding: 28px 0 0 0;
	margin: 0;
	text-align: center;
	font-size: 1rem;
	border: 0px;
	border-radius: 0px;
	box-shadow: none;
}
#header div.search-form-container { /* overschrijven van het gewone formulier */
	position: static;
	top: 0;
	left: 0;
}
#header div#header-search-form-container {
	position: absolute;
	top: 12px;
	left: 647px;
	width: 300px;
	height: auto;
	visibility: hidden;
	opacity: 0;
}
#header div#header-search-form-container.toggled {
	visibility: visible;
	opacity: 1;
	transition: opacity 0.5s ease;
}
#header form.search-form {
	height: auto;
}

/* Hamburger Menu */
button.menu-toggle {
	position: absolute;
	top: 80px;
	right: 5px;
	background-image: url('images/hamburgermenu.png');
	background-repeat: no-repeat;
	background-color: #fff;
	background-size: 46px 46px;
	width: 46px;
	height: 46px;
	padding: 28px 0 0 0;
	margin: 0;
	text-align: center;
	font-size: 1rem;
	border: 0px;
	border-radius: 0px;
	box-shadow: none;
}
#hamburgermenu-container {
	position: absolute;
	visibility: hidden;
	opacity: 0;
	top: 150px;
	right: -10px;
	padding: 10px;
	border: 5px solid rgba(255, 255, 255, 0); /* 0 is transparent border, na toggle wordt hij #e8f2e9. */
	border-radius: 3px;
	z-index: 11;
}
.hamburger ul {
	min-height: 120px;
	padding: 10px 0 0 0;
	margin: 0;
	list-style: none;
	background-color: #fff;
}
#hamburgermenu-container {
	background-color: #fff;
	border: 5px solid #e8f2e9;
	border-radius: 5px;
}
#hamburgermenu-container.toggled {
	visibility: visible;
	opacity: 1;
	transition: opacity 0.5s ease;
}
.hamburger ul ul {
	padding: 0 0 0 20px;
}
.hamburger ul li {
	margin: 4px 0;
}



/* 6. Sidebars en Widgets
-------------------------------------------------------------- */
#primary {
}
#secondary {
}
.widget_nav_menu {
	text-decoration: none;
}
.widget_nav_menu ul {
	text-align: left;
	list-style:	none;
}
.widget_nav_menu li {
	margin: 0 0 0 10px;
}

/* Het submenu is wel of niet zichtbaar */
.widget_nav_menu ul.menu ul.sub-menu {
	font-weight: normal;
	margin: 0 0 5px 0;
	padding-left: 10px;
	display: none;
}
.widget_nav_menu ul.menu li.current_page_parent ul.sub-menu,
.widget_nav_menu ul.menu li.current_page_item ul.sub-menu,
.widget_nav_menu ul.menu li:hover ul.sub-menu,
.widget_nav_menu ul.menu li:active ul.sub-menu {
	display: block;
}

.widget_nav_menu a {
	color: blue;
	font-weight: normal;
	display: block;
}
/* Huidige pagina of parent. Ook de hover */
.widget_nav_menu ul li.current_page_item > a,
.widget_nav_menu ul li.current-menu-item > a,
.widget_nav_menu a:hover,
.widget_nav_menu a:active {
	color: purple;
}
.widget_nav_menu .current-menu-item a,
.widget_nav_menu .sub-menu .current-menu-item a {
	color: purple;
}
.widget_nav_menu .current-menu-item .sub-menu a {
	color: blue;
}
.widget_nav_menu .current-menu-item .sub-menu a:hover {
	color: purple;
}
.widget_nav_menu .current-menu-item a:hover,
.widget_nav_menu .sub-menu .current-menu-item a:hover {
	color: blue;
	font-weight: none;
}
.widget_nav_menu .sub-menu .current-menu-item a {
	color: purple;
}

/* Make sure select elements fit in widgets. */
.widget select {
	max-width: 100%;
}


/* 7.  Voorpagina
-------------------------------------------------------------- */

#kolom-menus {
	position: relative;
	clear: both;
	margin-top: -24px; /* line-height wordt meegenomen, dit is bedoeld om dat op te heffen. */
}

.kolom,
#kolom-menus ul.slides > li {
	width: 320px;
	min-height: 322px;
	float: left;
	padding: 0;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: 310px;
	list-style: none;
}

#kolom-1 {
	background-image: url('images/kolom-1.png');
}
#kolom-2 {
	background-image: url('images/kolom-2.png');
}
#kolom-3 {
	background-image: url('images/kolom-3.png');
}

.kolom h2 {
	padding: 0;
	margin-left: 0;

}

.kolom ul {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

.kolom ul li {
	margin: 4px 0;
}
/* Kopjes van menu */
.kolom ul.menu > li > a {
	color: #000;
	font-weight: 600;
	padding-left: 36px;
}
.kolom ul.sub-menu {
	padding-left: 0;
}
.kolom ul.menu li a {
	font-size: 0.85rem;
}
.kolom ul.sub-menu li:nth-child(1) a {
	padding-left: 16px;
}
.kolom ul.sub-menu li:nth-child(2) a {
	padding-left: 6px;
}
.kolom ul.sub-menu li:nth-child(3) a {
	padding-left: 0px;
}
.kolom ul.sub-menu li:nth-child(4) a {
	padding-left: 0px;
	margin-left: -2px;
}
.kolom ul.sub-menu li:nth-child(5) a {
	padding-left: 0px;
}
.kolom ul.sub-menu li:nth-child(6) a {
	padding-left: 4px;
}
.kolom ul.sub-menu li:nth-child(7) a {
	padding-left: 9px;
}
.kolom ul.sub-menu li:nth-child(8) a {
	padding-left: 16px;
}
.kolom ul.sub-menu li:nth-child(9) a {
	padding-left: 31px;
}

.kolom-1,
.kolom-2,
.kolom-3 {
	padding: 20px 20px 8px 20px;
}

/* Slider op mobiel, minder dan 960px breedte. */
.anoiksis-active-slider {
	min-height: 400px;
}
div.custom-navigation {
	display: none;
}

.custom-controls-container {
	position: absolute;
	bottom: 63px;
	left: 50px;
	width: 100px;
}
a.flex-prev {
	display: none; /* wordt niet gebruikt, er zijn er maar 3. */
	position: absolute;
	bottom: 30px;
	left: 50px;
	font-weight: 1000;
	font-size: 1.6rem;
	text-decoration: none;
	padding: 0 10px;
	z-index: 10;
	color: #6e9fa5;
}
a.flex-next {
	position: absolute;
	bottom: 30px;
	right: 50px;
	font-weight: 1000;
	font-size: 1.6rem;
	text-decoration: none;
	padding: 0 10px;
	z-index: 10;
	color: #6e9fa5;
}
/* Custom paging van de after callback */
div.custom-controls-paging {
	position: absolute;
	bottom: 30px;
	right: 85px;
	color: #6e9fa5;
	font-weight: 800;
	font-size: 16px;
}

body .flex-control-paging li a {
	width: 20px;
	height: 15px;
	border-radius: 3px;
	background-color: #6e9fa5;
}
body .flex-control-paging li a.flex-active {
	background-color: #365154;
}



.home #content {
	width: 960px;
	max-width: 960px;
}

/* Smalle roze blokken */
.blok-smal {
	position: relative; /* nodig voor z-index */
	color: #7b6387; /* origineel: #9b83a7; donkerder voor contrast. */
	background-color: #fdf6f0;
	width: 820px;
	padding: 0 50px 0 50px;
	margin: -20px auto -20px auto; /* -20px voor overlappen van groene .blok-breed */
	min-height: 260px;
	z-index: 2;
	border-radius: 5px;
}


.blok-smal h2.template,
.blok-smal h3.template {
	padding: 50px 0 0 0;
	margin: 0;
	color: #7b6387; /* origineel: #9b83a7; donkerder voor contrast */
	font-size: 1.4rem;
	font-weight: 400;
}
.blok-smal p {
	text-align: center;
	padding: 20px 0 0 0;
	width: 840px;
	color: #000;
	font-size: 1.4rem;
}

.blok-smal a.button {
	display: block;
	height: 2.8rem;
	padding: 10px;
	font-size: 1.4rem;
	line-height: 2.5rem;
	font-weight: normal;
	text-align: center;
	color: #000;
	background-color: #d4daea;
	border: 1px solid #d4daea;
	border-radius: 10px;
}

#blok-1 div.heading {
	float: right;
	width: 430px;
	padding-right: 30px;
	margin-top: 30px;
}
#blok-1 h3 {
	text-align: center;
	font-style: italic;
	font-size: 1.2rem;
	line-height: 1.4em;
	font-weight: 400;
}
#blok-1 a {
	display: block;
	margin: 30px 100px 0 0;
	text-align: right;
	color: #7b6387;
	font-style: italic;
	font-weight: 400;
}

#blok-3 h3 {
	font-weight: 400;
	padding-top: 100px; /* standaard 50px */
}

#blok-3 p {
	width: 400px;
	float: left;
}

#blok-3 a.button {
	position: absolute;
	top: 120px;
	right: 90px;
	width: 18rem;
	background-color: #d9d0e0;
	color: #73508a;
	z-index: 1;
}

#blok-5 h2,
#blok-5 h3,
#blok-voorlichting h2,
#blok-voorlichting h3 {
	text-align: center;
	font-weight: 400;
}
div.buttons {
	padding: 30px 0 30px 0;
	display: grid;
	grid-template-columns: auto auto auto;
}
#blok-5 a,
#blok-voorlichting a {
	display: inline-block;
	width: 12rem;
	height: 2.1rem;
	margin-left: 30px;
	font-size: 1.2rem;
	line-height: 2.0rem;
	background-color: #b5a3c5;
	color: #faf1ff;
	border: 0px transparent;
}

#blok-7 {
	min-height: 290px;
}
#blok-7 div#faq {
	padding: 60px 0 0 100px;
	width: 670px;
}
#blok-7 a {
	border-radius: 25px;
	height: 1.6rem;
	font-size: 1.2rem;
	line-height: 1.6rem;
	margin-bottom: 10px;
	background-color: #d9d0e0;
	color: #73508a;
}

#blok-9 {

}
#blok-9 h2.template,
#blok-9 h3.template {
	padding-bottom: 20px;
}
#blok-9 p {
	padding: 10px 0 0 0;
	text-align: left;
}
#blok-9 a {
	display: inline-block;
	margin: 0 0 0 0;
}
#blok-9 a img {
	height: 100px;
}
#blok-9 a.button {
	display: inline-block;
	float: right;
	width: 18rem;
	font-size: 1.2rem;
	line-height: 1.8rem;
	height: 1.8rem;
	margin-top: 24px;
	background-color: #a08ab9;
	color: #fbf2ff;
}

/* Zoeken */
#blok-11 {

}
div.search-form-container {
	position: absolute;
	top: 100px;
	left: 310px; /* in het midden */
	width: 300px;
}
form.search-form {
	position: relative;
	width: 100%;
	height: 260px;
	margin:0 auto;
}
form.search-form input[type="search"] {
	width: 100%;
	height: 60px;
	border: 2px solid #a690b2;
	font-size: 1.4rem;
	line-height: 2rem;
	font-weight: bold;
	background-color: #f7f5f1;
	box-shadow: none;
	border-radius: 10px;
}
form.search-form input[type="submit"] {
	position: absolute;
	top: 15px;
	right: 60px;
	background-color: transparent;
	background-image: url('images/search-button.png');
	border-width: 0px;
	box-shadow: none;
	border-radius: 0px;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	content: '';
}
form.search-form button.search-clear {
	position: absolute;
	top: 15px;
	right: 15px;
	background-color: transparent;
	background-image: url('images/search-clear.png');
	border-width: 0px;
	box-shadow: none;
	border-radius: 0px;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	content: '';
}

#blok-99 h3.template {
	padding: 30px 0 0 0;
}


/* Brede groene blokken */
.blok-breed {
	color: #000;
	background-color: #e8f2e9;
	width: 860px;
	margin: 0 auto 0 auto;
	padding: 70px 50px 70px 50px;
	border-radius: 10px;
}
.blok-breed h2.template,
.blok-breed h3.template {
	text-align: center;
	margin: 0 0 20px 0;
	font-weight: 400;
}
.blok-breed p {
	width: 500px;
	margin: 0 auto 0 auto;
	text-align: center;
}
.blok-breed a.button {
	padding: 10px;
	font-size: 1.4rem;
	line-height: 1.8rem;
	font-weight: normal;
	text-align: center;
	color: #000;
	background-color: #d4daea;
	border: 1px solid #d4daea;
	border-radius: 10px;
}
.blok-breed p.button {
	padding-top: 10px;
}

#blok-2 p {
	text-align: left;
	color: #30194f;
	width: 100%;
}

#blok-nieuws {
	padding: 50px; /* Standaard is 70px 50px 70px 50px */
}
#blok-nieuws h3 {
	background-color: #dbe9dc;
	border-radius: 10px;
	color: #094e06;
	font-weight: 400;
	padding: 10px 0 10px 0;
	max-width: 400px;
	margin: auto;
}
#blok-nieuws h3 span.nagel-1 {
	width: 30px;
	font-size: 19px;
	text-align: center;
	color: #444444;
	padding: 0 50px 0 0;
}
#blok-nieuws h3 span.nagel-2 {
	width: 30px;
	font-size: 19px;
	text-align: center;
	color: #444444;
	padding: 0 0 0 50px;
}
#blok-nieuws h3 a {
	color: #094e06;
	font-weight: 400;
	font-size: 1.2rem;
}
#blok-nieuws div.nieuwsberichten {
	margin: 30px 0 0 0;
	color: #30194f;
}
#blok-nieuws div.nieuwsbericht {
	background-color: #dbe9dc;
	padding: 20px;
	border-radius: 10px;
	float: left;
	width: 213px;
	height: 220px;
	overflow: hidden;
}
#blok-nieuws div.nieuwsbericht:nth-child(1),
#blok-nieuws div.nieuwsbericht:nth-child(2) {
	margin-right: 50px;
}
#blok-nieuws div.nieuwsbericht h4 {
	margin: 0 0 10px 0;
}
#blok-nieuws div.nieuwsbericht h4 a {
	font-weight: 400;
	font-size: 1rem;
}
#blok-nieuws div.nieuwsbericht p {
	display: block;
	margin: 0;
	font-weight: 400;
	font-size: 0.95rem;
	line-height: 1.2rem;
	width: auto;
	text-align: left;
}
#blok-nieuws div.nieuwsbericht p:nth-last-child(1) {
	margin-top: 10px;
}
#blok-nieuws div.nieuwsbericht a {
	color: #30194f;
	font-weight: 400;
}


#blok-4 .blok-4-inner {
	margin-left: 420px;
}
#blok-4 h2,
#blok-4 h3 {
	margin-top: 0;
	text-align: left;
	color: #094e06;
	font-size: 1.2rem;
}
#blok-4 p {
	text-align: left;
	color: #094e06;
	width: auto;
	margin-bottom: 20px;
	font-size: 1.0rem;
}
#blok-4 a {
	color: #094e06;
	font-weight: 400;
	font-size: 1.0rem;
}

#blok-6 h3,
#blok-6 p,
#blok-6 a {
	color: #73508a;
	font-weight: 400;
	text-align: left;
}
#blok-6 .blok-6-left {
	width: 300px;
	margin-left: 30px;
}
#blok-6 h3 {
	font-size: 1.4rem;
}
#blok-6 p {
	font-size: 1.2rem;
	line-height: 1.4rem;
}
#blok-6 .blok-6-left p.button {
	margin-top: 35px;
}
#blok-6 .blok-6-left a.button {
	background-color: #d9d0e0;
	color: #73508a;
}

#blok-8 {
	min-height: 95px; /* let op padding */
	background-image: url('illustraties/anoiksis-toetsenbord-paars-437x300.png');
	background-size: 219px 150px;
	background-position: 60px 40px;
	background-repeat: no-repeat;
}
#blok-8-right {

}
#blok-8 h3 {
	color: #30194f;
	font-weight: 400;
}
#blok-8 a.button {
	background-color: #89b48d;
	color: #fbfffc;
	padding: 10px 20px;
	border: 0px transparent;
}

/* Nieuwsbrief inschrijven */
/* Nieuwsbrief blok-10 (WPForms ID 16193) */
#blok-10 {
	height: 300px;
	position: relative;
	background-color: transparent;
	background-image: url('images/nieuwsbrief-achtergrond.png');
	background-position: center -110px;
	background-repeat: no-repeat;
	background-size: 870px 590px;
}
#blok-10 .blok-10-inner {
	width: 570px;
	padding-left: 30px; /* totaal 600px */
	height: 320px;
	margin: 0 auto;
	position: relative;
	background-image: url('images/nieuwsbrief-achtergrond-lijn.png');
	background-position: 55px 0;
	background-repeat: no-repeat;
	background-size: 503px 321px;

}
#blok-10 p.blok-10-first-p {
	font-weight: 800;
	padding: 85px 0 20px 0;
}


/* 1. Verwijder spookvelden die de layout breken */
#wpforms-16193-field_1-container,
#blok-10 .wpforms-field-label {
    display: none !important;
}

/* 2. Centreer de container op de achtergrondafbeelding */
#blok-10 .wpforms-container {
    width: fit-content !important;
    width: -moz-fit-content !important;
    margin: 0 auto !important;
    text-align: left !important;
}

/* 3. Invoerveld uitlijnen op 50px */
#wpforms-16193-field_3 { /* naam */
    background-color: #fdf6f0 !important;
    border: 1px solid #fdf6f0 !important;
    width: 220px !important;
    height: 40px !important;
    margin: 5px 0 5px 137px !important;
    display: block !important;
	box-shadow: none;
}
#wpforms-16193-field_2 { /* email */
    background-color: #fdf6f0 !important;
    border: 1px solid #fdf6f0 !important;
    width: 220px !important;
    height: 40px !important;
    margin: 5px 0 5px 137px !important;
    display: block !important;
	box-shadow: none;
}

#wpforms-16193-field_3:focus,
#wpforms-16193-field_2:focus {
	border-color: #58bb5d !important;
	box-shadow: #58bb5d 0px 0px 0px 1px;
}

/* 4. Verzendknop strak onder het invoerveld (ook 50px) */
#blok-10 .wpforms-submit-container {
    margin: 10px 0 5px 50px !important;
    padding: 0 !important;
    display: block !important;
}

#blok-10 button.wpforms-submit {
    background-color: #d4daea !important;
    color: #000 !important;
    border: none !important;
    margin: 5px 0 5px 137px;
	padding: 8px 25px !important;
    height: 40px !important;
    cursor: pointer;
}
#blok-10 .wpforms-container .wpforms-field {
	padding: 0;
}

/* Herstel de dev-achtergrond door WPForms transparant te maken */
#blok-10 .wpforms-container,
#blok-10 .wpforms-form,
#blok-10 .wpforms-container-full {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Zorg dat de paragraaf (de tekst boven het veld) de juiste styling behoudt */
#blok-10 p {
    position: relative;
    z-index: 2;
}
/* blok-10 is op de voorpagina met nieuwsbrief */
#blok-10 .wpforms-recaptcha-container {
	position: absolute;
	right: -240px;
	bottom: -30px; /* hoogte div is 80px, padding container is 50px */
}
/* post-96 is de contactpagina met master formulier */
#post-96 .wpforms-recaptcha-container {
	position: absolute;
	bottom: 302px; /* binnen blok-smal */
	z-index: 4;
}
#blok-10 div.wpforms-container-full .wpforms-confirmation-container-full,
#blok-10 div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
	background: #e8f2e9;
	border: 1px solid #d4daea;
	border-radius: 10px;
}

/* Alle buttons van WPforms */
html body button.wpforms-submit {
	background-color: #d4daea !important;
	color: #000 !important;
	border: none;
}


/* 7.1  Illustraties
 * Kleur: #73508a
-------------------------------------------------------------- */

div#holding_hands {
	position: absolute;
	top: -77px;
	left: 695px;
	width: 143px;
	height: 114px;
	background-image: url('kopvoeters/holding-hands.png');
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 3;
}

div#sterren_cirkel {
	float: left;
	width: 220px;
	height: 250px;
	background-image: url('kopvoeters/sterren-cirkel-440x465.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 20px;
}

#blok-3 div.slice-7 {
	position: absolute;
	top: 41px;
	right: 68px;
	width: 74px;
	height: 140px;
	background-image: url('kopvoeters/slice-7.png');
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 2;
}

#blok-4 {
	background-image: url('illustraties/stralend-hart-885x632.png');
	background-position: left;
	background-size: 428px 316px;
	background-repeat: no-repeat;
}

#blok-6 {
	background-image: url('illustraties/troostvanfre-860x532.png');
	background-position: right;
	background-size: contain;
	background-repeat: no-repeat;
}

#blok-9 div.slice-7 {
	position: absolute;
	top: 54px;
	right: 10px;
	width: 74px;
	height: 140px;
	background-image: url('kopvoeters/slice-7.png');
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 2;
}

#blok-10 div.hands-up {
	position: absolute;
	top: 70px;
	left: 535px;
	width: 40px;
	height: 82px;
	background-image: url('kopvoeters/hands-up.png');
	background-repeat: no-repeat;
	background-size: 40px 82px;
	z-index: 2;
}

#blok-11 .kruipend-zoeken {
	position: absolute;
	top: 110px;
	left: 110px;
	width: 109px;
	height: 46px;
	background-image: url('kopvoeters/kruipend-zoeken.png');
	background-repeat: no-repeat;
	background-size: 109px 46px;
}

/* 7.2  Illustraties op vervolgpagina's */

body.blog #blok-1.blok-smal.vervolgpagina .anoiksis-illustratie,
body.archive #blok-1.blok-smal.vervolgpagina .anoiksis-illustratie,
body.category #blok-1.blok-smal.vervolgpagina .anoiksis-illustratie,
body.single #blok-1.blok-smal.vervolgpagina .anoiksis-illustratie {
	position: absolute;
	top: -20px;
	right: 100px;
	width: 183px;
	height: 160px;
	background-image: url('kopvoeters/slice 1 copy-366x320.png');
	background-repeat: no-repeat;
	background-size: 183px 160px;
}

body.page-id-61 #blok-99.blok-smal.vervolgpagina .anoiksis-illustratie {
	position: absolute;
	top: -15px;
	right: 160px;
	width: 214px;
	height: 160px;
	background-image: url('kopvoeters/sterren-rijtje-427x320.png');
	background-repeat: no-repeat;
	background-size: 214px 160px;
}

/* Regio's */
#content div.kleurvlak-item.regio:nth-child(6) a {
	background-image: url('kopvoeters/slice 2.png');
	background-repeat: no-repeat;
	background-size: 56px 90px;
	background-position: 116px 116px;
	padding: 70px 20px 120px; /* 120px onderkant padding voor de kopvoeters, anders zijn ze niet zichtbaar. */
}
#content div.kleurvlak-item.regio:nth-child(10) a {
	background-image: url('kopvoeters/slice 6.png');
	background-repeat: no-repeat;
	background-size: 100px 77px;
	background-position: 18px 107px;
	padding: 70px 20px 120px; /* 120px onderkant padding voor de kopvoeters, anders zijn ze niet zichtbaar. */
}
#content div.kleurvlak-item.regio:nth-child(17) {
	padding-bottom: 40px; /* onderkant padding voor de kopvoeters, anders zijn ze niet zichtbaar. */
}
#content div.kleurvlak-item.regio:nth-child(17) a {
	background-image: url('kopvoeters/smile.png');
	background-repeat: no-repeat;
	background-size: 37px 100px;
	background-position: 122px 164px;
	padding: 70px 20px 175px; /* 175px onderkant padding voor de kopvoeters, anders zijn ze niet zichtbaar. */
}


/* 8.  Vervolgpagina's
-------------------------------------------------------------- */

#blok-1.blok-smal.vervolgpagina,
#blok-99.blok-smal.vervolgpagina {
	min-height: 125px;
}

#blok-1 h2.template { /* vervolgpagina */
	padding: 20px 0 0 0;
}

.vervolgpagina .blok-breed p {
	width: auto;
	margin: 7px auto 7px auto;
	text-align: left;
	overflow: hidden;
}

#sub-heading {
	width: 292px; /* afbeelding is 228px breed, geen idee */
	height: 125px; /* onderkant van afbeelding uitlijnen */
	background-position: 0 0;
	background-repeat: no-repeat;
}
.page-wat-is-een-psychose #sub-heading {
	background-image: url('images/subheading-1.png');
	margin-left: 25px;
}
.page-lotgenoten-contact #sub-heading {
	background-image: url('images/subheading-2.png');
	margin-left: 351px;
}
.page-psychose-zaken #sub-heading {
	background-image: url('images/subheading-3.png');
	margin-left: 653px;
}
#sub-heading h2.template {
	margin: 0;
	padding: 30px 30px 10px 40px;
	font-size: 0.9rem;
	font-weight: 600;
}
#sub-heading h3.template {
	margin: 0;
	padding: 0 30px 10px 50px;
	font-size: 0.9rem;
	font-weight: 400;
}

/* Kleurvlakken voor items op pagina Vacatures en Regio's. */
div.kleurvlak-item {
	width: 240px;
	height: 166px;
	margin: 20px 20px 20px 20px;
	float: left;
	background-image: url('images/kleurvlak-item.png');
	background-repeat: no-repeat;
}
#content div.kleurvlak-item a,
#content div.kleurvlak-item a:visited,
div.kleurvlak-item a,
div.kleurvlak-item a:visited {
	display: block;
	padding: 70px 20px 70px; /* 120px onderkant padding voor de kopvoeters, anders zijn ze niet zichtbaar. */
	text-align: center;
	color: #333;
}

div.kleurvlak-item.movie {
	margin-bottom: 20px;
}
#content div.kleurvlak-item.movie a,
div.kleurvlak-item.movie a {
	position: relative;
	display: block;
	max-width: 150px;
	max-height: 150px;
	min-height: 80px;
	padding: 50px 0px 50px 55px;
}
div.kleurvlak-item.movie a img {
	max-width: 150px;
	max-height: 150px;
}

div.kleurvlak-item.movie a .caption-wrap {
	position: absolute;
	bottom: 56px;
	left: 55px;
	opacity: 1; /* ondoorzichtig, we gebruiken alpha-channel in background. */
	background: rgba( 100, 100, 100, 0.6 );
	color: #fff;
	margin: 0;
	display: block;
	max-width: 150px;
	font-weight: 400;
	font-size: 0.7rem;
	line-height: 1.1em;
}
div.kleurvlak-item.movie a .taalcode-wrap {
	position: absolute;
	bottom: 126px;
	right: 30px;
	opacity: 1; /* ondoorzichtig, we gebruiken alpha-channel in background. */
	background: rgba( 100, 100, 100, 0.6 );
	color: #fff;
	margin: 0;
	display: block;
	max-width: 150px;
	font-weight: 400;
	font-size: 0.7rem;
	line-height: 1.1em;
}

.meest-bekeken span.count {
	color: #555;
}

#blok-1 nav.wp-block-breadcrumbs {
	--separator: "➤" !important; /* override inline style */
	box-sizing: border-box;
	padding-top: 10px;
	margin-left: -35px; /* opheffen padding van #blok-1 */
	font-size: 90%;
}
#blok-1 .wp-block-breadcrumbs ol {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
#blok-1 .wp-block-breadcrumbs li {
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
}
#blok-1 .wp-block-breadcrumbs li:not(:last-child)::after {
	content: var(--separator, "➤");
	margin: 0 0.5em;
	opacity: 0.7;
	color: #008000;
}
#blok-1 .wp-block-breadcrumbs li a {
	display: inline;
	margin: 0 0 0 0;
	text-transform: lowercase;
	font-style: normal;
}
#blok-1 .wp-block-breadcrumbs span {
	color: #008000;
	text-transform: lowercase;
}



/* 9.  Categorie / Taxonomie / Nieuwspagina
-------------------------------------------------------------- */



/* 10. Single bericht
-------------------------------------------------------------- */


/* 11. Content
-------------------------------------------------------------- */

#content {
	clear: both;
}

.vervolgpagina #content a,
.vervolgpagina #content a:visited {
	color: #008000;
}

#content ul ul,
#content ol ol,
#content ul ol,
#content ol ul {
	margin-bottom: 0;
}
#content table {
	border: 1px solid #e7e7e7;
	margin: 0 -1px 24px 0;
	text-align: left;
	width: 100%;
}
#content tr th,
#content thead th {
	color: #888;
	font-size: 0.8em;
	font-size: 0.8rem;
	font-weight: bold;
	line-height: 18px;
	padding: 9px 24px;
}
#content tr td {
	border-top: 1px solid #e7e7e7;
	padding: 6px 24px;
}
#content tr.odd td {
	background: #f2f7fc;
}
.hentry {
	margin: 0 0 8px 0;
}
.home .sticky {
	background: #f2f7fc;
	border-top: 4px solid #000;
	margin-left: -20px;
	margin-right: -20px;
	padding: 18px 20px;
}
.page-title {
	font-size: 1.2em;
	font-size: 1.2rem;
	font-weight: bold;
	margin: 0 0 36px 0;
}
.page-title span {
	font-size: 1.2em;
	font-size: 1.2rem;
	font-style: italic;
	font-weight: normal;
}
.page-title a:link,
.page-title a:visited {
	text-decoration: none;
}
.page-title a:active,
.page-title a:hover {
	color: #ff4b33;
}
.entry-title a:link,
.entry-title a:visited {
	text-decoration: none;
}
.entry-title a:active,
.entry-title a:hover {
	color: #ff4b33;
}
.entry-meta {
	color: #888;
	font-size: 0.8em;
	font-size: 0.8rem;
}
.entry-meta abbr,
.entry-utility abbr {
	border: none;
}
.entry-meta abbr:hover,
.entry-utility abbr:hover {
	border-bottom: 1px dotted #666;
}
.entry-content,
.entry-summary {
	padding: 12px 0 0 0;
}

#content .entry-summary p:last-child {
	margin-bottom: 12px;
}
.entry-content fieldset {
	border: 1px solid #e7e7e7;
	margin: 0 0 24px 0;
	padding: 24px;
}
.entry-content fieldset legend {
	font-weight: bold;
	padding: 0 24px;
}
.entry-content input {
	margin: 0 0 24px 0;
}
.entry-content input.file,
.entry-content input.button {
	margin-right: 24px;
}
.entry-content label {
	color: #888;
	font-size: 0.8em;
	font-size: 0.8rem;
}
.entry-content select {
	margin: 0 0 24px 0;
}
.entry-content sup,
.entry-content sub {
	font-size: 0.7em;
	font-size: 0.7rem;
}
.entry-content blockquote.left {
	float: left;
	margin-left: 0;
	margin-right: 24px;
	text-align: right;
	width: 33%;
}
.entry-content blockquote.right {
	float: right;
	margin-left: 24px;
	margin-right: 0;
	text-align: left;
	width: 33%;
}


/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}


/* 12. Images
Gallery listing
-------------------------------------------------------------- */

.category-gallery .size-thumbnail img {
	border: 10px solid #f1f1f1;
	margin-bottom: 0;
}
.category-gallery .gallery-thumb {
	float: left;
	margin-right: 20px;
	margin-top: -4px;
}
.home #content .category-gallery .entry-utility {
	padding-top: 4px;
}

/* Nextgen Gallery overschrijven of aanvullen
-------------------------------------------------------------- */


/* Images Algemeen
-------------------------------------------------------------- */

figure,
img {
	max-width: 100%;
	width: auto;
	height: auto;
}

.entry-content img,
.entry-summary img,
.comment-content img,
.widget img,
.wp-caption,
#content img {
	margin: 0;
	max-width: 100%;
	width: auto;
	height: auto;
}
#content .attachment img {
	max-width: 900px;
}
#content .alignleft,
#content img.alignleft {
	display: inline;
	float: left;
	margin-right: 24px;
	margin-top: 4px;
}
#content .alignright,
#content img.alignright {
	display: inline;
	float: right;
	margin-left: 24px;
	margin-top: 4px;
}
#content .aligncenter,
#content img.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
#content img.alignleft,
#content img.alignright,
#content img.aligncenter {
	margin-bottom: 12px;
}


/* Make sure images with WordPress-added height and width attributes are scaled correctly. */
.entry-content img,
.entry-summary img,
.comment-content img[height],
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {
	height: auto;
}

img.size-full,
img.size-large,
img.wp-post-image {
	height: auto;
	max-width: 100%;
}

/* Make sure videos and embeds fit their containers. */
embed,
iframe,
object,
video {
	max-width: 100%;
}


/* Galleries
---------------------------------------------------------------------------- */

.gallery {
	margin-bottom: 20px;
	margin-left: -4px;
}

.gallery-item {
	float: left;
	margin: 0 4px 4px 0;
	overflow: hidden;
	position: relative;
}

.gallery-columns-1.gallery-size-medium,
.gallery-columns-1.gallery-size-thumbnail,
.gallery-columns-2.gallery-size-thumbnail,
.gallery-columns-3.gallery-size-thumbnail {
	display: table;
	margin: 0 auto 20px;
}

.gallery-columns-1 .gallery-item,
.gallery-columns-2 .gallery-item,
.gallery-columns-3 .gallery-item {
	text-align: center;
}

.gallery-columns-4 .gallery-item {
	max-width: 23%;
	max-width: -webkit-calc(25% - 4px);
	max-width:         calc(25% - 4px);
}

.gallery-columns-5 .gallery-item {
	max-width: 19%;
	max-width: -webkit-calc(20% - 4px);
	max-width:         calc(20% - 4px);
}

.gallery-columns-6 .gallery-item {
	max-width: 15%;
	max-width: -webkit-calc(16.7% - 4px);
	max-width:         calc(16.7% - 4px);
}

.gallery-columns-7 .gallery-item {
	max-width: 13%;
	max-width: -webkit-calc(14.28% - 4px);
	max-width:         calc(14.28% - 4px);
}

.gallery-columns-8 .gallery-item {
	max-width: 11%;
	max-width: -webkit-calc(12.5% - 4px);
	max-width:         calc(12.5% - 4px);
}

.gallery-columns-9 .gallery-item {
	max-width: 9%;
	max-width: -webkit-calc(11.1% - 4px);
	max-width:         calc(11.1% - 4px);
}

.gallery-columns-1 .gallery-item:nth-of-type(1n),
.gallery-columns-2 .gallery-item:nth-of-type(2n),
.gallery-columns-3 .gallery-item:nth-of-type(3n),
.gallery-columns-4 .gallery-item:nth-of-type(4n),
.gallery-columns-5 .gallery-item:nth-of-type(5n),
.gallery-columns-6 .gallery-item:nth-of-type(6n),
.gallery-columns-7 .gallery-item:nth-of-type(7n),
.gallery-columns-8 .gallery-item:nth-of-type(8n),
.gallery-columns-9 .gallery-item:nth-of-type(9n) {
	margin-right: 0;
}

.gallery-caption {
	background-color: rgba(0, 0, 0, 0.7);
	box-sizing: border-box;
	color: #fff;
	font-size: 14px; /* Static size in px */
	line-height: 1.3;
	margin: 0;
	max-height: 50%;
	opacity: 0;
	padding: 2px 8px;
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: left;
	-webkit-transition: opacity 400ms ease;
	transition:         opacity 400ms ease;
	width: 100%;
}

.gallery-caption:before {
	box-shadow: 0 -10px 15px #000 inset;
	content: "";
	height: 100%;
	min-height: 49px;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}

.gallery-item:hover .gallery-caption {
	opacity: 1;
}

.gallery-columns-7 .gallery-caption,
.gallery-columns-8 .gallery-caption,
.gallery-columns-9 .gallery-caption {
	display: none;
}


/* 13 Post Formats
---------------------------------------------------------------------------- */



/* 14. Navigatie
-------------------------------------------------------------- */

.navigation {
	font-size: 0.9em;
	font-size: 0.9rem;
	line-height: 1.3;
	overflow: hidden;
	padding: 20px 0;
	clear: both;
}
.navigation a:link,
.navigation a:visited {
	text-decoration: none;
}
.navigation a:active,
.navigation a:hover {
}
.nav-previous {
	float: left;
	width: 50%;
}
.nav-next {
	float: right;
	text-align: right;
	width: 50%;
}
#nav-above {
	margin: 0 0 18px 0;
}
#nav-above {
	display: none;
}
.paged #nav-above,
.single #nav-above {
	display: block;
}
#nav-below {
	margin: -18px 0 0 0;
}

#content .ngg-navigation {
	padding: 15px 0;
}


/* 15. Reacties weergave
-------------------------------------------------------------- */
#comments .navigation {
	padding: 0 0 8px 0;
}
.commentlist {
	list-style: none;
	margin: 0;
	clear: both;
}
.commentlist li.comment {
	border-bottom: 1px solid #e7e7e7;
	line-height: 24px;
	margin: 0 0 24px 0;
	padding: 0 0 0 56px;
	position: relative;
}
.commentlist li:last-child {
	border-bottom: none;
	margin-bottom: 0;
}
#comments .comment-body ul,
#comments .comment-body ol {
	margin-bottom: 18px;
}
#comments .comment-body p:last-child {
	margin-bottom: 6px;
}
#comments .comment-body blockquote p:last-child {
	margin-bottom: 24px;
}
.commentlist ol {
	list-style: decimal;
}
.commentlist .avatar {
	position: absolute;
	top: 4px;
	left: 0;
}
.comment-author {
}
.comment-author cite {
	font-style: normal;
	font-weight: bold;
}
.comment-author .says {
	font-style: italic;
}
.comment-meta {
	font-size: 0.8em;
	font-size: 0.8rem;
	margin: 0 0 18px 0;
}
.commentlist .even {
}
.commentlist .bypostauthor {
}
.reply {
	font-size: 0.8em;
	font-size: 0.8rem;
	padding: 0 0 24px 0;
}
.commentlist .children {
	list-style: none;
	margin: 0;
}
.commentlist .children li {
	border: none;
	margin: 0;
}
.nopassword,
.nocomments {
	display: none;
}


/* 16. Reacties formulier
----------------------------------------------------------- */
#respond {
	border-top: 1px solid #e7e7e7;
	margin: 24px 0;
	overflow: hidden;
	position: relative;
}
#respond p {
	margin: 0;
}
#respond .comment-notes {
	margin-bottom: 1em;
}
.form-allowed-tags {
	line-height: 1em;
	display: none;
}
.children #respond {
	margin: 0 48px 0 0;
}
h3#reply-title {
	margin: 18px 0;
}
#comments-list #respond {
	margin: 0 0 18px 0;
}
#comments-list ul #respond {
	margin: 0;
}
#cancel-comment-reply-link {
	font-size: 0.8em;
	font-size: 0.8rem;
	font-weight: normal;
	line-height: 18px;
}
#respond .required {
	color: #ff4b33;
	font-weight: bold;
}
#respond label {
	font-size: 0.8em;
	font-size: 0.8rem;
}
#respond input {
	display: block; /* geef weer over de hele breedte, het inputveld komt er zo onder */
	margin: 0 0 9px;
}
#respond textarea {
	width: 97%;
}
#respond .form-allowed-tags {
	font-size: 0.8em;
	font-size: 0.8rem;
}
#respond .form-allowed-tags code {
	font-size: 0.7em;
	font-size: 0.7rem;
}
#respond .form-submit {
	margin: 12px 0;
}
#respond .form-submit input {
	width: auto;
}


/* 17. Footer
-------------------------------------------------------------- */

#footer {
	position: relative;
	min-height: 300px;
	background-image: url('images/footer-background.png');
	background-color: #e8f2e9;
	background-position: center bottom;
	background-repeat: no-repeat;
	border-radius: 10px 10px 0 0;
}
#logo-footer {
	padding: 50px 0 0 50px;
	width: 166px;
	height: 97px;
}
#logo-footer img {
	width: 166px;
	height: 97px;
}
#footermenu {
	position: absolute;
	top: 60px;
	left: 276px;
	width: 300px;
}
#footermenu ul {
	list-style: none;
	margin: 0;
}
#colophon {
	position: absolute;
	top: 234px;
	left: 224px;
	overflow: hidden;
	color: #555;
	font-size: 0.9rem;
}
#colophon_right {
	position: absolute;
	top: 60px;
	right: 30px;
}


/* 18. Print Style
-------------------------------------------------------------- */

@media print {
	html,
	body,
	.blok-smal,
	.blok-breed {
		position: static;
		clear: both;
		background: none !important;
		padding: 10px 0;
		border-bottom: 1pt solid #ddd;
		margin: 20px 0;
		height: auto;
		min-height: auto;
	}
	.blok-smal *,
	.blok-breed * {
		position: static;
		float: none;
	}
	.blok-smal h2.template,
	.blok-smal h3.template {
		padding: 10px 0 0 0;
	}
	#wrapper {
		clear: both !important;
		display: block !important;
		float: none !important;
		position: relative !important;
	}
	#header {
		position: static;
		/* border-bottom: 1pt solid #aaa; */
		min-height: 40px;
	}
	#footer {
		height: 30px;
		min-height: 30px;
		background: none !important;
	}
	#colophon {
		position: static;
		border-top: 0pt solid #aaa;
	}
	.entry-content {
		font-size: 1.1em;
		font-size: 1.1rem;
		line-height: 1.6em;
	}
	h2,
	h3,
	.entry-title {
		font-size: 1.4em;
		font-size: 1.4rem;
		padding: 5px 0;
	}
	#sublogo,
	#topmenu-container,
	#header-search-form-container,
	#hamburgermenu-container,
	button.menu-toggle,
	.hamburger,
	#branding img,
	#respond,
	.comment-edit-link,
	.edit-link,
	.navigation,
	.page-link,
	.widget-area,
	#footermenu,
	#kolom-menus,
	#blok-3 a.button,
	#blok-99,
	span#colophon_right,
	#blok-10 .wpforms-recaptcha-container {
		display: none !important;
	}
	#container,
	#header,
	#footer {
		margin: 0;
		width: 100%;
	}
	#content,
	.one-column #content {
		margin: 24pt 0 0;
		width: 100%;
	}
	.wp-caption p {
		font-size: 0.8em;
		font-size: 0.8rem;
	}
	#colophon {
		width: auto;
	}
	.home .sticky {
		border: none;
	}
}

/* 19. Tablet and Big Smartphone Media Query
 *     Adjust as needed, make sure to use mostly percentages
-------------------------------------------------------------- */

.mobiel {
	display: none;
}

@media only screen and (max-width: 974px) {

	html {
		background-image: url('illustraties/achtergrond_patroon-1000x1000.jpg'); /* 32 KB */
		background-size: 250px 250px; /* blijkbaar 1/4e van de afbeelding? */
	}

	body div#holding_hands {
		left: 153px;
	}

	#kolom-menus {
		padding-left: 100px;
	}

	div.flex-viewport {
		position: relative;
		z-index: 2;
	}
	.kolom,
	.kolom-1,
	.kolom-2,
	.kolom-3,
	#kolom-menus ul.slides > li {
		width: 400px;
		min-height: 360px;
		background-size: contain;
	}
	ul.slides {
		min-height: 440px;
	}

	#blok-10 .wpforms-recaptcha-container {
		right: -140px;
	}

}

@media only screen and (max-width: 959px) {

	#kolom-menus {
		margin-top: 20px;
	}

	/* Slider op mobiel, minder dan 960px breedte. */
	.anoiksis-active-slider {
		min-height: 420px;
	}
	.kolom, #kolom-menus .slides > li {
		min-height: 340px;
	}
	#kolom-2,
	#kolom-3 {
		display: none;
	}
	div.custom-navigation {
		display: block;
		height: 24px;
		position: absolute;
		bottom: -1px;
		width: 100%;
		margin-left: -100px;
		z-index: 3;
	}

}

@media only screen and (max-width: 940px) {

	/* We geven elementen een class mee als er eentje voor desktop is en eentje voor mobiel. */
	.desktop {
		display: none;
	}
	.mobiel {
		display: block;
	}

	body {
		width: 90%;
		margin: 0 auto;
	}
	#wrapper,
	#content,
	.home #content {
		width: 820px;
		margin: 0;
		font-size: 1.3em;
		font-size: 1.3rem;
	}

	#header {
		min-height: 240px;
	}

	#sublogo {
		top: 120px;
		left: 210px;
		width: 470px;
	}
	#sublogo span {
		font-size: 2.1rem;
	}

	#topmenu-container {
		width: 380px;
		right: 200px;
	}

	#header div#header-search-form-container {
		left: 495px;
	}
	#hamburgermenu-container {
		right: -20px;
	}

	.kolom ul.menu li a {
		font-size: 1.15rem;
		line-height: 1.8rem;
	}

	.page-wat-is-een-psychose #sub-heading {
		margin-left: 35px;
	}
	.page-lotgenoten-contact #sub-heading {
		margin-left: 276px;
	}
	.page-psychose-zaken #sub-heading {
		margin-left: 503px;
	}
	#sub-heading h2,
	#sub-heading h3 {
		font-size: 0.9rem;
	}

	.blok-breed,
	#blok-nieuws {
		width: 760px;
		padding: 50px 20px 50px 20px;
	}
	.blok-smal {
		width: 720px;
		padding: 0 20px 0 20px;
	}

	#blok-1 nav.wp-block-breadcrumbs {
		margin-left: 0;
	}

	#blok-3 h3.template {
		text-align: left;
		padding: 50px 0 0 30px;
	}
	#blok-3 p {
		width: auto;
		float: none;
	}
	#blok-3 a.button {
		display: inline-block;
		top: 140px;
	}
	#blok-3 div.slice-7 {
		top: 61px;
	}

	#blok-nieuws div.nieuwsbericht:nth-child(1),
	#blok-nieuws div.nieuwsbericht:nth-child(2) {
		margin-right: 30px;
	}
	#blok-nieuws div.nieuwsbericht {
		width: 193px;
	}

	#blok-7 {
		height: 280px;
	}
	#blok-7 div#faq {
		padding: 60px 0 0 60px;
		width: 600px;
	}

	#blok-8 {
		min-height: 95px; /* let op padding */
	}
	#blok-8-right {
		margin-left: 60px;
	}

	#blok-9 {
		min-height: 320px;
	}
	#blok-9 p {
		width: auto;
	}
	#blok-9 a.button {
		position: absolute;
		top: 210px;
		right: 30px;
		display: inline-block;
		float: none;
		margin-top: 20px;
	}
	#blok-9 div.slice-7 {
		top: 153px;
	}

	#blok-10 p.blok-10-first-p {
		font-size: 1rem;
	}
	#blok-10 div.hands-up {
		left: 467px;
		top: 50px;
	}
	#colophon {
		display: none;
	}

	#content img {
		max-width: 100%;
	}
}

@media only screen and (max-width: 890px) {

	#colophon_right {
		display: none;
	}

	#wrapper,
	#content,
	.home #content {
		width: 720px;
		margin: 0 auto;
	}

	#sublogo {
		left: 150px;
	}
	#topmenu-container {
		right: 140px;
	}

	button#zoekbutton {
		right: 65px; /* 5px dichter bij hamburgermenu */
	}
	#header div#header-search-form-container {
		left: 447px;
	}
	button.menu-toggle {
		right: 0px;
	}

	.blok-breed,
	#blok-nieuws {
		width: 660px;
	}
	.blok-smal {
		width: 620px;
	}

	.page-wat-is-een-psychose #sub-heading {
		margin-left: 35px;
	}
	.page-lotgenoten-contact #sub-heading {
		margin-left: 226px;
	}
	.page-psychose-zaken #sub-heading {
		margin-left: 404px;
	}

	#blok-1 div.heading {
		padding-right: 0;
		width: 390px;
	}

	#blok-2 p {
		line-height: 1.7rem;
	}

	#blok-3 p {
		margin-bottom: 0;
	}

	#blok-nieuws div.nieuwsbericht:nth-child(1) {
		margin-right: 50px;
		margin-bottom: 50px;
	}
	#blok-nieuws div.nieuwsbericht:nth-child(2) {
		margin-right: 0px;
		margin-bottom: 50px;
	}
	#blok-nieuws div.nieuwsbericht {
		width: 250px;
	}

	#blok-5,
	#blok-voorlichting {
		height: 280px;
	}
	#blok-5 a,
	#blok-voorlichting a {
		margin-left: 10px;
		width: auto;
	}

	#blok-7 div#faq {
		padding: 60px 0 0 40px;
		width: 530px;
	}

	div.blok-8-right {
		margin-left: 160px;
	}

	#blok-10 div.hands-up {
		left: 406px;
	}

	div.search-form-container {
		left: 290px;
	}

	#blok-10 .wpforms-recaptcha-container {
		right: -100px;
	}

}

@media only screen and (max-width: 784px) {
	#wrapper,
	#content,
	.home #content {
		width: 620px;
	}

	#header {
		min-height: 240px;
	}

	#sublogo {
		top: 150px;
		left: 80px;
	}

	#header div#header-search-form-container {
		left: 343px;
	}
	button.menu-toggle {
		right: 0px;
	}
	#hamburgermenu-container {
		top: 140px;
		right: -30px;
	}

	#topmenu-container {
		right: 0px;
	}

	.page-wat-is-een-psychose #sub-heading {
		margin-left: 35px;
	}
	.page-lotgenoten-contact #sub-heading {
		margin-left: 176px;
	}
	.page-psychose-zaken #sub-heading {
		margin-left: 303px;
	}

	.blok-breed,
	#blok-nieuws {
		width: 560px;
	}
	.blok-smal {
		width: 520px;
	}

	#blok-1 div#sterren_cirkel {
		width: 160px;
		height: 220px;
		background-position: 6px 40px;
	}
	#blok-1 div.heading {
		width: 340px;
	}
	#blok-1 h3.template br {
		display: none; /* tekst mag natuurlijk vloeien */
	}

	#blok-3 a.button {
		right: 70px;
	}
	#blok-3 div.slice-7 {
		right: 48px;
	}

	#blok-4 {
		background-position: -75px 0;
	}
	#blok-4 .blok-4-inner {
		margin-left: 280px;
	}

	#blok-nieuws div.nieuwsbericht:nth-child(1),
	#blok-nieuws div.nieuwsbericht:nth-child(2),
	#blok-nieuws div.nieuwsbericht {
		float: none;
		margin: 0 auto 30px auto;
		width: 400px;
		height: 200px;
	}
	#blok-nieuws h3 span.nagel-1 {
		padding: 0 35px 0 0;
	}
	#blok-nieuws h3 span.nagel-2 {
		padding: 0 0 0 35px;
	}
	#blok-nieuws h3 a {
		font-size: 1.35rem;
	}
	#blok-nieuws div.nieuwsbericht h4 a {
		font-size: 1.35rem;
		line-height: 1.55rem;
	}
	#blok-nieuws div.nieuwsbericht p {
		font-size: 1.2rem;
		line-height: 1.4rem;
	}

	#blok-5 h3.template br,
	#blok-voorlichting h3.template br {
		display: none; /* tekst mag natuurlijk vloeien */
	}

	#blok-7 div#faq {
		padding: 60px 0 0 10px;
		width: 510px;
	}

	div.blok-8-right {
		margin-left: 190px;
	}
	#blok-8 p {
		width: 300px;
	}

	#blok-9 {
		min-height: 350px;
	}
	#blok-9 a {
		margin: 0 0 0 0;
	}
	#blok-9 a.button {
		top: 250px;
	}
	#blok-9 div.slice-7 {
		top: 193px;
	}

	#blok-10 div.hands-up {
		left: 366px;
	}

	#blok-11 .kruipend-zoeken {
		left: 60px;
	}
	div.search-form-container {
		left: 210px;
	}

	#blok-10 .wpforms-recaptcha-container {
		right: -50px;
	}

}

@media only screen and (max-width: 680px) {
	#wrapper,
	#content,
	.home #content {
		width: 560px;
	}

	#header div#header-search-form-container {
		left: 284px;
	}

	.page-wat-is-een-psychose #sub-heading {
		margin-left: 35px;
	}
	.page-lotgenoten-contact #sub-heading {
		margin-left: 146px;
	}
	.page-psychose-zaken #sub-heading {
		margin-left: 243px;
	}

	.blok-breed,
	#blok-nieuws {
		width: 500px;
	}
	.blok-smal {
		width: 460px;
	}

	#blok-1 div.heading {
		width: 290px;
	}

	#blok-1 a {
		margin: 30px 60px 0 0;
	}

	#blok-3 a.button {
		right: 50px;
		top: 170px;
	}
	#blok-3 div.slice-7 {
		right: 28px;
		top: 91px;
	}

	#blok-5 a.button,
	#blok-voorlichting a.button {
		padding-right: 0px;
		padding-left: 0px;
		margin-right: 10px;
		font-size: 1rem;
	}

	#blok-7 div#faq {
		padding: 60px 0 0 0;
		width: 480px; /* Dit is zo smal als dat het gaat... */
	}

	div.blok-8-right {
		margin-left: 230px;
	}
	#blok-8 p {
		width: 270px;
	}

	#blok-9 {
		width: 500px; /* wel erg passen en meten */
		padding: 0 0 0 0;
	}
	#blok-9 h3.template {
		margin-left: 20px;
	}
	#blok-9 p {
		margin-left: 20px;
	}

	#blok-10 .blok-10-inner {
		width: 465px;
		padding-left: 55px;
	}

	#blok-11 .kruipend-zoeken {
		left: 40px;
	}
	div.search-form-container {
		left: 170px;
	}

}


/* Accessibility plugin */

html body nav.onetap-accessibility.onetap-plugin-onetap,
html body nav.onetap-accessibility.onetap-plugin-onetap.onetap-toggle-close {
	right: -800px !important;
}
