/*
 Theme Name:   Garage2020
 Theme_URI:    https://www.lemon.nl
 Date:         12/2025
 Author:       Roeland ten Holder | Lemon
 Author URI:   roeland@lemon.nl
 Template:     understrap
 Version:      0.5.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  understrap-child
*/

body { overflow-x: hidden !important; max-width: 100vw; }


/* FONTS */
@font-face { font-family: 'campton-book-italic'; src: url('fonts/9838campton-book-italic.woff2') format('woff2'), url('fonts/9838campton-book-italic.woff') format('woff'); font-display: auto; }
@font-face { font-family: 'campton-light'; src: url('fonts/2093campton-light.woff2') format('woff2'), url('fonts/2093campton-light.woff') format('woff'); font-display: auto; }
@font-face { font-family: 'campton-book'; src: url('fonts/542campton-book.woff2') format('woff2'), url('fonts/542campton-book.woff') format('woff'); font-display: auto; }
@font-face { font-family: 'campton-semi-bold'; src: url('fonts/502campton-semi-bold.woff2') format('woff2'), url('fonts/502campton-semi-bold.woff') format('woff'); font-display: auto; }
@font-face { font-family: 'campton-bold'; src: url('fonts/5011Campton-bold.woff2') format('woff2'), url('fonts/5011Campton-bold.woff') format('woff'); font-display: auto; }

.campton-book-italic	{ font-family: 'campton-book-italic' !important; }
.campton-light			{ font-family: 'campton-light' !important; }
.campton-book, p		{ font-family: 'campton-book' !important; }
.campton-semi-bold		{ font-family: 'campton-semi-bold' !important; }
.campton-bold			{ font-family: 'campton-bold' !important; }
blockquote, a 			{ font-family: 'campton-semi-bold' !important; }
h1, h2, h3, h4 			{ font-family: 'campton-bold' !important; }

.container-small 		{ max-width: 780px;  margin-left: auto; margin-right: auto; padding-left: 40px; padding-right: 40px; }
.container-middle		{ max-width: 1180px; margin-left: auto; margin-right: auto; padding-left: 40px; padding-right: 40px; }
.container-wide 		{ max-width: 1380px; margin-left: auto; margin-right: auto; padding-left: 40px; padding-right: 40px; }


body.home #page > .block.drie-kolommen img { width: 86%; }


#project-overzicht .content * {
	font-size: 1.7rem;
}

.a-hide {
	display: none !important;
}


.menu-item.has-community-image a {
	background-color: #194E46;
	color: #ffffff;
	height: unset;
	padding: 4px 10px 4px 44px;
	border-radius: 12px;
	background-image: url('images/boks-wit.png');
	background-size: 28px auto;
	background-repeat: no-repeat;
	background-position: 8px center;
}
.menu-item.has-community-image:hover a {
	color: #ffffff;
	background-color: #092d28;
	border: 0;
}

.dropdown-menu {
    border: 0;
    border-radius: 0;
    border-top: 1px solid #ccc;
    margin-top: 0px;
    padding: 10px;
	height: unset;
	margin-left: -28px;
}

.dropdown-toggle::after {
	display: inline-block;
	margin-left: 10px;
	vertical-align: .255em;
	content: "";
	border: none;
	width: 17px;
	height: 17px;
	background-image: url('images/arrowdown-green.svg');
	background-size: 16px auto;
	background-repeat: no-repeat;
	background-position: center center;
}

li:hover > a.dropdown-item,
a.dropdown-item:focus,
a.dropdown-item:hover {
	color: #092d28;
	background-color: unset;
	position: relative;
}

li:hover > a.dropdown-item::after {
	content: " ";
	position: absolute;
	bottom: 10px;
	display: block;
	width: 100%;
	height: 3px;
	background-color: #A28FFF;
}

li:hover > a.nav-link,
a.nav-link:focus,
a.nav-link:hover {
	color: #092d28;
	background-color: unset;
	border-top: 3px solid #ffffff;
	border-bottom: solid 3px #A28FFF;
}



.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}

.no-gutter {
    margin: 0;
}

.row.small-gutters > [class*='col-'] {
    padding-right: 10px;
    padding-left: 10px;
}


.filter h4 {
	font-size: 2.5rem;
}

.filter .facetwp-facet {
    margin-bottom: 20px;
}

.filter .facetwp-radio:first-of-type,
.filter .facetwp-counter,
.filter .facetwp-counter {
	display: none;
}

.filter .facetwp-radio {
	padding-left: 0;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: bottom center;
	width: 160px;
	height: 88px;
	opacity: 0.25;
	font-size: 1px;
	text-indent: -99999px;
	display: inline-block;
	margin: 5px 10px 5px 0;
}

.filter .facetwp-radio:hover,
.filter .facetwp-radio.checked {
	opacity: 1;
}
.filter .facetwp-radio:first-of-type.checked ~ .facetwp-radio {
	opacity: 1 !important;
}

.filter .facetwp-radio[data-value="beleid"] 						{ background-image: url('images/themas/beleid.svg'); }
.filter .facetwp-radio[data-value="beschermende-factoren"] 		{ background-image: url('images/themas/beschermende-factoren.svg'); }
.filter .facetwp-radio[data-value="financien"] 					{ background-image: url('images/themas/financien.svg'); }
.filter .facetwp-radio[data-value="geld"] 						{ background-image: url('images/themas/geld.svg'); }
.filter .facetwp-radio[data-value="gezondheid"] 					{ background-image: url('images/themas/gezondheid.svg'); }
.filter .facetwp-radio[data-value="maatschappelijke-problemen"] 	{ background-image: url('images/themas/maatschappelijke-problemen.svg'); }
.filter .facetwp-radio[data-value="mentale-gezondheid"] 			{ background-image: url('images/themas/mentale-gezondheid.svg'); }
.filter .facetwp-radio[data-value="mentale-uitdagingen"] 		{ background-image: url('images/themas/mentale-uitdagingen.svg'); }
.filter .facetwp-radio[data-value="onderwijs"] 					{ background-image: url('images/themas/onderwijs.svg'); }
.filter .facetwp-radio[data-value="relaties"] 					{ background-image: url('images/themas/relaties.svg'); }
.filter .facetwp-radio[data-value="school"] 						{ background-image: url('images/themas/school.svg'); }
.filter .facetwp-radio[data-value="thuis"] 						{ background-image: url('images/themas/thuis.svg'); }
.filter .facetwp-radio[data-value="wonen"] 						{ background-image: url('images/themas/wonen.svg'); }

.filter .facetwp-checkbox {
	background-image: none !important;
	margin: 5px 10px 5px 0;
	padding: 4px 20px;
	cursor: pointer;
	border: 2px solid #000000;
	border-radius: 20px;
	display: inline-block;
}

.filter .facetwp-checkbox:hover,
.filter .facetwp-checkbox.checked {
	background-image: none !important;
	background-color: rgba(255,255,255,0.8);
}


.filter .facetwp-checkbox.disabled,
.filter .facetwp-radio.disabled {
	opacity: 0.25;
	cursor: none;
	pointer-events: none;
}

.filter-reset {
	/* float: right; */
}

.filter .facetwp-reset {
	font-family: 'campton-book' !important;
}


.filter-team,
.filter-team div {
	position: relative;
	display: inline-block;
}

.filter .facetwp-dropdown {
	font-size: 1.8rem;
	border-radius: 0.25rem;
	font-family: 'campton-book' !important;
	margin-left: 60px;
	padding: 10px;
	background-color: #fff;
	min-width: 300px;
	outline: none;
	border: 1px solid #000;

	appearance: none;
	position: relative;
	cursor: pointer;
}

.filter .facetwp-type-dropdown::after {
	display: block;
	content: url('images/arrowdown.svg');
	position: absolute;
	top: 13px;
	right: 13px;
	pointer-events: none;
}


.filter .facetwp-dropdown:hover,
.filter .facetwp-dropdown:focus {
	outline: none;
	border: 1px solid #A28FFF;
}


#form-search {
	display: flex;
	margin-top: 120px;
}

#form-search input {
	border: none;
	color: white;
	background-color: #a28fff;
	font-family: 'campton-semi-bold' !important;
	font-size: 4rem;
	border-bottom: 1px solid #fff;
	width: calc(100% - 140px);
    margin-right: 20px;
}

#form-search input:focus {
    outline: none;
}

#form-search input::placeholder {
    border: none;
    color: white;
}

#form-search button {
	background-color: #fff;
	color: #000;
	padding: 17px 36px;
	font-size: 1.8rem;
	line-height: 1.3;
	font-family: 'campton-semi-bold' !important;
	border: none;
	border-radius: 0;
}

.search-results h3 {
	text-decoration: underline;
}

.search-results a:hover {
	color: #8876E1;
}









body.fixed {
    position: fixed;
}

html, body { 
    font-family: 'campton-book', 'Helvetica', sans-serif; 
    height: 100%;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size:62.5%;
}

.mobile, .mobile-l {
    display: none !important;
}

#page {
    padding-top: 110px;
}

a {
    color: unset;
    text-decoration: none;
}

a:hover {
    color: unset;
    text-decoration: none;
}

a:focus {
    outline: none;
}

p {
    margin: 0;
    font-size: 2rem;
    line-height: 1.5;
}

p.lead {
	font-size: 2.25rem;
}

p .small, p small {
	font-size: 1.6rem;
	line-height: 1.25;
}

h1 {
    font-size: 5.4rem;
    margin-top: 80px;
    margin-bottom: 50px;
}

h2 {
    font-size: 5rem;
    line-height: 1.2;
}

h3 {
    font-size: 3rem;
    line-height: 1.2;
}

h4 {
    font-size: 1.2rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

h5 {
    font-size: 1.2rem;
    line-height: 1.6rem;
    text-transform: uppercase;
    margin-bottom: 2rem;
}

h6 {
    font-size: 1rem;
    line-height: 1.5rem;
    text-transform: uppercase;
    margin-bottom: 2rem;
}

.col-md-12 {
    min-height: 0px;
}

/* Elementen */
/* blok titel */

.blok-titel h2 {
    position: relative;
    margin-bottom: 85px;
}

.blok-titel h1 {
    position: relative;
}

.blok-titel h2::after {
    content: url('images/streepje-paars.svg');
    position: absolute;
    bottom: -50px;
    left: 0;
}

.blok-titel h1::after {
    content: url('images/streepje-paars.svg');
    position: absolute;
    bottom: -50px;
    left: 0;
}

.blok-titel.paars h2::after {
    content: url('images/streepje-wit.svg');
}

.blok-titel.center h2::after {
    left: 0;
    right: 0;
    text-align: center;
}

/* Buttons */

.btn {
    padding: 12px 18px;
    font-size: 1.8rem;
    line-height: 1.3;
}

.btn-newsletter {
    border: 1px solid #000;
    font-family: 'campton-book';
}

.btn-white {
    background-color: #fff;
    color: #000;   
}

.btn-white:hover {
    color: #000;
}

.btn-black {
    background-color: #000;
    color: #fff;   
    margin-top: 20px;
	margin-bottom: 80px;
}




.btn-black:hover {
    color: #fff;
}

.btn-transparent {
    color: #000; 
    padding: 0px;
    margin-top: 20px
}

.btn-transparent:hover {
    color: #000;
}

.btn svg {
    margin-left: 15px;
    /* margin-bottom: -4px; */
    transition: margin 0.2s ease-in;
}

.btn:hover svg {
    margin-left: 20px;
    margin-right: -5px;
    transition: margin 0.2s ease-out;
}

.btn-abs {
    position: absolute;
    left: 20px;
    bottom: 40px;
}

#mc_embed_signup .button {
    padding: 12px 40px 12px 12px!important;
    font-size: 1.8rem !important;
    line-height: 1.3 !important;
    border: none;
    font-family: 'campton-book' !important;
    border-radius: .25rem !important;
    background-color: black !important;
    height: 44px !important;
    margin-top: 30px !important;
}

.clear svg {
    position: relative;
    right: 35px;
    top: 43px;
}

.clear svg path {
    stroke: white !important;
}

#mc_embed_signup .asterisk {
    font-size: 100% !important;
}

/* Header */

.current-menu-item > a {
	border-top: 3px solid #ffffff;
	border-bottom: solid 3px #A28FFF;
}

.submenu .current-menu-item a {
    border: none;
}

nav#menu {
    display: flex;
    align-items: center;
    padding-right: 40px;
}

.nav-wrapper, div#navbarNavDropdown {
    height: 100%;
}

.nav {
    padding: 0px;
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    top: 0;
}

.nav.col {
    justify-content: flex-end;
}

nav ul {
    padding: 0px;
    margin: 0px;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

nav ul li {
    list-style: none;
    display: inline-flex;
    padding: 0px 18px;
    height: 100%;
    align-items: center;
}

.logo , .logo h1 {
    display: inline;
    height: 50px;
    z-index: 1000;
}

#header {
    padding: 0px 50px;
    position: fixed;
    top: 0px;
    z-index: 1000000;
    background: #fff;
}

body.admin-bar #header {
    top: 32px;
}

#header .row {
    margin-left: 0;
    margin-right: 0;
    padding-top: 30px;
    padding-bottom: 30px;
}

a.nav-link,
a.dropdown-item {
    color: #1C4D44;
    text-decoration: none;
    font-size: 1.8rem;
    padding: 15px 0px;
    letter-spacing: 0.5px;
    height: 100%;
    display: flex;
    align-items: center;
}



.nav-wrapper {
    height: 100%;
}

.menu-item-search {
    height: 100%;
    padding-top: 0px;
    padding-left: 18px;
    display: flex;
    align-items: center;
	cursor: pointer;
}

.menu-item-search svg {
    position: relative;
    bottom: 2px;
}

/* Submenu */
.submenu {
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 1px solid #194e46;
    background-color: white;
}

.submenu ul {
    margin-bottom: 0px;
}

.submenu ul li {
    list-style: none;
    display: inline-block;
    padding: 30px 5px;
    margin: 0px 30px;
}

.submenu ul li a {
    color: #939897;
    text-decoration: none;
    font-size: 1.8rem;
    padding: 15px 0px;
    letter-spacing: 0.5px;
    position: relative;
}

.submenu ul li.current_page_item,
.submenu.team li.menu-item.menu-item-289 {
    border-bottom: 3px solid #A28FFF;
}

.submenu ul li.current_page_item a {
    color: #1C4D44;
}

#submenu_ms {
    display: none;
}

/* Footer */

footer .container-fluid {
    background-color: #A28FFF;
    padding-left: 40px;
    padding-right: 40px;
}

.row.footer-top {
    height: 200px;
    padding-top: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #000;
}

.dots {
  background-image: url('images/footer_dots.svg');
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}

.footer-bottom {
    display: flex;
}

.footer-bottom .footer-block {
    margin-top: 40px;
    margin-bottom: 40px;
    flex: 1;
}

.footer-bottom .footer-block:nth-of-type(1) {
    flex-grow: 1.2;
}

.footer-bottom .footer-block:nth-of-type(3) {
    flex-grow: 1.4;
}

.footer-bottom .footer-block  {
    border-right: 1px solid #8876E1;
}

.footer-bottom .footer-block:last-of-type {
    border-right: none;
}

.social a {
    padding-left: 15px;
}

.social a img {
    max-width: 40px;
}

.social.extra-image a img {
    max-width: 60px;
}

.footer-menu ul {
    padding-inline-start: 0px;
}

.footer-menu ul li {
    list-style: none;
}

.footer-menu ul li a {
    text-decoration: underline;
    color: black;
    font-family: 'campton-bold' !important;
    font-size: 2.2rem;
    line-height: 2;
}

/* Home */
.container-fluid#hero {
    background-color: #F2EDD9;
    padding-left: 0px;
    padding-right: 0px;
    position: relative;
    overflow: hidden;
}

#hero .col-md-6 {
    overflow: hidden;
}

#hero .col-md-6:first-of-type {
    padding-left: 80px;
    padding-right: 0px;
    padding-bottom: 180px;
    overflow: hidden;
}

#hero h1 {
    z-index: 100;
    position: relative;
    margin-top: 170px;
    margin-bottom: 40px;
}

#hero p {
    position: relative;
    z-index: 100;
    margin-bottom: 50px;
}

#hero::before {
    content: url(images/rechthoek-schuin-rood.svg);
    position: absolute;
    top: -129px;
    left: 236px;
    z-index: 0;
}

#hero::after {
    content: url(images/hectagon-geel.svg);
    position: absolute;
    bottom: -160px;
    left: 100px;
    z-index: 1;
}

#hero .col-md-6:last-of-type::after {
    content: url(images/vorm-paars.svg);
    position: absolute;
    bottom: -50px;
    right: 0px;
    z-index: 1;
}

.hero-image {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    clip-path: polygon(5% 80%, 17% 19%, 31% 0%, 100% 0, 100% 100%, 16% 100%);
    -webkit-clip-path: polygon(5% 80%, 17% 19%, 31% 0%, 100% 0, 100% 100%, 16% 100%);
}

.hero-image img {
    position: absolute;
    min-height: 100%;
    min-width: 100%;
    width: 0;
    object-fit: cover;
  }

/* Recente projecten */ 

.container-fluid#projecten-recent {
    padding: 0px;
    overflow: hidden;
}

#projecten-recent h2 {
    margin-top: 120px;
}

#projecten-recent h4.ondertitel {
    font-family: 'campton-book' !important;
    font-size: 2rem;
    line-height: 1.5;
    max-width: 400px;
}

.row.recent {
    background-color: #D8F6F8;
}

.project-card h3 {
    font-size: 2.75rem;
	line-height: 1.25;
    margin-bottom: 10px;
    margin-top: 10px;
	padding-top: 15px;
	overflow: hidden;
}

.project-card .recent h2 {
    margin-bottom: 130px;
}

.project-card .project-tekst {
    padding: 30px 30px 70px 30px;
}

.project-card .project-tekst p {
    margin-bottom: 15px;
}

.project-card .project-tekst img {
	max-width: 90px;
	min-height: 40px;
	float: right;
	margin: 4px -5px 0 10px;
}

.project-card .project-data {
    padding-left: 30px;
    padding-top: 30px;
}

.project-card .btn-abs {
    left: 30px;
}

.has-project-card {
	margin-bottom: 20px;
}

.project-card h4 {
	font-family: 'campton-book' !important;
	font-size: 2.25rem;
	line-height: 1.35;
	min-height: 6.1rem;
	display: flex;
	align-items: flex-end;
}


.has-project-card .thema-icon {

}


#projecten-recent .project-cards .has-project-card:nth-of-type(1) {
    /* padding-right: 15px; */
}

#projecten-recent .project-cards .has-project-card:nth-of-type(2) {
    /* padding-left: 15px; */
}

#projecten-recent .project-data p.age, #projecten-recent .project-data p.status {
    margin-right: 15px;
}

#projecten-recent .project-image img {
    width: 100%;
    height: 360px;
    max-height: unset;
    object-fit: cover;
}
#projecten-recent .project-cards .has-project-card:nth-of-type(1) .project-card .project-image img {
    clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
    -webkit-clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);

}

#projecten-recent .project-cards .has-project-card:nth-of-type(2) .project-card .project-image img {
    clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);
    -webkit-clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);
}

#projecten-recent .project-cards .has-project-card .project-card {
    position: relative;
    z-index: 101;
    height: 100%;
    background: linear-gradient(0deg, #ffffff 80%, #d8f6f800 20%);
}

#projecten-recent .project-cards .has-project-card:nth-of-type(1) {
    position: relative;
}

#projecten-recent .project-cards .has-project-card:nth-of-type(1):after {
    content: url('images/schuin-rood-2.svg');
    position: absolute;
    top: -134px;
    left: -94px;
    z-index: 0;
}

#projecten-recent .project-cards .has-project-card:nth-of-type(1):before {
    content: url('images/dots-paars.svg');
    position: absolute;
    left: -24px;
    top: -29px;
    z-index: 1;
}

#projecten-recent .project-cards .has-project-card:nth-of-type(2)::after {
    content: url('images/hectagon-geel.svg');
    position: absolute;
    right: -177px;
    bottom: -125px;
    z-index: 0;
}

#projecten-recent .project-cards .has-project-card:nth-of-type(2) .project-card::before {
    content: url('images/dots-paars.svg');
    position: absolute;
    left: 32px;
    top: 32px;
    z-index: -1;
}



#projecten-recent .project-cards .has-project-card:nth-of-type(2) {
    /* padding-left: 15px; */
}

#projecten-recent .project-cards .has-project-card:nth-of-type(2) .project-card .project-image {
    background-color: #fff;
}

#projecten-recent .row.project-cards {
    padding-right: 80px;
    padding-left: 80px;
    padding-bottom: 80px;
}

#projecten-recent ul.themas {
    margin-top: 80px;
    margin-bottom: 120px;
    padding-left: 80px;
    padding-right: 80px;
    align-items: flex-end;
    width: 100% !important;
    justify-content: center;
}

#projecten-recent ul.themas li {
    list-style: none;
    display: block;
    margin: 0;
    position: relative;
    padding: 5px 30px;
    position: relative;
    z-index: 10;
}

#projecten-recent ul.themas li img {
   max-width: 170px;
   width: 100%;
   min-width: 170px;
}

#projecten-recent ul.themas li:hover {
    margin-bottom: 10px;
    margin-top: -10px;
    transition: margin 0.2s ease-in;
}

#projecten-recent ul.themas li:hover img, 
.filters form ul li.sf-field-taxonomy-thema input:hover:after {
    -webkit-filter: drop-shadow( 3px 3px 20px rgba(224,224,224,1));
    filter: ddrop-shadow( 3px 3px 20px rgba(224,224,224,1));
    transition: box-shadow 0.2s ease-in;
}

.filters form ul li.sf-field-taxonomy-thema input:hover:after
{
    bottom: 0px;
}

.filters form ul li.sf-field-taxonomy-thema input[value="gezondheid"]:hover:after  {
    bottom: 10px;
}

#projecten-recent ul.themas li:after {
    content: url('images/arrowdown.svg');
    position: absolute;
    right: 44px;
    bottom: 13px;
}

#projecten-recent ul.themas li.thuis:after {
    content: url('images/arrowdown-white.svg');
}


/* Projecten Overzicht */

.container-fluid#project-overzicht {
    padding-right: 0px;
    padding-left: 0px; 
    background-color: #F3EEDA;
    padding-bottom: 100px;
}


.titel {
    background-color: #1C4D44;
    color: white;
    padding-top: 50px;
    padding-bottom: 110px;
}

#project-overzicht .pagination .btn + .btn, #team .pagination .btn + .btn {
    margin-left: 20px;
}

.page-id-438 .container-fluid#wysiwyg, .page-id-440 .container-fluid#wysiwyg {
    padding: 100px 80px 0px 80px;
}

.page-id-438 .container-fluid#wysiwyg:before, .page-id-440 .container-fluid#wysiwyg:before {
    display: none;
}

/* VORMEN */

.container-fluid#project-overzicht:after,
.container-fluid.single-project:after,
.container-fluid#wysiwyg:after,
.container-fluid#team:after,
.container-fluid#team-single:after
 {
    content: url('images/schuin-rood-4.svg');
    position: absolute;
    z-index: -1;
    top: 1400px;
    right: 0;
}


.container-fluid#wysiwyg::not(.hide_dots-1):before
 {
    content: url('images/dots.svg');
    position: absolute;
    z-index: -2;
    top: 300px;
    right: 0;
}

.container-fluid#team:before
 {
    content: url('images/schuin-wit.svg');
    position: absolute;
    z-index: 0;
    bottom: 200px;
    left: 0;
}

.container-fluid#wysiwyg:after{
    top: 300px;
    z-index: -1;
}

.container-fluid#team-single:after {
    top: 300px;
    z-index: 0;
}

.container-fluid#team:after {
    top: 900px;
}

.container-fluid#image:after
 {
    content: url('images/schuin-geel-2.svg');
    position: absolute;
    z-index: -2;
    top: -100px;
    left: 0;
}

.container-fluid#image::not(.hide_dots-1):before
 {
    content: url('images/dots2.svg');
    position: absolute;
    z-index: -1;
    top: 20px;
    left: 0;
}

.single-team .row.project-cards:after,
div#mededelingblok:before
 {
    content: url('images/schuin-rood-3.svg');
    position: absolute;
    z-index: 0;
    top: 600px;
    left: -400px;
}

.single-team .row.project-cards:before,
#mededeling .modal-content:before
 {
    content: url('images/hectagon-geel.svg');
    position: absolute;
    z-index: 0;
    top: 100px;
    right: -150px;
}

#intro .row {
    width: 100%;
}

.container-fluid#intro-tekst:not(.hide_dots-1)::after {
    content: url('images/dots-2.svg');
    position: absolute;
    z-index: 0;
    top: 200px;
    right: 0px;
}

.row.accordeon-item .col-md-7 .accordion-toggle:not(.collapsed) {
    position: relative;
}

.row.accordeon-item:nth-of-type(odd) .col-md-7 .accordion-toggle:not(.collapsed):after {
    content: url('images/hectagon-geel.svg');
    position: absolute;
    z-index: -1;
    top: 550px;
    right: -260px;
}

.row.accordeon-item:nth-of-type(odd) .col-md-7 .accordion-toggle:not(.collapsed):before {
    content: url('images/schuin-rood-5.svg');
    position: absolute;
    z-index: -1;
    top: 0px;
    left: -650px;
}

/* project card */ 

.project-card {
	mask-image: -webkit-radial-gradient(white, black);
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    overflow: hidden; 
}

/* .project-card:hover {
    transform: scale(1.04);
    transition: transform 0.2s ease-in;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    overflow: hidden; 
} */

.project-card:focus {
    outline: none; 
}

a.btn.understrap-read-more-link{
    display:none;
 }

.row.project-cards {
    padding-left: 80px;
    padding-right: 80px;
}

.row.project-cards .col-md-4 {
    /* padding-right: 30px;
    margin-bottom: 50px; */
}

.project-card {
    margin-bottom: 50px;
    z-index: 1;
    position: relative;
}

.project-info {
    background-color: #fff;
}

.project-data {
    padding: 20px;
    position: relative;
    align-items: flex-end !important;
    justify-content: start !important;
}

#project-overzicht .thema img {
    max-width: 100px;
    width: 100%;
}

#project-overzicht .project-card {
    height: 100%;
    background: linear-gradient(0deg, #ffffff 80%, #F3EEDA00 20%);
    z-index: 1;
    position: relative;
    border: none !important;
}

.project-data p {
    font-family: 'campton-semi-bold' !important;
    font-size: 1.2rem;
    position: relative;
    z-index: 10;
}

.project-data p.age, .project-data p.status {
    border: 2px solid black;
    padding: 5px 12px;
    text-align: center;
    min-width: 80px;
    border-radius: 500px;
    margin-bottom:0;
    /* margin-top: -15px; */
    height: 100%;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 45px;
}

p.age:empty {
    display: none;
}

.project-data .thema {
    position: relative;
}

.project-image img {
    width: 100%;
    max-height: 250px;
    object-fit: cover;
}

#project-overzicht .col-md-4:nth-of-type(even) .project-image img,
.single-team .project-cards .col-md-4:nth-of-type(even) .project-image img
 {
    clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);
    -webkit-clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);    
}

#project-overzicht .col-md-4:nth-of-type(odd) .project-image img,
.single-team .project-cards .col-md-4:nth-of-type(odd) .project-image img
 {
    clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
    -webkit-clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
}

.project-tekst {
    padding: 10px 20px 20px 20px; 
}

.project-tekst p {
    font-size: 1.6rem;
    margin-top: 5px;
    margin-bottom: 40px
}

/* projecten filter */

.searchandfilter ul {
    padding-left: 0;
}

.col-md-12.filters-wrapper {
	position: relative;
    padding: 85px 75px !important;
    padding-right: 125px !important;
}

.filters form ul li.sf-field-taxonomy-thema ul {
    display: flex;
    margin-top: 120px;
    margin-bottom: 80px;
}

.filters form ul li.sf-field-taxonomy-thema label {
    font-family: 'campton-semi-bold' !important;   
    font-size: 1.8rem;
    position: relative;
    z-index: 100;
}

.filters form ul li.sf-field-taxonomy-thema li {
    position: relative;
    margin-right: 75px;
    /* padding-right: 100px; */
}

.filters [type="checkbox"]:checked + label:before, 
.filters [type="checkbox"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    top: -5px;
    right: -40px;
    height: 11px;
    width: 11px;
    border: 1px solid #000;
    border-radius: 100%;
    background: none;
}

.filters [type="checkbox"]:checked + label:after, 
.filters [type="checkbox"]:not(:checked) + label:after {
    content: '';
    width: 11px;
    height: 11px;
    position: absolute;
    background: none;
    top: -5px;
    right: -40px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.filters [type="checkbox"]:checked + label:after, 
.filters [type="checkbox"]:checked + label:before {
    background: #000;
}

/* .filters input[value="gezondheid"]:checked + label:before, 
.filters input[value="gezondheid"]:checked + label:after,
.filters input[value="gezondheid"]:not(:checked) + label:before,
.filters input[value="gezondheid"]:not(:checked) + label:after {
    top: 35px;
} */

.filters [value="thuis"]:checked + label:before, 
.filters [value="thuis"]:not(:checked) + label:before {
    border: 1px solid #fff;
}

.filters [value="thuis"]:checked + label:after, 
.filters [value="thuis"]:checked + label:before {
    background: #fff;
}

.filters form ul li.sf-field-taxonomy-thema li.sf-level-0:after {
    position: absolute;
    z-index: 1;
    bottom: -10px;
    left: -3px;
    min-width: 170px;
}

.filters form ul li.sf-field-taxonomy-thema li.sf-level-0:hover:after {
    bottom: 0px;
    transition: bottom 0.2s ease-in; 
}

.filters li.sf-level-0:hover [type="checkbox"]:checked + label:before, 
.filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:before,
.filters li.sf-level-0:hover [type="checkbox"]:checked + label:after, 
.filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:after {
    top: -25px;
    transition: top 0.2s ease-in; 
}

.filters form ul li.sf-field-taxonomy-thema label.sf-label-checkbox {
    width: 100px;
    color: transparent;
    font-size: 1px;
}

.filters form ul li.sf-field-taxonomy-thema li.sf-level-0 {
    position: relative;
}

.filters form ul li.sf-field-taxonomy-thema li.sf-item-10:after {
    content: url('images/themas/beschermende-factoren.svg');
}

.filters form ul li.sf-field-taxonomy-thema li.sf-item-11:after {
    content: url('images/themas/maatschappelijke-problemen.svg');
}

.filters form ul li.sf-field-taxonomy-thema li.sf-item-20:after {
    content: url('images/themas/gezondheid.svg');
}

.filters form ul li.sf-field-taxonomy-thema li.sf-item-19:after {
    content: url('images/themas/thuis.svg');
}

.filters form ul li.sf-field-taxonomy-thema li.sf-item-18:after {
    content: url('images/themas/mentale-uitdagingen.svg');
}

.filters form ul li.sf-field-taxonomy-thema li.sf-item-21:after {
    content: url('images/themas/beleid.svg');
}

/* #project-overzicht h4:last-of-type {
    display: inline;
} */

.searchandfilter ul li.sf-field-post-meta-doelgroep, 
.searchandfilter ul li.sf-field-post-meta-age,
.searchandfilter ul li.sf-field-post-meta-focus,
.searchandfilter ul li.sf-field-taxonomy-expertise {
    display: inline;
}

.searchandfilter select.sf-input-select {
    border: 1px solid #000;
    font-size: 1.8rem;
    border-radius: 0.25rem;
    font-family: 'campton-book' !important;
    margin-left: 60px;
    padding: 10px;
    background-color: #fff;
    min-width: 300px;
}

 select.sf-input-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;       /* Remove default arrow */
    /* background: url('images/arrowdown.svg') 90% / 15% no-repeat; */
 }

 select.sf-input-select:focus {
    outline: none;
    border: 1px solid #A28FFF;
 }

 .searchandfilter ul li.sf-field-post-meta-doelgroep label,  
 .searchandfilter ul li.sf-field-post-meta-age label,
 .searchandfilter ul li.sf-field-taxonomy-expertise label,
 .searchandfilter ul li.sf-field-post-meta-focus label {
     position: relative;
 }

 .searchandfilter ul li.sf-field-post-meta-doelgroep label::after, 
  .searchandfilter ul li.sf-field-post-meta-age label::after,
  .searchandfilter ul li.sf-field-taxonomy-expertise label::after,   
  .searchandfilter ul li.sf-field-post-meta-focus label::after {
    content: url('images/arrowdown.svg');
    right: 30px;
    position: absolute;
    bottom: 15px;
    pointer-events: none;
}

/* Projecten single */
div#single-project {
    overflow: hidden;
}

.container-fluid.single-project {
    padding-right: 0px;
    padding-left: 0px; 
    background-color: #F3EEDA;
    position: relative;
    overflow: hidden;
}

.single-project .titel {
    padding:0px;
    margin-top: -40px;
}

.single-project .blok-titel .project-data {
    padding-left: 80px;
}

.single-project .project-data .age,
.single-project .project-data .doelgroep {
    margin-left: 15px;
    margin-bottom: 0px;
}

.single-project div.row.project {
    padding-top: 100px;
}

.single-project .col-md-8 {
    padding-left: 80px;
    padding-right: 80px;
}

.single-project .col-md-4 {
    padding-right: 60px;
}

.single-project .col-md-12, .single-project .team-card {
    padding-left: 80px;
}

.single-project .team-card {
    padding-bottom: 80px;
}

.single-project .team-card .team-info {
    margin: 0px;
    margin-left: 20px;
}

.single-project .team-card .team-info p{
    margin: 0px;
}

.single-project .thema {
    display: flex;
    align-items: baseline;
}

.single-project .thema img {
    max-width: 100px;
    padding-right: 10px;
    width: 100%;
}

.single-project .btn-black {
    margin-top: 20px;
}

.single-project h3 {
    font-size: 2.5rem;
}

.titel + .project-data {
    padding-left: 0px;
}
 
/* TEAM */
.container-fluid#team {
    background-color: #F2EDD9;
    padding-left: 80px;
    padding-right: 80px;
    position: relative;
    overflow: hidden;
}

#team .intro-tekst {
    margin-top: 80px;
    font-size: 2.6rem;
    font-family: 'campton-semi-bold' !important;
}

#team .filters {
    padding-top: 80px;
}

#team .filters h4 {
    font-size: 2.6rem;
    display: inline;
    margin: 0;
    padding: 5px 0 10px;
}

.team-cards {
    padding-top: 80px;
    margin-right: -80px;
}

p.p-results {
    /* padding-bottom: 80px; */
}

p.adres {
    margin-top: 10px;
}

.team-card img {
    width: 100%;
    height: auto;
    clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%);
    -webkit-clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%);    
}

.team-image {
    width: 100%;
    height: auto;
    clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%);
    -webkit-clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%);
}

.team-image:not(:hover), .hero-image {
    background-color:    #fff;
    display:             flex;
    flex:                1 1 100%;
    height:              100%;
    overflow:            hidden;
    padding:             0%;
    position:            relative;
    width:               100%;
  }

  .team-image:not(:hover) {
    height: auto; 
    clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%);
    -webkit-clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%);
  }
  
  .team-image:not(:hover) img, .hero-image img {
    filter:              grayscale(100%) contrast(1) blur(0px);
    flex:                1 0 100%;
    height:              100%;
    mix-blend-mode:      luminosity;
    object-fit:          cover;
    opacity:             1;
    width:               100%;
  }

  .team-image:not(:hover) {
    position:            relative;
  }
  
  .team-image:not(:hover)::before, .hero-image::before {
    background-color:    #54726D;
    bottom:              0;
    content:             '';
    height:              100%;
    width:               100%;
    left:                0;
    mix-blend-mode:      overlay;
    position:            absolute;
    right:               0;
    top:                 0;
    z-index:             1;
  }
  

.team-card a{
    color: #000;
}

.team-card a:hover{
    color: #000;
    text-decoration: none;
}

.team-card {
    padding-right: 80px !important;
}

.team-card .team-info {
    margin-top: 48px;
    margin-bottom: 90px;
}

.team-card h4 {
    font-size: 2rem;
    position: relative;
    margin-bottom: 40px;
    line-height: 1.2;
}

.team-card h4:after {
    content: url('images/streepje-paars-klein.svg');
    position: absolute;
    left: 0px;
    bottom: -20px;
}

.team-card p {
    font-size: 2rem;
}

.team-card p.expertise {
    font-family: 'campton-bold' !important;
}

/* TEAM SINGLE */

.container-fluid#team-single {
    /* background-color: #F2EDD9; */
    position: relative;
    padding: 0px;
}

.single-team h1 {
    margin-top: 120px;
}

.single-team blockquote p {
    color: #194E46;
    font-size: 2.4rem;
    margin-top: 30px;
    margin-bottom: 30px;
    font-family: 'campton-semi-bold' !important;
}

blockquote span.spreker {
    font-family: 'campton-book' !important;
}

.single-team .info-team {
    padding-bottom: 120px;
    padding-left: 80px;
    padding-right: 80px;
    background-color: #F3EEDA;
}

.single-team .team-card {
    margin-top: 120px;
}

.single-team .project-cards {
    padding-top: 100px;
    background-color: #D8F6F8;
    padding-bottom: 120px;
    position: relative;
    overflow: hidden;
}

.single-team .project-cards h2 {
    font-size: 4rem;
    margin-bottom: 60px;
}

.single-team .project-cards .project-card {
    height: 100%;
    background: linear-gradient(0deg, #ffffff 50%, #d8f6f800 50%);
}

.single-team .project-data img {
    max-width: 120px;
}


.row.link {
    padding: 40px 80px;
    background-color: #194E46;
}

.row.link .btn {
    padding: 0;
}

.row.link .btn svg {
    margin-left: 0px;
}

.row.link a.btn {
    color: white;
    font-size: 3rem;
    font-family: 'campton-bold' !important;
}

.row.link .btn:hover svg {
    margin-left: -20px;
    margin-right: 20px;
}

.single-team .col-md-8, 
.single-team .col-md-4 {
    z-index: 1;
}

/* Blok Projecten */
.container-fluid#projecten {
    z-index: 100;
    position: relative;
    background-color: #fff;
}

/* Wat wij doen */

.container-fluid#wat-wij-doen {
    padding-right: 0px;
    padding-left: 0px;
    overflow: hidden;
}

#wat-wij-doen .col-md-6 {
    padding-top: 140px;
    padding-bottom: 140px;
    position: relative;
}

#wat-wij-doen .col-md-6:last-of-type {
    background-color: #1C4D44;
    background-image: url('images/dots-grey.svg');
}

#wat-wij-doen .col-md-6:first-of-type {
    padding-left: 80px;
}

#wat-wij-doen p {
    padding-right: 45px;
}

.arrow {
    position: absolute;
    width: 0px;
    height: 0px;
    border-top: 36px solid transparent;
    border-left: 29px solid #fff;
    border-bottom: 36px solid transparent;
    top: 0;
    left: -1px;
    bottom: 0;
    margin: auto;
}

.tags {
    color: white;
    font-size: 4rem;
    font-family: 'campton-semi-bold' !important;
    line-height: 1.5;
}

.tags div:not(:last-of-type) {
    padding-bottom: 35px;
}

#wat-wij-doen .blok-titel {
    position: relative;
}

#wat-wij-doen .blok-titel:after {
    content: url('images/schuin-geel.svg');
    position: absolute;
    top: -77px;
    left: -85px;
    z-index: -1;
}

/* Actualiteit */
.container-fluid#actualiteit {
    padding-right: 0px;
    padding-left: 0px;
    background-color: #A28FFF;
}

#actualiteit .col-md-6 {
    position: relative;
}

#actualiteit .col-md-6 {
    padding-left: 80px;
    padding-top: 140px;
    padding-bottom: 140px;
    padding-right: 80px;

}

#actualiteit p {
    padding-right: 45px;
}

#actualiteit .normal-image img {
    width: 100%;
    height: auto;
    clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);
    -webkit-clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);
}


/* Doe mee */
.container-fluid#doe-mee {
    padding-right: 0px;
    padding-left: 0px;
    background-color: #F2EDD9;
    overflow: hidden;
}

#doe-mee .col-md-6 {
    position: relative;
}

#doe-mee .col-md-6:first-of-type {
    padding-left: 80px;
    padding-top: 140px;
    padding-bottom: 140px;
}

#doe-mee p {
    padding-right: 45px;
}

#doe-mee .hero-image {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 24% 100%, 4% 85%, 2% 51%, 4% 27%);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 24% 100%, 4% 85%, 2% 51%, 4% 27%);
    position: relative;
}

#doe-mee .col-md-6:last-of-type:after {
    content: url('images/schuin-rood-3.svg');
    position: absolute;
    top: 100px;
    left: -85px;
    opacity: 1;
    z-index: 1;
    mix-blend-mode: multiply;
}


/* Meedoen */
.container-fluid#mee-doen {
    padding-right: 80px;
    padding-left: 80px;
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: #194E46;
    color: #fff;
}

#mee-doen h2 {
    font-size: 4rem;
}

#mee-doen h4 {
    font-size: 2.6rem;
    position: relative;
    padding-bottom: 30px;
}

#mee-doen h4:after {
    position: absolute;
    content: url("images/streepje-paars-klein.svg");
    left: 0;
    top: 24px;
}

#mee-doen p {
    margin-bottom: 60px;
}



/* Algemeen - intro */
.container-fluid#intro {
    padding: 0px;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    min-height: 350px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
}

.overview {
    position: absolute;
    bottom: 15px;
    left: 60px;
}

.container-fluid#intro.intro-mob {
    display: none !important;
}

.container-fluid#intro .titel {
    background-color: unset;
}

#intro h1 {
    position: relative;
    margin: 0;
}

#intro h1::after {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    bottom: -40px;
}

#intro .licht h1 {
    color: #fff;
}


#intro .licht h1::after {
    content: url('images/streepje-wit.svg');
}

#intro .donker h1 {
    color: #000;
}

#intro .donker h1::after {
    content: url('images/streepje-zwart.svg');
}

/* Algemeen */
.page-template-general {
    background-color: #F2EDD9;
}

.page-template-general h1 {
    margin-top: 0px;
}

.page-template-general footer {
    margin-top: 80px;
}

.block.accordeon + footer {
    margin-top: 0px;
}

.content h2 {
    font-size: 4rem;
    line-height: 1.2;
    margin-bottom: 20px;
    padding-right: 20px;
}

.content h3 {
    font-family: 'campton-bold' !important;
    margin-bottom: 30px;
    margin-top: 30px;
}

.content .more h3 {
    margin-top: 5px;
}

#accordeon h3 {
    margin-top: 0px;
}

.content .project-tekst h3 {
    font-size: 2rem;
    margin-top: 10px;
    margin-bottom: 10px;
}

.content p img {
    width: 100%;
    height: auto;
    margin-top: 40px;
    margin-bottom: 40px;
    /* clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
    -webkit-clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%); */
}

.indicates-required {
    display: none;
}

/* Wanneer er twee afbeeldingen na elkaar staan dan worden ze naast elkaar gezet */
.content p img:nth-last-of-type(2), .content p img + img, .content p img + noscript + img {
    width: 48%;
    height: auto;
    margin-top: 40px;
    margin-bottom: 40px;
}
.content p img + img, .content p img + noscript + img {
    margin-left: 3%;
}

.content p strong, .intro-tekst p {
    font-size: 2.6rem;
    line-height: 1.2;
    font-weight: normal;
    margin-bottom: 15px;
    margin-top: 50px;
    display: block;
    font-family: 'campton-semi-bold' !important;
}

.content p span strong {
    display: none;
}

.content p {
   margin-bottom: 20px;
}

.content p a {
    text-decoration: underline;
}

.content p a.btn {
    text-decoration: none;
}

.content p a.button {
    padding: 12px 18px;
    font-size: 1.8rem;
    line-height: 1.3;
    background-color: #000;
    color: #fff;  
    text-decoration: none; 
    border-radius: .25rem;
}

.content p a.button:after {
    content: url('images/arrow-right-white.svg');
    margin-left: 15px;
    vertical-align: bottom;
    transition: margin 0.2s ease-in;
}

.content p a.button:hover:after {
    margin-left: 20px;
    margin-right: -5px;
    transition: margin 0.2s ease-out;

}

.content p a.button:hover {
    color: #fff;
    text-decoration: none;
}

.content div.wp-video {
    margin-top: 50px;
    margin-bottom: 50px;
 }

.modal  .blok-titel h2 {
    margin-bottom: 30px !important;
}

 .mejs-overlay-button {
    background: url('images/mejs-controls.svg') no-repeat !important;
    background-position: 0 -39px !important;
    height: 80px !important;
    width: 80px !important;
 }

.mejs-overlay:hover>.mejs-overlay-button {
    background-position: -80px -39px !important;
}

.content blockquote p {
    color: #A28FFF;
    font-family: 'campton-bold' !important;
    font-size: 2.6rem;
    line-height: 1.4;
    margin-top: 30px;
    margin-bottom: 30px;
}

.content ul li {
    font-family: 'campton-semi-bold' !important;
    font-size: 3rem;
}


/* Algemeen - intro */
.container-fluid#sectie {
    padding: 0px;
    padding-top: 100px;
    padding-left: 80px;
    padding-right: 80px;
}

/* Algemeen - image */

.container-fluid#image {
    padding-left: 80px;
    padding-right: 80px;
    padding-top: 100px;
    position: relative;
    overflow: hidden;
}

#image img {
    width: 100%;
    max-height: 600px;
    object-fit: cover;
    clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
    -webkit-clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
}

/* Algemeen wysiwug */

.container-fluid#wysiwyg {
    padding-left: 280px;
    padding-right: 280px;
    padding-top: 100px;
    position: relative;
    overflow: hidden;
}

#wysiwyg .content blockquote p {
    color: #FF7256;
}

/* Image x2 */

.container-fluid#imagex2 {
    padding-top: 100px;
    padding-left: 80px;
    padding-right: 50px;
    overflow: hidden;
}

#imagex2 .col-md-6 {
    padding-right: 30px;
}

#imagex2 .col-md-6 img {
    width: 100%;
    height: 400px;
    object-fit: cover;
}

#imagex2 .col-md-6:first-of-type img {
    clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
    -webkit-clip-path: polygon(75% 0, 75% 6%, 100% 6%, 100% 100%, 0 100%, 0% 60%, 0 3%);
}

#imagex2 .col-md-6:nth-of-type(2) img {
    clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);
    -webkit-clip-path: polygon(100% 0, 100% 93%, 78% 93%, 78% 100%, 0 100%, 0% 60%, 0 0);
}

/* Quote */

.container-fluid#quote {
    padding: 0px;
    margin-top: 100px;
    clip-path: polygon(100% 0, 100% 92%, 90% 100%, 0 100%, 0 7%);
    -webkit-clip-path: polygon(100% 0, 100% 92%, 90% 100%, 0 100%, 0 7%);
}

.block.quote {
    overflow: hidden;
}

#quote .col-md-12 {
    height: 700px;
    padding-left: 280px;
    padding-right: 280px;
}

#quote .col-md-12.Licht {
    color: #fff;
    font-family: 'campton-semi-bold' !important;
}

#quote p {
    position: absolute;
    bottom: 80px;
}

/* Twee kolommen */

.container-fluid#twee-kolommen {
    margin-top: 100px;
    padding-left: 80px;
    padding-right: 80px;
    overflow: hidden;
}

#twee-kolommen h3 {
    font-size: 2.4rem;
    font-family: 'campton-semi-bold' !important;
    margin-bottom: 20px;
}

#twee-kolommen .col-md-6:last-of-type {
    padding-left: 20px;
}

#twee-kolommen .col-md-6:first-of-type {
    padding-right: 20px;
}

/* Intro tekst */
.container-fluid#intro-tekst {
    background-color: #194E46;
    padding: 100px 80px;
    color: #fff;
    position: relative;
    overflow: hidden;
}

/* Accordeon */

.container-fluid#accordeon {
    padding: 0px;
    overflow: hidden;
}

div.accordion-toggle {
    color: #000;
    cursor: pointer;
    width: 100%;
    text-align: left;
    position: relative;
    text-transform: none;
}

div.accordeon-item {    
    padding: 80px 80px;
    min-height: auto;
    overflow: hidden;
}

div.accordeon-item:nth-of-type(even) {
    background-color: #FFFFFF;
}

div.accordeon-item .col-md-5 {
    padding-right: 40px;
}

#accordeon h3 {
    font-size: 4rem;
    position: relative;
}

#accordeon h3:after {
    content: url('images/streepje-paars.svg');
    position: absolute;
    left: 0;
    bottom: -30px;
}

#accordeon .read-more {
    font-family: 'campton-semi-bold' !important;
    margin-top: 40px;
}

.accordion-toggle svg.plus {
    margin-top: 35px;
}

.accordion-content {
    height: 0;
    transition: height 0.3s ease;
}

.accordion-content.collapse.show {
    height: 100%;
    transition: height 0.6s ease;
}

.accordion-toggle .row .col-lg-6 {
    padding-left: 0px;
    padding-right: 0px;
}

.accordion-toggle .row .col-lg-6:nth-of-type(odd) {
    padding-left: 7px;
}

.accordion-toggle .row .col-lg-6:nth-of-type(even) {
    padding-right: 7px;
}

.accordion-toggle:not(.collapsed) svg.plus{
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
    transition: all 0.3s ease;
}

.accordion-toggle.collapsed svg.plus{
    -webkit-transform:rotate(0deg);
    -moz-transform:rotate(0deg);
    -o-transform:rotate(0deg);
    transform:rotate(0deg);
    transition: all 0.3s ease;
}

.accordion-toggle.collapsed span.more-or-less {
    display: none;
}

.accordion-toggle.collapsed .read-more:after {
    content: "meer";
}

.accordion-content .project-card {
    margin-top: 30px;
    height: 100%;
    background: linear-gradient(0deg, #ffffff 80%, #d8f6f800 20%);
}

.accordion-content .project-tekst {
    padding: 0px 10px 20px 10px;
}

.accordion-content .project-data {
    padding-left: 10px;
    padding-right: 10px;
}

.accordion-content .project-tekst p {
    margin-top: 30px;
}

.accordion-content .project-data img {
    max-width: 100px;
}

#accordeon .project-tekst h3:after {
    display: none;
}

#accordeon .project-tekst h3 {
    font-size: 3rem;
    line-height: 1.2;
}

.accordion-content .project-data p.age, 
.accordion-content .project-data p.status {
    margin-bottom: 0px;
    margin-left: 10px;
    padding: 8px 5px;
}

.accordion-content .btn-abs {
    left: 10px;
}

/* Partners */

#partners .blok-titel h2{
    padding-top: 80px;
    font-size: 4rem;
}

.row.partners {
    padding-left: 260px;
    padding-right: 260px;
    padding-bottom: 40px;
    padding-top: 10px;
    justify-content: center;
}

.row.partners .col-4 {
    display: flex;
    align-items: center;
    justify-content: center;
}

.row.partners img {
    padding: 5px;
    padding-bottom: 80px;
    max-width: 150px;
    height: auto;
}

/* Newsletter Modal */
.modal.show .modal-dialog {
    margin: auto;
    margin-top: 120px;
    max-width: 800px;
}

#newsletter.modal.show .modal-dialog {
    max-width: 500px;  
}

.modal-content {
    padding: 30px;
    background-color: #A28FFF;
    color: #000;
    min-height: 500px;
}

#mc_embed_signup form {
    background-color: #A28FFF;
}

#mc_embed_signup .mc-field-group label {
    font-family: 'campton-semi-bold' !important;
    font-size: 1.8rem !important;
    margin-bottom: 8px !important;
}

#mc_embed_signup h2 {
    font-size: 3rem !important;
    margin: 20px 0 30px 0 !important;
}

#mc_embed_signup .mc-field-group input {
    border: none;
    padding: 5px;
    font-family: 'campton-book' !important;
} 

#mc_embed_signup .mc-field-group.input-group ul {
    margin-left: 0px !important;
}

#mc_embed_signup .mc-field-group.input-group label {
    margin-left: 10px !important;
    font-family: 'campton-book' !important;
}

.mc-field-group.input-group strong {
    font-family: 'campton-semi-bold' !important;
    font-size: 1.8rem !important;
    margin-top: 15px;

}

#mc_embed_signup input:focus {
    outline: none;
}

.modal-content svg.plus {
    float: right;
    height: 20px;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
    transition: all 0.3s ease;
}
.modal-content svg.plus:hover {
    -webkit-transform:rotate(135deg);
    -moz-transform:rotate(135deg);
    -o-transform:rotate(135deg);
    transform:rotate(135deg);
    transition: all 0.3s ease;
}

/* Mededelingen modal */

.modal#mededeling {
    margin-bottom: 50px;
}

#mededeling .modal-content {
    position: relative;
    overflow: hidden;
}

#mededeling #mededelingblok .col-md-6:first-of-type {
    padding-right: 20px;
}

#mededeling #mededelingblok .col-md-6:last-of-type {
    padding-left: 20px;
}

#mededeling #mededelingblok .col-md-6 {
    padding-left: 40px;
    padding-top: 0px;
    padding-bottom: 40px;
    padding-right: 40px;
}

#mededeling .col-md-12.mededelingtitel {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
}

#mededeling .col-md-12.content {
    padding-left: 40px;
    padding-right: 40px;
}

#mededeling .content blockquote p {
    color: #194E46;
}

#mededeling.modal.show .modal-dialog {
    max-width: 1000px;
}

#mededeling .modal-content {
    background-color: #F3EEDA;
}


/* Search modal */

#search .searchandfilter ul li {
    display: inline;
    padding: 0px;
}

#search .searchandfilter ul {
    margin-top: 80px;
}

#search li.sf-field-submit {
    float: right;
}

#search .searchandfilter label {
    width: calc(100% - 160px);
}

#search input.sf-input-text {
    border: none;
    color: white;
    background-color: #a28fff;
    font-family: 'campton-semi-bold' !important;
    font-size: 4rem;
    border-bottom: 1px solid #fff;
    width: 100%;
}

#search input.sf-input-text:focus {
    outline: none;
}

#search input.sf-input-text::placeholder {
    border: none;
    color: white;
}

#search input[type="submit"] {
    background-color: #fff;
    color: #000;
    padding: 17px 36px;
    font-size: 1.8rem;
    line-height: 1.3;
    font-family: 'campton-semi-bold' !important;
    border: none;
}

#search p small,
#search p img, 
#search p br,
#search hr {
    display: none;
}

#search h2, #search p {
    font-size: 1.8rem;
}

#search h2 {
    margin-top: 40px;
    text-decoration: underline;
}

#search a:hover {
    color: #D8F6F8;
}

#search .pagination .btn {
    margin-top: 40px;
    margin-right: 30px;
}

#search .pagination .btn a:hover {
    color: #fff;
}

#search .p-results {
    margin-top: 40px;
}

#project-overzicht .p-results {
    /* margin-bottom: 40px; */
}

.pagination {
    margin-bottom: 40px;
}

.projecten-acc {
    margin-top: 20px;
    margin-bottom: 20px;
}

.intro-mob {
    display: none !important;
    background-image: url(https://www.garage2020.nl/wp-content/uploads/2020/09/Header_vierkant_paars.png);
}

.intro-desk {
    display: block !important;
    background-image: url(https://www.garage2020.nl/wp-content/uploads/2020/09/Header_paars2_VDEF.png);
}

@media only screen and (min-width: 1600px) {
    
    .filters form ul li.sf-field-taxonomy-thema li.sf-level-0 {
        margin-right: 80px;
    }
    .project-data p.age, .project-data p.status {
        margin-right: 20px;
    }

    .col-xxl-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .filters form ul li.sf-field-taxonomy-thema ul {
        justify-content: start !important;
    }

    /** Start 120px margin **/
    #header {
        padding: 0px 120px;
    }

    nav#menu {
        padding-right: 120px;
    }

    #hero .col-md-6:first-of-type,
    #wat-wij-doen .col-md-6:first-of-type,
    #doe-mee .col-md-6:first-of-type {
        padding-left: 120px;
    }

    #actualiteit .col-md-6,
    #projecten-recent ul.themas,
    #projecten-recent .row.project-cards,
    footer .container-fluid,
    .container-fluid#sectie,
    .container-fluid#image,
    .container-fluid#twee-kolommen,
    .container-fluid#team {
        padding-right: 120px;
        padding-left: 120px;
    }

    .row.project-cards {
        padding-left: 120px;
        padding-right: 90px;
    }

    .col-md-12.filters-wrapper {
        padding: 85px 120px !important;
    }


    .container-fluid#imagex2 {
        padding-left: 120px;
        padding-right: 90px;
    }

    .container-fluid#intro-tekst,
    div.accordeon-item {
        padding: 80px 120px; 
    }

    .container-fluid#intro-tekst:after {
        top: 100px;
    }

    .row.footer-top {
        height: 300px;
        padding-top: 60px;
        padding-bottom: 60px;
    }


}

@media only screen and (max-width: 1200px) {
     
    html, body {
            font-size: 55%;
        }
    
    .accordion-content .project-data img {
        max-width: 64px;
    }
    
    .accordion-content .project-data p.age, .accordion-content .project-data p.status {
        padding: 5px;
    }

.filters form ul li.sf-field-taxonomy-thema li.sf-level-0:after {
    transform: scale(0.8);
    left: -20px;
    bottom: -16px;
}

.social {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}


 .filters [type="checkbox"]:checked + label:after, 
.filters [type="checkbox"]:not(:checked) + label:after,
.filters [type="checkbox"]:checked + label:before,
.filters [type="checkbox"]:not(:checked) + label:before {
        top: -12px;
    right: 0px;
} 


.filters form ul li.sf-field-taxonomy-thema li.sf-level-0:hover:after {
    bottom: -12px;
} 

.filters li.sf-level-0:hover [type="checkbox"]:checked + label:before, 
.filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:before,
.filters li.sf-level-0:hover [type="checkbox"]:checked + label:after, 
.filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:after {
    top: -16px; 
}

#project-overzicht .thema img {
    max-width: 70px;
}

.project-data p.age, .project-data p.status {
    padding: 5px 5px;
    margin-left: 10px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    min-height: 31px;
}

.project-data p {
    font-size: 1.3rem;
}

.single-project .thema img {
    max-width: 80px;
}

.single-project .project-data .age,
.single-project .project-data .status {
    margin-left: 10px;
    margin-bottom: 0px;
}


.row.partners {
    padding-left: 150px;
    padding-right: 150px;
}

.titel {
    padding-top: 30px;
    padding-bottom: 30px;
}
    
    .container-fluid#intro {
        min-height: 250px;
    }

}

@media only screen and (max-width: 1024px) {

    .searchandfilter select.sf-input-select {
        margin-left: 10px;
    }
    
    html, body {
        font-size: 50%;
    }

    .social a {
        padding-left: 20px;
    }
    
    #project-overzicht .thema img {
        max-width: 60px;
    }

    p.status {
        display: none !important;
    }
}

/* @media only screen and (max-width: 785px) {
    
    html, body {
        font-size: 62.5%;
    }
} */


@media only screen and (max-width: 992px) {

    #projecten-recent ul.themas li img {
        min-width: auto;
    }

    #projecten-recent ul.themas li {
        padding: 10px;
    }

    nav ul {
        display: block;
    }

    .mobile-l {
        display: block !important;
    }
    
    .overview {
        left: 25px;
    }
    
    .single-project .titel {
        margin-top: -80px;
    }
    
    .current-menu-item a  {
        border: none;
    }
    
    .accordion-content .project-data img {
        max-width: 100px;
    }
    
	li:hover > a.dropdown-item::after {
		display: none;
	}

    a.nav-link,
	a.dropdown-item {
		/* display: block; */
		color: #fff;
		font-size: 3rem;
		padding: 8px 18px;
    }

	a.dropdown-item {
		font-size: 2.25rem;
		padding: 12px 18px 12px 38px;
    }

	li:hover > a.dropdown-item,
	a.dropdown-item:focus,
	a.dropdown-item:hover {
	color: #fff;
	}
	
	li:hover a.nav-link, 
	a.nav-link:focus, 
	a.nav-link:hover {
		border: none;
		color: #fff;
	}


	.menu-item > a:focus,
	.menu-item > a:hover {
		opacity: 0.5;
	}
    
	nav ul li {
		padding: 0;
	}


    nav ul li, .nav-wrapper, div#navbarNavDropdown {
        height: auto;
    }

    .nav.active {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
        width: 100vw;
        height: 100vh;
        background-color: #1C4D44;
        transition: background-color 0.2s linear;
    }


	


    .nav-wrapper.animated {
        display: block;
        justify-content: unset;
        align-items: unset;
		width: 100%;
    }

    nav ul#main-menu li {
        display: block;
        position: relative;
		width: 100%;
		border-bottom: 1px solid rgba(255,255,255,0.35);
    }

	nav ul#main-menu li:first-of-type {
		border-top: 1px solid rgba(255,255,255,0.35);
	}

    nav ul#main-menu li:after {
        display: none;
    }

    nav ul#main-menu {
        text-align: left;
		width: 100%;
    }

    nav#menu {
		width: 100%;
		padding-top: 100px;
		padding-right: 0px;
		align-items: unset;
    }

	.menu-item.has-community-image a {
		padding: 8px 0 8px 55px;
		background-color: transparent !important;
		border-radius: 0;
		background-position: 16px center;
	}



    button.toggle {
        background-image: url(images/burger.svg);
        z-index: 2;
        display: block;
        position: absolute;
        right: 40px;
        top: 40px;
        background-size: contain;
        background-repeat: no-repeat;
        width: 35px;
        height: 35px;
        border: none;
        cursor: pointer;
        background-color: transparent;
        /* transition: all 0.2s linear; */
    }

    button.toggle:focus {
        outline: none;
    }

    div.nav.col.active button.toggle {
        background-image: url('images/PLUS.svg');  
        top: 40px;
        right: 42px;        
        transform: rotate(45deg);
    }

    div.nav.col div#navbarNavDropdown {
        display: none;
    }

    div.nav.col.active div#navbarNavDropdown {
        display: block;
    }

    .menu-item-search {
        padding: 0px;
        position: absolute;
        top: 0px;
        right: 115px;
    }
    
    .nav.col.active .menu-item-search {
        height: auto;
    }

    .menu-item-search svg {
        height: 35px;
        width: 30px;
    }

    div.nav.col.active .menu-item-search svg path {
        stroke: #fff;
    }

    div.nav.col.active .menu-item-search {
        top: 40px;
        right: 115px;
    }

    div.nav.col.active img.logo {
        content: ""
    }









	#navbarNavDropdown > ul > li.menu-item-has-children span {
		position: absolute;
		right: 0;
		top: 0;
		text-align: center;
		transition: all 0.2s;
		width: 50px;
		height: 100%;
		background-image: url('images/arrowdown-white.svg');
		background-position: 10px 9px;
		background-size: 26px 26px;
		background-repeat: no-repeat;
		pointer-events: none;
	}


	#navbarNavDropdown > ul > li.menu-item-has-children span:hover {
		opacity: 0.5;
	}

	#navbarNavDropdown > ul > li.menu-item-has-children > a::after {
		display: none;
	}



	nav ul#main-menu li.show span,
	#navbarNavDropdown > ul > li.menu-item-has-children span.open {
		transform: rotate(180deg);
		transition: all 0.2s;
	}




	#navbarNavDropdown .dropdown-menu {
		max-height: 0;
		overflow: hidden;
		position: relative;
		background-color: #fff;
		margin: 0;
		padding: 0;
		border: none;
		opacity: 0;
	}

	.menu-item-has-children span {
		cursor: pointer;
	}

	#navbarNavDropdown .dropdown-menu.show,
	#navbarNavDropdown .dropdown-menu.open {
		max-height: unset;
		position: relative !important;
		transform: unset !important;
		opacity: 1;
		display: block;
		background-color: #37675c;
		width: 100%;
	}








    

    #hero .col-md-6:first-of-type {
        padding-left: 40px;
        padding-bottom: 100px;
    }

    #actualiteit .col-md-6 {
        padding: 80px 40px 80px 40px;
    }

    #projecten-recent ul.themas {
        padding-left: 40px;
        padding-right: 40px;
    }

    #projecten-recent .row.project-cards {
        padding-right: 40px;
        padding-left: 40px;
        padding-bottom: 100px;
    }

    .tags div {
        font-size: 3.2rem;
    }

    #wat-wij-doen .col-md-6:first-of-type {
        padding-left: 40px;
    }

    #wat-wij-doen .col-md-6 {
        padding-top: 100px;
        padding-bottom: 100px;
    }

    #doe-mee .col-md-6:first-of-type {
        padding-left: 40px;
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .social a {
        padding-left: 5px;
    }

    #projecten-recent ul.themas li:after {
        right: 50px;
        bottom: 16px;
    }

    #projecten-recent .project-data img {
        max-width: 80px;
    }

    .project-data p.age, .project-data p.status {
        padding: 5px 10px;
        font-size: 1.3rem;
    }

    .col-md-12.filters-wrapper {
        padding-left: 40px !important;
        padding-right: 50px !important; 
        overflow: hidden;
    }

    .row.project-cards {
        padding-left: 40px;
        padding-right: 20px;
    }

    .row.project-cards .col-md-4 {
        padding-right: 20px;
    }

    #project-overzicht .thema img {
        max-width: 64px;
    }  

    .project-data p.age, .project-data p.status {
        min-width: 60px;
        padding: 5px 3px;
    }

    .project-data {
        padding: 20px;
    }
    
    #intro .project-data {
        justify-content: center !important;
    }
    
    #intro .titel + .project-data {
        padding-left: 20px;
    }

    .single-project .thema img {
        max-width: 100px;
    }

    .project-tekst {
        padding: 0px 20px;
    }

    .single-project .project-data p.age,
    .single-project .project-data p.status {
        margin-left: 10px;
        padding: 5px 5px;
        min-width: 65px;
    }

    .single-project .col-md-12,
    .single-project .col-md-8 {
        padding-left: 40px;
        padding-right: 40px;
    }

    
    .single-project .project-card .btn {
        padding-bottom: 20px;
    }
    
    .single-project .col-md-4 {
        padding-right: 40px;
    }

    .single-project .team-card {
        padding-left: 40px;
        padding-right: 40px !important;
    }

    .container-fluid#mee-doen {
        padding-left: 40px;
        padding-right: 40px;
        padding-top: 80px;
        padding-bottom: 80px;
    } 

    .row.partners {
        padding-left: 40px;
        padding-right: 40px;
    }

    .container-fluid#wysiwyg {
        padding-left: 80px;
        padding-right: 80px;
    }

    .container-fluid#team-single:after {
        top: 100px;
    }

    .single-team .project-data img {
        max-width: 64px;
    }

    .container-fluid#intro-tekst:after {
        right: -200px;
    }

    .container-fluid#intro-tekst {
        padding: 80px 40px;
    }

    div.accordeon-item {
        padding: 80px 40px;
    }
    
    div.accorderon-item .col-md-5 {
        padding-right: 10px;
    }

    div.accorderon-item .col-md-7 {
        padding-left: 10px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-level-0:after {
        transform: scale(0.65);
        left: -30px;
        bottom: -20px;
    }
    
    
    .filters [type="checkbox"]:checked + label:after, 
    .filters [type="checkbox"]:not(:checked) + label:after,
    .filters [type="checkbox"]:checked + label:before,
    .filters [type="checkbox"]:not(:checked) + label:before {
        top: -10px;
        right: 19px;
    }
    
    
    .filters form ul li.sf-field-taxonomy-thema li.sf-level-0:hover:after {
        bottom: -12px;
    }
    
    .filters li.sf-level-0:hover [type="checkbox"]:checked + label:before, 
    .filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:before,
    .filters li.sf-level-0:hover [type="checkbox"]:checked + label:after, 
    .filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:after {
        top: -17px; 
    }

    div.accordeon-item .col-md-5 {
        padding-right: 40px;
        margin-bottom: 20px;
    }

    #projecten-recent .project-cards .has-project-card:nth-of-type(1):after {
        content: "";
    }

    #hero::after {
        bottom: -230px;
        left: 129px;
    }

}

@media only screen and (max-width: 855px) {
    #projecten-recent .project-tekst {
        padding: 20px 20px 40px 20px;
    }

    #projecten-recent .project-data {
        padding: 40px 20px;
    }
}

@media only screen and (max-width: 767px) {

    .social {
        display: block;
    }

    .m-hide {
        display: none !important;
    }

    .mobile {
        display: block !important;
    }

    #project-overzicht h4:last-of-type {
        display: block;
    }

    .searchandfilter ul li.sf-field-post-meta-doelgroep, .searchandfilter ul li.sf-field-post-meta-age, .searchandfilter ul li.sf-field-post-meta-focus, .searchandfilter ul li.sf-field-taxonomy-expertise {
        display: block;
    }

    .titel {
        padding-top: 40px;
        padding-bottom: 50px;
    }

    h1 {
        margin-top: 60px;
    }
    
    /* Home */
    #hero .col-md-6:last-of-type {
        height: 200px;
    }

    #hero .col-md-6:first-of-type {
        padding-left: 40px;
        padding-right: 40px;
        padding-bottom: 40px;
    }

    #hero .col-md-6:last-of-type::after {
        content: "";
    }

    #hero::before {
        top: 200px;
        left: 500px;
    }

    #hero .hero-image {
        clip-path: polygon(100% 0, 100% 74%, 88% 100%, 49% 100%, 17% 79%, 0 38%, 0 0);
        -webkit-clip-path: polygon(100% 0, 100% 74%, 88% 100%, 49% 100%, 17% 79%, 0 38%, 0 0);
    }

    #hero h1 {
        margin-top: 40px;
    }

    #actualiteit .col-md-6 {
        padding: 40px;
    }

    #actualiteit .col-md-6:last-of-type {
        padding-top: 80px;
    }

    #actualiteit .col-md-6:first-of-type {
        padding-bottom: 80px;
    }

    #projecten-recent h2 {
        margin-top: 80px;
        margin-bottom: 60px;
    }

    #projecten-recent ul.themas li:after {
        content: url('images/arrow-small.svg');
        transform: rotate(90deg);
        right: 29px;
        bottom: 23px;
    }

    #projecten-recent ul.themas li.thuis:after {
        content: url('images/arrow-small-white.svg');
    }

    #projecten-recent .project-cards .has-project-card:nth-of-type(1) .project-card::after {
        content: "";
    }

    #projecten-recent .project-cards .has-project-card:nth-of-type(1) .project-card::before {
        left: -100px;
    }

    #projecten-recent .row.project-cards {
        padding-left: 40px;
        padding-right: 40px;
    }

    /* #projecten-recent .project-cards .has-project-card:nth-of-type(1) {
        padding-right: 0px;
    }

    #projecten-recent .project-cards .has-project-card:nth-of-type(2) {
        padding-left: 0px;
    } */

    #projecten-recent .recent h2 {
        margin-bottom: 100px;
    }

    #projecten-recent .col-md-6 {
        margin-bottom: 40px;
    }

    #projecten-recent .project-tekst p {
        margin-bottom: 25px;
    }

    div#projecten-recent.horizontal-m {
        overflow-x: scroll;
    }

    li.sf-field-taxonomy-thema {
        overflow-x: scroll;
    }

    li.sf-field-taxonomy-thema ul {
        width: 113.33%
    }
    
    div#projecten-recent.horizontal-m .row {
        width: 133.33%;
    }

    #wat-wij-doen .col-md-6:first-of-type {
        padding-left: 40px;
        padding-right: 40px;
    }

    #wat-wij-doen .col-md-6 {
        padding-bottom: 80px;
        padding-top: 80px;
    }

    .arrow {
        top: -22px;
        left: -1px;
        bottom: unset;
        right: 0;
        transform: rotate(90deg);
    }
    
    #doe-mee .col-md-6:last-of-type {
        height: 200px;
    }

    #doe-mee .hero-image {
        clip-path: polygon(100% 0, 100% 45%, 88% 100%, 55% 100%, 30% 91%, 0 95%, 0 0);
        -webkit-clip-path: polygon(100% 0, 100% 45%, 88% 100%, 55% 100%, 30% 91%, 0 95%, 0 0);
    }

    #doe-mee .col-md-6:last-of-type:after {
        top: -50px;
        left: -200px;
        transform: scale(0.5);
    }

    #doe-mee .col-md-6:first-of-type {
        padding-top: 80px;
        padding-bottom: 80px;
        padding-left: 40px;
        padding-right: 40px;
    }

    .footer-bottom .footer-block {
        margin-bottom: 0px;
    }

    .social {
        padding-bottom: 40px;
    }

    .footer-menu ul {
        margin-top: 0;
        margin-block-end: 0;
        margin-block-start: 0;
    }

    .social a {
        padding-right: 25px;
        padding-left: 0px;
    } 

    .filters form ul li.sf-field-taxonomy-thema label.sf-label-checkbox {
        width: 80px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-level-0:after {
        transform: scale(0.45);
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-level-0:after {
        left: -46px;
        bottom: -16px
    }

    .filters [type="checkbox"]:checked + label:after, 
    .filters [type="checkbox"]:not(:checked) + label:after, 
    .filters [type="checkbox"]:checked + label:before, 
    .filters [type="checkbox"]:not(:checked) + label:before {
        height: 8px;
        width: 8px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-item-18:after,
    .filters form ul li.sf-field-taxonomy-thema li.sf-item-10:after {
        bottom: -20px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-item-11:after {
        bottom: -14px;
    }

    .filters [type="checkbox"]:checked + label:after, 
    .filters [type="checkbox"]:not(:checked) + label:after, 
    .filters [type="checkbox"]:checked + label:before, 
    .filters [type="checkbox"]:not(:checked) + label:before {
        top: -15px;
        right: 14px;
    }

    .filters li.sf-level-0:hover [type="checkbox"]:checked + label:before, 
    .filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:before,
    .filters li.sf-level-0:hover [type="checkbox"]:checked + label:after, 
    .filters li.sf-level-0:hover [type="checkbox"]:not(:checked) + label:after {
        top: -19px; 
    }

    .filters form ul li.sf-field-taxonomy-thema ul {
        margin-top: 80px;
        margin-bottom: 40px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-level-0:hover:after {
        bottom: -12px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-item-18:hover:after,
    .filters form ul li.sf-field-taxonomy-thema li.sf-item-10:hover:after {
        bottom: -16px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-item-11:hover:after {
        bottom: -10px;
    }

    .searchandfilter select.sf-input-select {
        margin-left: 0px;
    }

    #project-overzicht h4 {
        font-size: 2rem;
    }

    .searchandfilter select.sf-input-select {
     font-size: 2rem;
     padding: 5px 10px;
    }

    .col-md-12.filters-wrapper {
        padding: 40px 40px !important; 
    }

    .filters input[type=checkbox], 
    .filters input[type=radio] {
        display: none;
    }

    .project-data p.age, 
    .project-data p.status {
        margin-top: 0px;  
        margin-left: 20px;      
    }

    .single-project div.row.project {
        padding-top: 80px;
    }

    .single-project .col-md-4 {
        padding-right: 40px;
        padding-left: 40px;
    }

    .single-project .col-md-12 h3 {
        margin-top: 80px;
    }

    .row.partners img {
        width: 100%;
    }

    .footer-menu ul li {
        margin-bottom: 8px;
    }

    .container-fluid#sectie {
        padding-left: 40px;
        padding-right: 40px;
        overflow: hidden;
    }

    .content h2 {
        margin-bottom: 80px;
    }

    .container-fluid#image,
    .container-fluid#imagex2,
    .container-fluid#twee-kolommen {
        padding-left: 40px;
        padding-right: 40px;
        padding-top: 40px;
    }

    .container-fluid#twee-kolommen {
        margin-top: 40px;
    }

    .container-fluid#wysiwyg {
        padding-left: 40px;
        padding-right: 40px;
    }

    #imagex2 .col-md-6:first-of-type img {
        margin-bottom: 40px;
    }

    #quote .col-md-12 {
        padding-left: 40px;
        padding-right: 40px;
    }

    #menu-over-ons {
        padding-inline-start: 0px;
    }

    .container-fluid#team {
        padding-left: 40px;
        padding-right: 40px;
    }

    .team-card a {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .team-card .team-info {
        padding-left: 20px;
        min-width: 50%;
        margin: 0px;
    }
    
    .team-image {
        margin: 40px;
        margin-left: 0px;
    }

    .container-fluid#team:after {
        content: "";
    }

    .team-card {
        padding-right: 0px !important;
    }
   
    .team-cards {
        margin-right: 0px;
    }

    .single-team .info-team {
        padding-left: 40px;
        padding-right: 40px;
    }

    .team-card p {
        font-size: 3rem;
    }

    .single-team h1,
    .single-team .team-card {
        margin-top: 80px;
    }

    .single-team .info-team {
        padding-bottom: 80px;
    }
    
    .row.link {
        padding-left: 40px;
        padding-right: 40px;
    }

    .single-team .project-data img {
        max-width: 100px;
    }

    .single-team .project-cards {
        padding-bottom: 80px;
    }

    .container-fluid#intro-tekst:after {
        content: "";
    }

    p.accordion-intro {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .accordion-toggle .row .col-lg-6:nth-of-type(even),
    .accordion-toggle .row .col-lg-6:nth-of-type(odd) {
        padding-right: 0px;
        padding-left:0px;
        margin-top: 30px;
    }

    .accordion-content .project-data img {
        max-width: 100px;
    }

    .accordion-content .project-data p.age, .accordion-content .project-data p.status {
        margin-left: 15px;
        padding: 10px 15px;
    }

    .modal.show .modal-dialog {
        max-width: 500px;
    }

    #search input.sf-input-text {
        font-size: 2rem;
    }

    #search input[type="submit"] {
        padding: 9px 25px;
        font-size: 1.6rem;  
    }

    #mc_embed_signup h2 {
        font-size: 3rem;
    }

    #mc_embed_signup .mc-field-group label,
    .mc-field-group.input-group strong {
        font-size: 1.8rem !important;
    }
    
    #mc_embed_signup .mc-field-group input {
        margin-top: 10px;
    }
    
    .clear svg {
        display: none;
    }
    
    #mc_embed_signup .mc-field-group.input-group ul {
        margin: 0;
        padding: 5px 0;
        list-style: none;
        display: block;
        width: 100%;
    }

    #mc_embed_signup .mc-field-group input {
        margin-top: 10px;
    }

    .mc-field-group.input-group strong {
        margin-top: 0px;
    }

    .mc-field-group.input-group {
        margin-top: 15px;
    }

    #header {
        padding: 0px 40px;
    }

    #projecten-recent .btn-abs {
        left: 20px;
    }
    .searchandfilter ul li.sf-field-post-meta-doelgroep label::after, .searchandfilter ul li.sf-field-post-meta-age label::after, .searchandfilter ul li.sf-field-post-meta-focus label::after, .searchandfilter ul li.sf-field-taxonomy-expertise label::after {
        bottom: 8px;
    }

    .modal#mededeling {
        margin-bottom: 0px;
    }
}

@media only screen and (max-width: 576px) {

    .ms-hide {
        display: none;
    }

    p.status {
        display: flex !important;
    }
    
    .container-fluid#intro {
        max-height: 50vh;
        min-height: 50vh;
    }
    
    #intro   h1 {
        text-align: center;
    }
    
    .single-project .overview  .thema img{
        max-width: 80px;
    }
    
    .overview {
        left: 10px;
    }
    
    .overview .project-data {
        padding: 20px 0px;
    }
    
    .overview .project-data p.age, .overview .project-data p.status {
        min-height: 33px;
    }
    
    #project-overzicht .thema img {
        max-width: 100px;
    } 

    .container-fluid#intro.intro-mob {
        display: flex !important;
    }
    
    .intro-desk, .container-fluid#intro {
        display: none !important;
    }
    
    /* .nav.col.active #submenu_ms {
        display: block;
    } */

    #hero p {
        margin-bottom: 20px;
    }

    #hero h1 {
        margin-bottom: 20px;
        margin-top: 20px;
        font-size: 4rem;
    }
    
    p, p .small, p small {
		font-size: 2rem;
	}

    .btn {
        width: 100%;
        padding: 14px 18px;
    }

    .btn-transparent {
        padding: 0px;
    }

    .btn svg {
        margin-right: 20px;
        margin-top: 2px;
        margin-left: 0px;
        float: right;
    }

    .btn:hover {
        margin-right: 30px;
    }

    button.toggle {
        right: 20px;
        top: 30px;
    }

    .menu-item-search {
        right: 70px;
    }

    #projecten-recent .project-tekst p {
        margin-bottom: 40px;
    }

    .btn-abs {
        right: unset;
        left: 20px;
        width: unset;
    }

    .btn-abs svg {
        margin-left: 20px;
    }

    .btn-abs:hover svg {
        margin-left: 15px;
    }

    #projecten-recent ul.themas li:after,
    #projecten-recent ul.themas li.thuis:after {
        content: "";
    }

    div#projecten-recent.horizontal-m .row {
        width: 100%;
    }

    .filters form ul li.sf-field-taxonomy-thema ul {
        width: 100%
    }

    .filters form ul li.sf-field-taxonomy-thema li {
        margin-right: 0px;
    }

    .tags {
        text-align: center;
    }

    #hero .col-md-6:first-of-type {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
    }

    #actualiteit .col-md-6 {
        padding: 20px 20px;
    }

    #actualiteit .col-md-6:first-of-type {
        padding-bottom: 40px;
    }

    #projecten-recent ul.themas {
        padding-left: 20px;
        padding-right: 20px;
    }

    #projecten-recent ul.themas {
        margin-top: 40px;
        margin-bottom: 40px;
        justify-content: space-evenly !important;
    }

    #projecten-recent ul.themas li {
        padding: 12px 7px;
    }

    #projecten-recent ul.themas li img {
        max-width: 110px;
    }

    #projecten-recent .project-data img {
        max-width: 100px;
    }

    #projecten-recent .project-data p.age, 
    #projecten-recent .project-data p.status {
        margin-left: 10px;
        padding: 5px 4px;
    }

    .col-md-12.blok-titel.center {
        padding-left: 20px;
        padding-right: 20px;
    }

    #projecten-recent .row.project-cards {
        padding-left: 20px;
        padding-right: 20px;
    }

    #wat-wij-doen .col-md-6:first-of-type {
        padding-left: 20px;
        padding-right: 20px;
    }

    #doe-mee .col-md-6:first-of-type {
        padding: 40px 20px 40px 20px;
    }

    footer .container-fluid {
        padding-left: 20px;
        padding-right: 20px;
    }

    .btn {
        font-size: 2rem;
    }

    .btn-black {
        margin-top: 20px;
		margin-left: 20px;
		margin-right: 20px;
    }

    #projecten-recent .row.project-cards {
        padding-bottom: 60px;
    }

    #wat-wij-doen p, #doe-mee p {
        padding-right: 0px;
        padding-bottom: 20px;
    }

    #wat-wij-doen .col-md-6 {
        padding-bottom: 60px;
        padding-top: 60px;
    }

    #projecten-recent h2 {
        margin-top: 60px;
    }

    .blok-titel h2 {
        text-align: center; 
        margin-bottom: 55px;
    }

    .blok-titel h2::after {
        bottom: -35px;
        left: 0;
        right: 0;
    }

    .tags div {
        font-size: 3rem;
    }

    .footer-bottom .footer-block {
        border: none;
    }

    .col-md-12.filters-wrapper {
        padding-left: 20px !important;
        padding-right: 20px !important; 
    }

    .searchandfilter ul li li {
        padding-left: 0px;
    }

    .filters form ul li.sf-field-taxonomy-thema ul {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .searchandfilter ul li.sf-field-post-meta-doelgroep select.sf-input-select, 
    .searchandfilter ul li.sf-field-post-meta-age select.sf-input-select, .searchandfilter ul li.sf-field-post-meta-focus select.sf-input-select {
        margin-left: 0px;
    }

    .filters form ul li.sf-field-taxonomy-thema li.sf-level-0 {
        margin-top: 30px;
    }

    .searchandfilter select.sf-input-select {
        min-width: 250px;
    }

    .row.project-cards {
        padding-left: 20px;
        padding-right: 20px;
    }

    .row.project-cards .col-md-4 {
        padding-right: 0px;
    }

    .col-md-12.filters-wrapper {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .project-tekst p {
        margin-bottom: 60px;
    }

    .container-fluid#project-overzicht {
        padding-bottom: 40px;
    }

    .project-data p.age, .project-data p.status {
        padding: 10px 15px;
        margin-left: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 45px;
    }
    
    .project-tekst p, p, a {
        font-size: 2rem;
    }

    .single-project .col-md-12, 
    .single-project .col-md-8,
    .single-project .col-md-4,
    .single-project .team-card,
    .row.partners {
        padding-left: 20px;
        padding-right: 20px !important;
    }

    .container-fluid#mee-doen {
        padding-left: 20px;
        padding-right: 20px;
    }

    .team-card h4 {
        font-size: 2rem;
        margin-bottom: 30px;
    }

    .team-card p {
        font-size: 2rem;
    }

    .row.partners img {
        padding-bottom: 20px;
    }

    div#submenu_ms {
        position: absolute;
        color: white;
        font-size: 2rem;
        top: 60%;
    }

    /* #submenu_ms ul li {
        display: block;
        text-align: center;
    }

    #submenu_ms ul li a {
        font-family: 'campton-book' !important;
        font-size: 20px;
        line-height: 2;
    }

    div.nav.col.active div#navbarNavDropdown {
        padding-bottom: 140px;
    }

    a.nav-link {
        padding: 6px 0px;
    }
		*/

    #twee-kolommen .col-md-6:first-of-type {
        padding-right: 0px;
    }

    .container-fluid#team {
        padding-left: 20px;
        padding-right: 20px;
    }

    #team .team-card p, 
    #team .team-card h4,
    .single-team .team-card p, 
    .single-team .team-card h4  {
        font-size: 2rem;
    }

    #team .team-image,
    .single-team .team-image {
        margin: 20px;
        margin: auto;
        margin-bottom: 40px;
        max-width: 300px;
    }

    .team-card .team-info {
        padding-left: 0px;
        margin-bottom: 40px;
    }

    .team-card a {
        display: block;
        text-align: center;
    }

    .team-card h4:after {
        right: 0px;
    }

    .single-team .info-team {
        padding-left: 20px;
        padding-right: 20px;
    }

    .single-team .team-card {
        margin-top: 40px;
    }

    .single-team .btn svg {
        float: unset;
    }

    .single-team .row.project-cards:before,
    .single-team .row.project-cards:after {
        content: "";
    }

    .single-team .project-data img {
        max-width: 80px;
    }

    .single-team .project-cards {
        padding-bottom: 40px;
    }

    .single-team h1 {
        margin-bottom: 20px;
        margin-top: 60px;
    }

    .container-fluid#intro-tekst {
        padding: 40px 20px;
        overflow: hidden;
    }

    div.accordeon-item {
        padding: 40px 20px;
        min-height: auto;
    }

    .accordion-content .project-data img {
        max-width: 80px;
    }

    .accordion-content .project-data p.age, .accordion-content .project-data p.status {
        margin-left: 10px;
    }

    #accordeon h3 {
        font-size: 3rem;
        margin: 0;
    }

    #intro h1::after {
        position: relative;
        display: block;
        text-align: center;
        bottom: 0px;
    }

    .titel {
        align-items: center;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .content p strong {
        font-size: 2.5rem;
        line-height: 1.5;
    }
    
    .content .project-tekst h3 {
        font-size: 2.5rem;
    }

    .modal-content {
        border: none;
        border-radius: 0;
        padding: 60px 20px;
    }

    #search .searchandfilter label {
        width: 100%;
    }

    #search .searchandfilter ul li {
        display: block;
        width: 100%;
    }

    #search input[type="submit"] {
        margin-top: 20px;
        width: 100%;
        padding: 17px 36px;
    }
    
    #search .searchandfilter ul {
        margin-top: 40px;
    }

    .modal.show .modal-dialog {
        margin-top: 90px;
    }

    #mc_embed_signup .button {
        margin-top: 20px !important;
        width: 100% !important;
    }

    .filters form ul li.sf-field-taxonomy-thema label.sf-label-checkbox {
        width: 110px;
    }

    .filters [type="checkbox"]:checked + label:after, 
    .filters [type="checkbox"]:not(:checked) + label:after, 
    .filters [type="checkbox"]:checked + label:before, 
    .filters [type="checkbox"]:not(:checked) + label:before {
        right: 44px;
    }

    #header {
        padding: 0px 20px;
    }

    #hero::after {
        content: "";
    }

    div.nav.col.active button.toggle {
        right: 22px;        
    }

    div.nav.col.active .menu-item-search {
        right: 70px;
    }

    .searchandfilter ul li.sf-field-post-meta-doelgroep label::after, .searchandfilter ul li.sf-field-post-meta-focus label::after,  .searchandfilter ul li.sf-field-post-meta-age label::after, .searchandfilter ul li.sf-field-taxonomy-expertise label::after {
        right: 10px;
    }

    .titel h1 {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    #page {
        padding-top: 90px;
    }

    #header .row {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    #mededeling .col-md-12.mededelingtitel, #mededeling .col-md-12.content {
        padding-left: 0px;
        padding-right: 0px;
    }

    #hero::before {
        content: url(images/rechthoek-schuin-rood.svg);
        position: absolute;
        bottom: -50px;
        right: -200px;
        z-index: 0;
        transform: scale(0.6);
    }

    div.nav.col.active button.toggle {
        top: 25px;
    }
    
    div.nav.col.active .menu-item-search {
        top: 27px;
    }
}
@media only screen and (max-width: 435px) {
    
    .filters form ul li.sf-field-taxonomy-thema label.sf-label-checkbox {
        width: 80px;
    }

    .filters [type="checkbox"]:checked + label:after, 
    .filters [type="checkbox"]:not(:checked) + label:after, 
    .filters [type="checkbox"]:checked + label:before, 
    .filters [type="checkbox"]:not(:checked) + label:before {
        right: 14px;
    }
}

@media only screen and (max-width: 370px) {
    #hero .col-md-6:last-of-type {
        height: 150px;
    }

    #hero h1 {
        font-size: 3rem;
    }   

    div#projecten-recent.horizontal-m .row {
        width: 266.66%;
    }

    .filters form ul li.sf-field-taxonomy-thema ul {
        width: 233.33%;
    }

    .searchandfilter ul li.sf-field-post-meta-doelgroep label::after, .searchandfilter ul li.sf-field-post-meta-age label::after, .searchandfilter ul li.sf-field-post-meta-focus label::after,  .searchandfilter ul li.sf-field-taxonomy-expertise label::after {
        right: 4px;
    }

    .searchandfilter ul li.sf-field-post-meta-doelgroep select.sf-input-select, .searchandfilter ul li.sf-field-post-meta-age select.sf-input-select, .searchandfilter ul li.sf-field-post-meta-focus select.sf-input-select {
        margin-left: 2px;
    }

    .searchandfilter select.sf-input-select {
        min-width: 75px;
    }

    .single-project .project-data p.age, .single-project .project-data p.doelgroep {
        margin-left: 5px;
    }
}


/** Added code **/
.block.actualiteit p {
    margin-bottom: 2rem;
}