/*
Theme Name: GeneratePress Child theme of generatepress
Theme URI: 
Description: Child theme of generatepress theme for the GeneratePress theme
Author: <a href="https://tomusborne.com">Tom Usborne</a>
Author URI: 
Template: generatepress
Version: 3.3.0
*/

/*--------------------------------------------------------------
## Font fluid setup
--------------------------------------------------------------*/

@import url("https://use.typekit.net/udh4nna.css");

@font-face {
  font-family: 'Satoshi';
  src: url('fonts/Satoshi-Variable.woff2') format('woff2'),
       url('fonts/Satoshi-Variable.woff') format('woff'),
       url('fonts/Satoshi-Variable.ttf') format('truetype');
       font-weight: 300 900;
       font-display: swap;
       font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url('fonts/Satoshi-VariableItalic.woff2') format('woff2'),
       url('fonts/Satoshi-VariableItalic.woff') format('woff'),
       url('fonts/Satoshi-VariableItalic.ttf') format('truetype');
       font-weight: 300 900;
       font-display: swap;
       font-style: italic;
}


body,
button,
input,
select,
optgroup,
textarea {
	font-size: 18px;
	font-size: clamp(1.13rem, 0.41vw + 1.03rem, 1.69rem); /* 18px - 27px */
  line-height: 1.5;
  letter-spacing: 0;
  font-weight:400;
}
h1 {
	font-size:2.75rem;
	font-size: clamp(2.75rem, calc(1.477rem + 6.364vw), 6.25rem); /* 44px - 100px */
  font-weight:700;
}
h2 {
	font-size:2.25rem;
  font-size: clamp(2.25rem, 1.1vw + 1.99rem, 3.75rem); /* 36px - 60px */
  font-weight:700;
}
h3 {
	font-size:1.56rem;
  font-size: clamp(1.56rem, 0.55vw + 1.43rem, 2.31rem); /* 25px - 37px */
  font-weight:700;
}
h4 {
	font-size:1.13rem;
  font-size: clamp(1.13rem, 0.37vw + 1.04rem, 1.63rem); /* 18px - 26px */
  font-weight:700;
}


.has-small-font-size {
	font-size:0.94rem !important;
  font-size: clamp(0.94rem, 0.41vw + 0.84rem, 1.5rem) !important; /* 15px - 24px */
}
.has-medium-font-size {
	font-size:1.31rem !important;
  font-size: clamp(1.31rem, 0.41vw + 1.22rem, 1.88rem) !important; /* 21px - 30px */
}
.has-large-font-size {
	font-size:1.38rem !important;
  font-size: clamp(1.38rem, 1.05vw + 1.13rem, 2.81rem) !important; /* 22px - 45px */
}
.has-x-large-font-size {
	font-size:1.88rem !important;
  font-size: clamp(1.88rem, 1.37vw + 1.55rem, 3.75rem) !important; /* 30px - 60px */
}
.main-navigation a {
	font-size:0.94rem !important;
  font-size: clamp(0.94rem, 0.41vw + 0.84rem, 1.5rem) !important; /* 15px - 24px */

}
.main-navigation .sub-menu a {
	font-size:0.94rem !important;
  font-size: clamp(0.94rem, 0.41vw + 0.84rem, 1.5rem) !important; /* 15px - 24px */
}

.gb-button-text {
	font-size:0.94rem !important;
  font-size: clamp(0.94rem, 0.41vw + 0.84rem, 1.5rem) !important; /* 15px - 24px */
}

/*--------------------------------------------------------------
## Canvas fluid setup
--------------------------------------------------------------*/

:root {
  --scrollbar: 0px;
  overflow-x:hidden;
}
.no-sidebar .entry-content .alignfull {
    margin-left: calc( (-100vw + var(--scrollbar) ) / 2 + 100% / 2);
    margin-right: calc( (-100vw + var(--scrollbar) ) / 2 + 100% / 2);
    max-width: calc(100vw - var(--scrollbar));
    width: auto;
}
.separate-containers .inside-article,
.site-header .inside-header {
	padding-left: clamp(20px, 12.81vw + -28.05px, 300px);
	padding-right: clamp(20px, 12.81vw + -28.05px, 300px);
}
.alignfull > .gb-container {
	margin-left: clamp(20px, 12.81vw + -28.05px, 300px);
	margin-right: clamp(20px, 12.81vw + -28.05px, 300px);
}

@media screen and (min-width: 2560px) {
	.alignfull > .gb-container {
	margin-left: auto;
	margin-right: auto;
	max-width:1960px;
}
}
.fluid-padding {
	padding-left:clamp(20px, 2.29vw + 11.42px, 70px);
	padding-right:clamp(20px, 2.29vw + 11.42px, 70px);
}

/*--------------------------------------------------------------
## Header / navigation
--------------------------------------------------------------*/

.mobile-menu-control-wrapper .menu-toggle,
.mobile-menu-control-wrapper .menu-toggle:hover {
	background-color:transparent !important;
}
.gp-icon svg {
    height: 2em;
    width: 2em;
  }
  
 .main-navigation .inside-navigation {
 	align-items:flex-end;
 }
 .slideout-navigation.do-overlay .slideout-exit {
 	position:relative !important;
 }
 .gp-icon.pro-close {
 	width:1em;
 }
 
 .main-navigation.navigation-stick .sticky-navigation-logo img {
	width:60px;
	height:60px;
	margin-top:0;
	margin-bottom:0px;
	padding:0;
}

 
/*--------------------------------------------------------------
## Element page header
--------------------------------------------------------------*/
 
.separate-containers .site-main {
    margin-top: 0px;
}
.separate-containers .site-main {
    margin-top: 0px;
}
.entry-header + .entry-content {
	margin-top:0;
}
@media (max-width: 768px) {
.separate-containers .inside-article {
    padding-top: 0px;
	}
}


/*--------------------------------------------------------------
## Patroon page header
--------------------------------------------------------------*/

@media screen and (min-width: 2560px) {
	.title-image.alignfull > .gb-container {
		border-left: 2.5vw solid transparent;
	}
}
@media screen and (max-width: 768px) {
	.title-image.gb-container:after {
		background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%) !important;
	}
}

/*--------------------------------------------------------------
## Patroon dit doen we doelgroep card
--------------------------------------------------------------*/

.read-more {
	position:absolute;
	bottom:20px;
	right:20px;
}

/*--------------------------------------------------------------
## Patroon fw-text
--------------------------------------------------------------*/
@media screen and (min-width: 2560px) {

}

/*--------------------------------------------------------------
## General tweaks
--------------------------------------------------------------*/

.dropdown-menu-toggle svg {
	width:1em;
	height:1em;
	padding-top:0em;
}
.slideout-navigation.do-overlay .menu-item-has-children .dropdown-menu-toggle {
    border-left: 0px !important;
}
.main-navigation ul ul {
	padding-top:10px;
	background-color:transparent;
}
.main-navigation .main-nav ul ul li a {
  background-color: var(--global-color-7);
}
@media screen and (max-width: 1024px) {
	.slideout-navigation.main-navigation .main-nav ul ul li a {
    background-color: transparent;
	}
}

hr.wp-block-separator {
    height:4px !important;
    margin-top:40px;
    margin-bottom:40px;
    margin-left:auto;
    margin-right:auto;
    border:0;
    width:33%;
    background-color:var(--base-black);
}
.maxwidth {
	width:240px;
}
.regelafstand13 {
	line-height:1.3;
}
.bottommargin0 {
	margin-bottom:0;
}
.slideout-navigation .main-nav {
	margin-top:60px;
}
.gb-headline .gb-icon svg {
	border-radius:300px;
}
#slb_viewer_wrap .slb_theme_slb_default .slb_data_title, 
#slb_viewer_wrap .slb_theme_slb_default .slb_group_status {
    font-family: 'Satoshi', arial, sans-serif !important;
    font-size:20px !important;
}
.gb-block-image > a {
	display:block;
	position:relative;
}
.gb-block-image > a:after {
	content:url('images/icon_expand.svg');
	position:absolute;
	right:0;
	bottom:0;
	width:50px;
	height:50px;
	background-color:#fff;
	border-radius:50px;
	box-shadow:2px 2px 4px #00000030;
	padding:12px 15px 18px 15px;
}
.gb-block-image > a:after > svg {
	max-width:100%;
}

.breedte-beeld > .gb-container {
	margin-left:0 !important;
}
@media screen and (max-width: 768px) {
	.breedte-beeld > .gb-container {
		margin-right:0 !important;
	}
}

.pswp__bg {
    opacity: .005;
    background: #55476aee !important;
}

.pswp__dynamic-caption--below {
    width: auto;
    max-width: 700px;
    padding: 30px 0 20px 0;

}
.pswp__caption__title {
	color:#fff;
	margin-top:10px;
  position:relative;
}

.pswp__caption__title:before {
	content:'';
	position:absolute;
	top:-10px;
	left:0;
	width:140px;
	height:4px;
	background-color:#fff;
}
.pswp__img {
	padding-top:10px;
}



/*--------------------------------------------------------------
## Homepage header
--------------------------------------------------------------*/

.site-logo {
	z-index:9999999;
}
.chapeau > p {
	margin:0 !important;
}
@media screen and (min-width: 2560px) {
	.chapeau {
		margin-left:-2.5vw;
	}
}

/*--------------------------------------------------------------
## Case detail page
--------------------------------------------------------------*/

.case-button {
	position:absolute;
	top:-40px;
	right:1vw;
	z-index:999;
}
.entry-content ul {
	margin-left:1em;
}
.entry-content ul > li { 
	list-style-image: url(images/icon_bullet.svg); 
	padding-left:.4em;
} 



/*--------------------------------------------------------------
## Case filter
--------------------------------------------------------------*/

.searchandfilter ul {
    margin: 30px 0 60px 0;
    padding: 0;
    max-width:100%;
    text-align: left;
}
.searchandfilter ul li {
    display: inline-block;
    vertical-align: middle;
    margin: 0 10px 5px 0;
    padding: 0;
    text-align: left;
    line-height:1.2;
}
.searchandfilter ul li.sf-field-taxonomy-doelgroep label{
	background-color:#37873c;
   color:#fff;
}

.searchandfilter select.sf-input-select {
	width:240px;
}
.searchandfilter .chosen-container {
	font-size:15px;
	font-weight:400;
	background-color:#37873c;
  color:#fff;
}
.searchandfilter .chosen-container .chosen-single {
	border-radius:0;
	background:#37873c;
	color:#fff;
	padding:5px;
	box-shadow:none;
	font-weight:600;
  border:1px solid #37873c;
}
.searchandfilter .chosen-container-single .chosen-single div b {
	background-position:0 6px;
}
.searchandfilter .chosen-container-single .chosen-single div b {
    content: '';
    position: absolute;
    top: 8px;
    right: 14px;
    background: none !important;
    height: 10px;
    width: 10px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(-45deg);
}
.searchandfilter .chosen-container-single.chosen-container-active.chosen-with-drop .chosen-single div b {
    transform: rotate(135deg);
    top: 14px;
}

.searchandfilter .chosen-container-single.chosen-container-active.chosen-with-drop .chosen-single div b {
	background-position:-18px 6px;
}
.searchandfilter .chosen-container .chosen-drop {
	border-radius:0;
	border:0;
	background:#003a16;
	padding:5px;
	box-shadow:none;
}
.searchandfilter  .chosen-container-single .chosen-search {
	display:none;
}
.searchandfilter .chosen-container .chosen-results {
	color:#fff;
}
.searchandfilter .chosen-container .chosen-results li.highlighted {
	background: var(--base-1);
	color: #fff;
}
.searchandfilter .sf-field-search input {
	display:inline-block;
	background-color:#003a16;
  color: #fff;
  padding:7px 0 8px 10px;
  font-size:16px;
  line-height:16px;
}
.searchandfilter .sf-field-search input:focus {
  box-shadow:none;
  border:1px solid #003a16 !important;
  outline:none !important;
}
.searchandfilter .sf-field-search input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  background-color:#003a16;
  color: #fff;
}
.searchandfilter .sf-field-search input::-moz-placeholder { /* Firefox 19+ */
  color: #fff;
  background-color:#003a16;
}
.searchandfilter .sf-field-search input:-ms-input-placeholder { /* IE 10+ */
  color: #fff;
  background-color:#003a16;
}
.searchandfilter .sf-field-search input:-moz-placeholder { /* Firefox 18- */
  color: #fff;
  background-color:#003a16;
}
.sf-field-reset a.search-filter-reset {
	font-size:16px;
	color:#fff;
	text-decoration:none;
}
.results {
	font-weight:700;
}









.wp-pagenavi {
	clear: both;
	text-align:center;
}

.wp-pagenavi a, .wp-pagenavi span {
	text-decoration: none;
	padding: 3px 5px;
	margin: 2px 10px;
	color:##a7b739;
	font-size:18px;
	line-height:1.3em;
	font-weight:700;
	border:0;
}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
	color: #da2128;
}

.cases-filter-list {
	margin:0 -20px;
  display: flex;
  flex: 1;
  flex-wrap:wrap;
  align-items: stretch;
}
.case-filter-item {
	flex: 1 1 26%;
  padding:0 0 40px 0;
  margin:0 20px 20px 20px;
  min-width:280px;
  text-decoration:none;
	position:relative;
}
.case-filter-item hr {
    background-color: var(--base-black);
    border: 0;
    height: 4px;
    margin-bottom: 10px;
    margin-top: 10px;
}
.case-filter-item .case-terms {
	font-weight:700;
	margin-bottom:10px;
}
.case-filter-item h3 {
	color:#00AA4F;
}
.fake-button {
	position:absolute;
	bottom:20px;
	left:0px;
  color:#00AA4F;
  font-weight: 700;
}
.fake-button:after {
	content:url('images/icon_circle-arrow.svg');
	display:inline-block;
	width:1.2em;
	height:1.2em;
	padding-left:5px;
	color:var(--base-1);
	vertical-align:text-top;
}
.case-filter-item:hover p {
	color:var(--base-black);
  text-decoration:none;
}
.case-filter-item:hover .fake-button,
.case-filter-item:hover h3  {
  color:var(--base-1);
}
.case-filter-item:hover .fake-button:after {
	content:url('images/icon_circle-arrow-blue.svg');
}
.case-filter-item.hidden {
	visibility:hidden;
	height:0;
	padding:0;
	margin-top:0;
	margin-bottom:0;
}

/*--------------------------------------------------------------
## Related cases
--------------------------------------------------------------*/

.gb-container.gb-container-related-outer {
    background-color: var(--base-grey);
}

.gb-container.gb-container-related-inner {
    padding-top: 60px;
    padding-bottom: 40px;
    margin-top: 60px;
    margin-bottom:-20px;
}
.sectie-titel-cases {
	text-align:center;
	margin-bottom:60px;
}
.cases-filter-list {

}

/*--------------------------------------------------------------
## Sporenburg Energie adjustments
--------------------------------------------------------------*/

.knop.menu-item {
	background-color:var(--base-2);
	color:#000;
	border-radius:100px;
	padding-top:4px;
	padding-bottom:6px;
}
.knop.menu-item:hover {
	background-color:#000;
	color:#fff !important;
}
.knop.menu-item:hover a {
	color:#fff !important;
}
.is_stuck .inside-navigation {
	padding-top:6px;
	padding-bottom:6px;
}