@import url("https://use.typekit.net/idi6dij.css");
 
body {
	overflow-x: hidden;
	font-family: "basic-sans";
	color: #313131;
    font-size: 18px;
    font-weight: lighter;
}
body,
#main-wrapper {
	background-color: #F7F7F7;
	margin-top: 0;
	padding-top: 0;
}
p {
	line-height: 32px;
}
#main {
	margin-top: 0;
	padding-top: 0;
}
.nav-item a {
	 transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
}
.nav-item .is-active, 
.nav-item a:hover {
	color: #fff !important;
	opacity: 1;
	
}
.region-top-header .navbar-brand img {
	display: none !important;
}
.region-top-header .navbar-brand {
	background-image: url("../images/logo.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: 300px;
	height: 50px;
}
.navbar-brand img {
	display: none;
}
.highlighted {
	background-color: ;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	height:400px;
	overflow: hidden;
}
.highlighted-vervolg {
	background-color: ;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	height:300px;
	overflow: hidden;
	margin-bottom: 30px;
}
.highlighted img {
	vertical-align: middle;
	height: auto;
    max-width: 100%;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    min-width: 100%;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transform: scale(1.2,1.2);
    -moz-transform: scale(1.2,1.2);
    -ms-transform: scale(1.2,1.2);
    -o-transform: scale(1.2,1.2);
    transform: scale(1.2,1.2);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    min-height: 400px;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
}
.navigation {
	width: 100%;
}
.navbar .navbar-nav {
	float: right;
}
.full-height {
	height: 100%;
}
.verticle-center {
	display: flex;
	align-items: center;
	justify-content: center;
}
.banner-block {
	background-color: #fff;
	padding: 25px;
}
.banner-block h3, h3 {
	color: #154273;
	font-weight: bold;
	font-size: 25px;
}
.banner-block p {
	color: #313131;
	font-size: 18px;
	font-weight: lighter;
}
.banner-block p {
	margin: 0;
}
.banner-block a {
	margin-top: 15px;
	background-color: #154273;
	color: #fff;
	font-weight: normal;
	font-size: 20px;
    padding: 5px 15px;
    position: relative;
    display: inline-block;
    transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
}
.banner-block a:after {
	font-size: 14px;
	position: relative;
	top: 0px;
	margin-left: 10px;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
}
.banner-block li:before {
	font-size: 14px;
	position: relative;
	top: 0px;
	margin-left: 10px;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
	left: 0;
    margin-right: 10px;
}
.banner-block ul {
	padding: 0;
}
.banner-block li {
	list-style: none;
}

.banner-block a:hover {
	background-color:#2B6797;
	text-decoration: none;
}

.home-inner-block {
	padding: 15px;
	margin-top: 30px;	
}
.home-inner-block h3 {
	font-weight: bold;
	font-size: 25px;
}
.home-inner-block.white h3 {
	color: #154273;
}
.home-inner-block.dark-blue h3,
.home-inner-block.light-blue h3 {
	color: #fff;
}
.home-inner-block p {
	color: #313131;
	font-size: 18px;
	font-weight: lighter;
	margin: 0;
}
.home-inner-block a {
	
}

.white {
	background-color: #fff;
}
.white h3 {
	color: #154273;
}
.white p {
	color: #313131;
}
.white a {
	margin-top: 15px;
	color: #02689B;
	font-weight: bold;
}
.dark-blue {
	background-color: #154273;
	color: #fff;
}
.dark-blue strong {
	color: #fff;
}
.dark-blue a {
	margin-top: 15px;
	background-color: #2B6797;
	color: #fff;
	font-weight: normal;
	font-size: 15px;
    padding: 5px 15px;
    position: relative;
    display: inline-block;
    transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
}
.dark-blue a:before {
	font-size: 10px;
	position: relative;
	top: -1px;
	margin-right: 10px;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f15b";
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
}
.dark-blue a:hover {
	background-color:#fff;
	color: #2B6797;
	text-decoration: none;
}
.light-blue {
	background-color: #02689B;
	color: #fff;
}
.light-blue a {
	color: #fff;
}
.blog-items {
	margin-top: 70px;
}
.blog-image {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	height:300px;
	width: 100%;
}
.item-list ul li {
	margin: inherit;
	padding: 0 15px;
}
.blog-bericht {
	
}
.node--type-nieuws .blog-bericht h4,
.node--type-article .blog-bericht h4 {
	display: none;
}
.blog-bericht h4 {
	color: #154273;
	font-size: 25px;
	font-weight: bold;
}
.blog-bericht h2 {
	padding: 0;
	margin: 0;
	color: #154273;
	font-size: 25px;
	font-weight: bold;
}
.blog-bericht h2 a {
	color: #154273;
	margin-bottom: 15px;
}
.blog-bericht .blog-image {
	height: 200px;
}
.blog-bericht p {
	color: #313131;
	font-size: 18px;
	font-weight: lighter;
	margin: 0;
}
.blog-bericht a {
	margin-top: 15px;
	font-weight: bold;
	position: relative;
    display: inline-block;
}
.region-streamer {
	margin: 0;
}
#block-streamer {
	width: 100%;
	background-color: #fff;
}
#block-streamer .content {
}
#block-streamer .views-row {
	width: 100%;
}
.node--view-mode-teaser {
	border: none;
}
.node--type-streamer {
	border: none;
    margin: 50px 0;
    padding-bottom: 0;
}
.node--type-streamer .blog-image:before {
	content:"";
	position: absolute;
	background-color: rgba(232,0,97,0.9);
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
.node--type-streamer .blog-image {
	overflow: hidden;
	position: relative;
	min-height: 300px;
	height: auto;
	padding: 35px;
}
.streamer-inner {
}
.streamer-inner h3 {
	color: #fff;
	font-size: 35px;
	font-weight: bold;
}
.streamer-inner p {
	color: #fff;
	font-size: 22px;
	font-weight: lighter;
}
.streamer-inner a {
	
}
.streamer-inner a {
	margin-top: 15px;
	background-color: #154273;
	color: #fff;
	font-weight: normal;
	font-size: 20px;
    padding: 5px 15px;
    position: relative;
    display: inline-block;
    transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
}
.streamer-inner a:after {
	font-size: 14px;
	position: relative;
	top: 0px;
	margin-left: 10px;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
}
.streamer-inner a:hover {
	background-color:#2B6797;
	text-decoration: none;
}

.accordion-toggle {cursor: pointer;}
.accordion-content {display: none;}
.accordion-content.default, .eerste-accordion .accordion-content {display: block;}

.accordion-inner.active .readmore {
	display: none !important;
}
.accordion-inner.active .readless {
	display: block !important;
} 
.accordion-inner .readmore {
	display: block;
}
.accordion-inner .readless {
	display: none;
}
#accordion h3,
#accordion2 h3 {
	margin: 20px 0 30px;
}
.readmore, .readless {
	position: absolute;
    right: 15px;
    top: 15px;
	font-size: 18px;
    line-height: 20px;
    color: #02689B;
}

.accordion-inner {
	position: relative;
	.overflow: hidden;
	margin-bottom: 15px;
	
	display: inline-block;
    width: 100%;
    
}
.accordion-inner.active,
.accordion-toggle,
.button-choice {
	box-shadow: 0 3px 3px rgba(0,0,0,0.1);
}
.accordion-inner.active .accordion-toggle {
	box-shadow: none;
}
.accordion-toggle {
	background-color: #fff;
    margin: 0 0 ;
    padding: 15px 25px;
    font-size: 25px;
    line-height: 20px !important;
    font-weight: 700;
    color: #313131;
    width: 60%;
    position: relative;
}
.accordion-toggle p {
	line-height: 20px !important;  
}
.accordion-toggle.active {
	background-color: red;
}
.accordion-toggle p {
	 margin: 0;
}
.accordion-content p {
	color: #313131;
	font-size: 18px;
	font-weight: lighter;
}
.accordion-left {
	width: 60%;
    background-color: #fff;
    padding: 0 25px 25px;
    float: left;
	.margin-top: -50px;
}
.accordion-right {
	background-color: #02689B;
    padding: 25px;
    width: 40%;
    .float: left;
	.margin-top: -50px;
	position: absolute;
    right: 0;
    top: 50px;

    .opacity: 0;
    transition-delay: 1s;
    transition: all 0.4s ease-in-out 1s;
    -webkit-transition: all 0.4s ease-in-out 1s;
    -moz-transition: all 0.4s ease-in-out 1s;
}
.accordion-inner.active .accordion-right {
	.opacity: 0.5 !important;
}
.accordion-right:before {
	content: "";
    width: 100%;
    position: absolute;
    top: -50px;
    background-color: #02689B;
    left: 0;
    z-index: 0;
    height: 50px;
}
.rechts-inner {
	margin-top: -55px;
    width: 100%;
    z-index: 1;
    position: relative;
}
.rechts-inner a:before {
	margin-right: 5px;
	font-size: 16px;
	content: "\f0c1";
	font-weight: 900;
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
	font-family: "Font Awesome 5 Free";
}
.accordion-right h3, .accordion-right a, .accordion-right p {
	color: #fff;
}
.accordion-right h3 {
	font-size: 25px;
    line-height: 20px;
    font-weight: 700;
}
#accordion, #accordion2 {
	padding-left: 60px;
	overflow: hidden;
	margin-bottom: 100px;
	margin-top: 50px;
}
.count-rows {
	position: absolute;
	width: 50px;
    height: 50px;
    background-color: #02689B;
    border-radius: 100px;
    z-index: 1;
    line-height: 50px;
    text-align: center;
    color: #fff;
    font-size: 20px;
    left: -60px;
	font-weight: bold;
}

.text-block {
	background-color: #fff;
    padding: 25px;
    margin-bottom: 30px;
}
.text-show {
	margin-bottom: 100px;
	margin-top: 50px;
}
.text-block-transparent {
	margin: 50px 0;
}

.button-choice.active, .button-choice:hover {
	background-color: #02689B;
	color: #fff;
}
.button-choice:hover {
	cursor: pointer;
}
.button-choice {
	color: #868686;
	background-color: #FAFAFA;
	transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
}

.button-choice {
	font-size: 25px;
    font-weight: 700;
	padding: 5px 20px;
    border: none;
}
.button-block {
	margin-bottom: 15px;
}
.button-block .button-choice {
	float: left;
}
.button-block p {
/*
	float: left;
	line-height: 45px;
	padding-left: 15px;
*/
	line-height: 30px;
    text-align: left;
    display: inline-block;
    width: 100%;
    margin-top: 10px;
}
.smaller-block-outer {
	background-color: #fff;
	margin-bottom: 30px;
}
.smaller-block-image {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	height:200px;
	width: 100%;
	overflow: hidden;
}
.site-footer {
	background-color: #154273;
}
.site-footer__bottom {
	border: none;
	margin: 0;
}

.margin-bottom-not-top {
	margin-top: 0;
	margin-bottom: 30px;
}

.region-footer-fourth {
	float: right !important;
	width: 150px !important;
}
.region-footer-fourth li {
	width: 100%;
}
.region-footer-fourth li a {
	color: #fff;
	font-weight: bold;
	padding: 0;
	line-height: 30px;
	font-size: 18px;
	font-family: "basic-sans";
}

.region-footer-first {
	margin-left: 0;
	width: 30% !important;
}
.region-footer-first img {
	display: none !important;
}
.region-footer-first .navbar-brand {
	background-image: url('../images/logo-white.svg');
	background-size: contain;
	background-repeat: no-repeat;
	width: 300px;
	height: 100px;
}

.blog-title {
	color: #154273;
	font-weight: bold;
	font-size: 25px;
}
.dateformatter {
	color: #02689B;
	font-size: 15px;
	margin: 0;
}
.addtohere {
	margin-bottom: 50px;
}
.sharing {
	color: #313131;
	font-weight: bold;
	font-size: 18px;
}
.related-title {
	margin: 20px 0;
}

@media screen and (max-width:991px) {
	.navbar-dark .navbar-nav .nav-link {
		text-align: right;
		font-weight: bold;
		padding-right: 15px;
	}
	.region-primary-menu {
		width: 100%;
		max-width: 100%;
	}
	#navbar-main {
		padding: 0;
	}
	.nav.navbar-nav {
		padding: 15px;
	}
	.navbar-dark .navbar-toggler {
	    color: transparent !important;
	    border-color: transparent !important;
	}
	
	.accordion-left, .accordion-right {
		float: left;
		width: 100%;
		position: relative;
	}
	.accordion-toggle {
		width: 100%;
	}
	.accordion-show .same-height {
		height:  auto !important;
	}
	.accordion-right:before {
		display: none;
	}
	.rechts-inner {
		margin-top: 0;
	}
	.accordion-right {
		top: 0;
	}
	.same-height {
		height: auto !important;
	}
}
@media screen and (max-width:768px) {
	.count-rows {
		position: absolute;
	    width: 20px;
	    height: 20px;
	    background-color: #02689B;
	    border-radius: 100px;
	    z-index: 1;
	    line-height: 20px;
	    text-align: center;
	    color: #fff;
	    font-size: 10px;
	    left: -30px;
	    top: 16px;
	}
	#accordion, #accordion2 {
		padding-left: 30px;
	}
	.region-footer-first, 
	.region-footer-fourth {
		width: 100% !important;
	}
	.region-footer-fourth {
		margin: 0;
	}
	.region-top-header .navbar-brand {
		width: 220px;
	}
}

/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
.hamburger {
	
	    position: absolute;
    right: 25px;
    top: -60px;
    
	float: right;
  padding: 15px 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible; 
  height: 52px;}
.hamburger:hover {
opacity: 0.7; 
}

.hamburger-box {
  width: 40px;
  height: 24px;
  display: inline-block;
  position: relative; 
  float: right}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 40px;
    height: 2px;
    background-color: #29426C;
    border-radius: 0;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -10px; }
  .hamburger-inner::after {
    bottom: -10px; }
    
    
    /*
   * Slider
   */
.hamburger--slider .hamburger-inner {
  top: 2px; }
  .hamburger--slider .hamburger-inner::before {
    top: 10px;
    transition-property: transform, opacity;
    transition-timing-function: ease;
    transition-duration: 0.15s; }
  .hamburger--slider .hamburger-inner::after {
    top: 20px; }

.hamburger--slider.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(45deg); }
  .hamburger--slider.is-active .hamburger-inner::before {
    transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
    opacity: 0; }
  .hamburger--slider.is-active .hamburger-inner::after {
    transform: translate3d(0, -20px, 0) rotate(-90deg); }