/* CSS Document */

html,body {font-family: 'Nunito Sans', sans-serif;  color: #101010; font-size: 1.1rem;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-weight: 600;}

h1 {font-size: 1.5rem;}
.content h1 {color: #d40075;}
.content h3 {font-size: 1.25rem; color: #d40075;}

.btn-dark:hover, .btn-dark:focus {background-color: #164194;}
.anchor{display: block; height: 120px; margin-top: -120px; visibility: hidden;}

.topbar {z-index: 12; position: relative;}

.navbar {-webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; font-size: 1rem;}
.navbar .logo {width: 250px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.navbar.scrolled {background-color: #FFF; box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25); font-size: 1.05rem;}
.navbar.scrolled .logo {width: 150px; margin-right: 116px;}

.navbar .navbar-nav .nav-link {color: #164194;}
.navbar .navbar-nav .nav-link.active {color: #d40075;}
.navbar .navbar-nav .nav-link:hover, .navbar .navbar-nav .nav-link.active:hover {color: #169fdb;}

.bg-home {background-image: url('../attachments/home-bg-lg.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; background-color: #FFF; padding-top: 250px; padding-bottom: 200px;}
.bg-home .titelkader {color: #FFF; z-index: 1;}
.bg-lblue {background-color: #dce1eb; color: #164194;}

.custom-file-input:lang(nl) ~ .custom-file-label::after {content: "Bladeren"; 
  -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; height: calc(1.5em + 1rem);}
.custom-file {height: auto; min-height: calc(1.5em + .75rem + 2px);}

@media screen and (max-width: 991px) {
	.bg-home {padding-bottom: 0px; background-size: auto;}
	.bg-home .titelkader {padding: 20px 35px 0px; background-color: #164194;}
	.bg-home .titelkader h1 {font-weight: 700; font-size: 34px; margin-bottom: 0px;}
    .bg-home .titelkader p {font-size: 26px;}
    
	.bg-home .titelkader:before {top: -2px; left: 0; box-sizing: content-box; content: ""; width: 100%; height: calc(100% + 2px); position: absolute;
	background-image: -webkit-linear-gradient(#164194, #164194), -webkit-linear-gradient(#164194, #164194), -webkit-linear-gradient(#eaf6fe, #eaf6fe), -webkit-linear-gradient(#eaf6fe, #eaf6fe);
	background-image: -o-linear-gradient(#164194, #164194), -o-linear-gradient(#164194, #164194), -o-linear-gradient(#eaf6fe, #eaf6fe), -o-linear-gradient(#eaf6fe, #eaf6fe);
	background-image: linear-gradient(#164194, #164194), linear-gradient(#164194, #164194), linear-gradient(#eaf6fe, #eaf6fe), linear-gradient(#eaf6fe, #eaf6fe); 
	background-size: 100% 50%, 100% 50%, 100% 50%, 100% 50%; background-position: 0 0, 100% 100%, 0 0, 100% 100%; background-repeat: no-repeat; z-index: -2;}
	.bg-home .titelkader:after{top: 0; bottom: 0; left: 0; right: 0; box-sizing: content-box; background: #164194; content: ""; position: absolute; width: 100%; z-index: -1;}
    .modal-dialog.modal-xl {max-width: 90%;}
}
@media screen and (max-width: 575px) {
	.bg-home .titelkader {padding-left: 20px; padding-right: 20px;}
    .bg-home .titelkader h1 {font-size: 28px;}
    .bg-home .titelkader p {font-size: 22px;}
    .modal-dialog.modal-xl {max-width: 100%; margin-left: 0px; margin-right: 0px;}
}

@media screen and (min-width: 992px) {
	.bg-home .titelkader {padding-top: 34px; padding-bottom: 15px;}
	.bg-home .titelkader:before {top: -2px; left: 0; box-sizing: content-box; content: ""; width: calc(100% + 2px); height: calc(100% + 4px); border-radius: 0 300px 300px 0; padding: 0px 60px 0px 999px; margin: 0px -60px 0px -999px; position: absolute;  
	background-image: -webkit-linear-gradient(#164194, #164194), -webkit-linear-gradient(#164194, #164194), -webkit-linear-gradient(#eaf6fe, #eaf6fe), -webkit-linear-gradient(#eaf6fe, #eaf6fe);
	background-image: -o-linear-gradient(#164194, #164194), -o-linear-gradient(#164194, #164194), -o-linear-gradient(#eaf6fe, #eaf6fe), -o-linear-gradient(#eaf6fe, #eaf6fe);
	background-image: linear-gradient(#164194, #164194), linear-gradient(#164194, #164194), linear-gradient(#eaf6fe, #eaf6fe), linear-gradient(#eaf6fe, #eaf6fe); 
	background-size: 100% 50%, 100% 50%, 100% 50%, 100% 50%; background-position: 0 0, 100% 100%, 0 0, 100% 100%; background-repeat: no-repeat; z-index: -2;}

	.bg-home .titelkader:after{top: 0; bottom: 0; left: 0; right: 0; box-sizing: content-box; border-radius: 0 300px 300px 0; padding: 0px 60px 0px 999px; margin: 0px -60px 0px -999px; background: #164194; content: ""; position: absolute; width: 100%; z-index: -1;}
	.bg-home .titelkader h1 {font-weight: 700; font-size: 36px; margin-bottom: 0px;}
    .bg-home .titelkader p {font-size: 28px;}
}

@media screen and (min-width: 1200px) {
	.bg-home{background-image: url('../attachments/home-bg-xl.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center;}
}


@media screen and (min-width: 1200px) and (max-height: 849px) {
	.bg-home {padding-top: 200px;}
}

.play:after {top: 0; left: 0; bottom: 0; right: 0; font-size: 5rem; height: 5rem; transform: translateY(-50%); text-align: center;  color: #101010; content: "\f144"; font-family: 'Font Awesome 5 Free'; position: absolute;}

.card-header {padding: 0px;}
.card-header h2 .btn-link {font-weight: 600;}
.card-header h2 .btn-link.collapsed {background-color: #dce1eb; color: #164194;}
.card-header h2 .btn-link, .card-header h2 .btn-link:hover {background-color: #164194; color: #FFF; text-decoration: none;}
.card-header h2 .btn-link:focus {box-shadow: none;}
.card-body {background-color: #e7f5fb;}

.hulpform {background-color: #169fdb; color: #FFF; font-size: 1rem;}
.hulpform h1 {color: #FFF;}
.hulpform .form-group {margin-bottom: 0.25rem;}
.hulpform .col-form-label {padding-bottom: 0px;}
.hulpform .invalid-feedback {border-radius: 0.2rem; margin-top: 0.1rem; background-color: #c7e8f7; padding: 0 0.5rem;}
.hulpform .was-validated .form-check-input:invalid~.form-check-label {background-color: #c7e8f7; padding: 0 0.5rem; border-radius: 0.2rem;}
.hulpform .form-kader .form-check-label {background-color: #43b5e7; padding: 0 0.5rem; border-radius: 0.2rem; margin-bottom: 0.5rem;}
.hulpform .form-check-input.is-valid~.form-check-label, .hulpform .was-validated .form-check-input:valid~.form-check-label {color:#FFF;}
.hulpform .btn-hulp {background-color: #764a98; border-color: #FFF;}
.hulpform .persgeg {font-size: 16px; line-height: 22px; margin-bottom: 0px;}

.btn-rekenvb {border: 1px solid #d40075; color: #d40075;}
.btn-rekenvb:hover {background-color: #f9d6e9; color: #d40075;}
.btn-rekenvb.active {background-color: #d40075; color: #FFF;}


/******************** Footer *********************/
.site_footer {padding: 40px 0; color: #FFF; text-align: center; background-color: #169fdb;}