@charset 'utf-8';*,*::before,*::after{box-sizing:border-box}

.work-sans-<uniquifier> {
  font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
html{background-color:#fff;color:#333;font-size:16px}body{font-family:'Work Sans',Helvetica,Arial,sans-serif}html,body{height:100%}p,blockquote,footer,ul,ol{line-height:1.2}strong{font-weight:700}a,a:visited,a:focus,a:active{color:#4479b2;text-decoration:none}a:hover{text-decoration:underline}.menuMain a,.menuMain a:visited,.menuMain a:focus{color:#999;text-decoration:none}.menuMain a.active{color:#4479b2}.menuMain a:hover{color:#4479b2;text-decoration:underline}h1{font-size:1.875rem;font-weight:700;line-height:1.2;color:#4479b2;margin-top:1rem}h2{font-size:.875rem;color:#4479b2;line-height:1.43;text-transform:uppercase;margin-top:.5rem}h3{font-size:1.25rem;font-weight:700;margin:1rem 0 -1rem 0}h5{font-size:1rem;color:#cc992b;line-height:1.43;text-transform:uppercase;margin-top:.5rem;}h6{font-size:0.7rem;font-style:italic;}a img{border:none;max-width:100%}div{position:relative}em,i,cite{font-style:italic}ul,ol{list-style:none}sup{font-size:.5em;position:relative;top:-1em}
.clear::after {content: '';	display: table;	clear: both;}
.w100 {width: 100%;}
.center-buttons{text-align:center; margin-bottom:1rem; background-color: #E4E7EA; padding-bottom:1rem; line-height: 0px; display: block;}
.dot {vertical-align: middle; margin-left:2%; width:96%; text-align:center;display:inline-block;padding-bottom: 1rem; padding-top: 1rem; background-color: #E4E7EA; background-image: url('/res/dots-line.png'); background-repeat-y: no-repeat; background-position: center; background-position-y: 15px; background-size: 16px;}
.dot > img {height: .875rem;}
span.dot img {margin-right: 0.1rem;}
.dots-container {display: inline-block; width: 100%; background-color: #E4E7EA;}
.wrapper{min-height:100%}.headerMain,main,.mainFooter{width:100%}.headerMain{position:relative;text-align:right}.menuMain{font-size:.875rem;width:100%;padding:1rem}.menuMain>nav>ul>li{float:none;line-height:1.5rem}.home>a::after{content:'Home'}.logoMain{position:absolute;left:1.25rem;top:1.35rem;width:8rem}.menuSub{width:100%;color:#fff;margin-bottom:2rem}.menuSub>nav>ol{width:100%}.menuSub ol{line-height:3.375rem;vertical-align:bottom}.menuSub a{color:#fff}.menuSub>nav>ol>li>a>div{width:100%;text-align:center;background-color:#bdddf2;font-size:1.25rem;font-weight:bold;cursor:pointer;line-height:3.375rem;vertical-align:bottom}.menuSub>nav>ol>li>a>div.selectedSubMenu{background-color:#4479b2;border-bottom:1px solid #fff;border-right:0}.menuSub li>ol>li{background-color:#4479b2;text-align:center}.menuSub li.bar>div{width:100%;height:1px;background-color:#fff}.menuSub>nav>ol>li.bar:last-of-type{display:none}.menuSub>nav>ol>li>ol>li.active>a{padding-bottom:.83rem;border-bottom:4px solid #fff}.menu2Sub{width:100%;color:#fff;margin-bottom:2rem}.menu2Sub ol{width:100%;line-height:3.375rem;vertical-align:bottom}.menu2Sub li{border-bottom:0px solid #fff;border-right:0}.menu2Sub li:last-of-type{border:0}.menu2Sub a{color:#fff}.menu2Sub div{width:100%;text-align:center;background-color:#bdddf2;font-size:1.25rem;font-weight:bold;cursor:pointer;line-height:3.375rem;vertical-align:bottom;border-bottom:0px solid #fff;border-right:0}.menu2Sub div.selectedSubMenu{background-color:#4479b2}.headerLogo{display:none}.heroImage{display:block;position:relative;width:100%}[class*=col-]{width:100%}
.content>article{content:'';display:table;width:100%;clear:both;margin-bottom:0.5rem}
.content>article>header,.content>article>div{padding:0 1.25rem}
.content>article p{font-size:1.25rem;margin:1rem 0}.progress{font-size:.75rem;line-height:1rem;margin-bottom:2rem;color:#4479b2}.col-50 img{max-width:100%;height:unset;margin-top:-4px;}.col-33 img{max-width:100%;height:unset;margin-top:-4px;}.col-67 img{max-width:100%;}.inpCheck{display:block;position:relative;padding-left:1.5rem;cursor:pointer}
.inpCheck>input{position:absolute;left:0;opacity:0;cursor:pointer}
.inpCheck>span{position:absolute;left:0}
.inpCheck > input ~ span::after {content: '';display: inline-block;width: 1.2rem;height: 1.2rem;background: url('/res/dotOpen.png') 0.15rem / 75%  no-repeat;}
.inpCheck > input:checked ~ span::after {background-image: url('/res/dotClosed.png');}
.question > p {padding: .5rem 1rem .5rem 2.5rem; background: #ffffff url('/res/dotClosed.png') 0.75rem / 1rem no-repeat; color:#000000; font-weight:bolder;}
a.question:hover, a.question:active {text-decoration: none; color:#999;}
#home-banner-container {text-align: center;}
#header-vervolg-back{display:inline-block;}
#header-vervolg-back img {width: 100%;}
#home-banner-text-container {position: relative; z-index: 900; width: 1280px; margin-left: auto; margin-right: auto;}
#home-banner-intro {text-align:left; margin-left: 2.125rem; padding-left: 1.25rem; max-width: 60%;}
#home-banner-text {position: absolute; left: 50%; margin-left: -640px;}
#home-banner-text-container h2 {margin-left: 2.125rem; padding-left: 1.25rem; margin-top: 3rem; font-size: 1.875rem; font-weight: 700; line-height: 1.2; margin-bottom: 0.5rem; text-align: left;     max-width: 60%; text-transform: none;}
#home-banner-buttons-container{text-align: center;}
#home-buttons {width: 1280px; text-align: left; margin-left: auto; margin-right: auto; padding-left: 3.375rem; margin-top:-4.2rem;}
#home-images{margin-top: -25rem; z-index:9000;}
#home-images > a{position:relative; top:-3rem; }
div#home-images > a:first-of-type {margin-left: -2rem; top:0px;}

.home-niveau-button{color:#ffffff; display:inline-block; margin-bottom: 1rem; border-radius:3px;  width: 11.5%; margin-right: 1%;  text-align: center; height: 3rem; line-height: 3rem; font-size:1rem;}
#po-button {background-color: #8bc53f;}
#vmbo-button {background-color: #CC992B;}
#obhv-button {background-color: #6CC3F5;}
#bbhv-button {background-color: #337BB8;}
#mbo-button {background-color: #3BC9C9;}
.simulatie-full-section {margin-left: 0px !important; margin-right: 0px !important; margin-top: 0.2rem !important; display: block;}
.simulatie-full-section > article > header {padding: 0px !important; background-color:#ffffff;}
.simulatie-full-section > article > header > h1{padding-top: 1rem; margin-top:0px; padding-left: 1.25rem; background-color:#E4E7EA; color:#00A2DF;}
.simulatie-full-section > article{background-color:#E4E7EA; margin-bottom:0px;}
#wis-herstart {color: #00A2DF; background-color: #ffffff; padding-left: 1rem; padding-right: 1rem; padding-top:1rem; padding-bottom:1rem; border-radius: 3px; display:inline-block; font-size: 1.25rem;}
#wis-herstart > p {margin-top:0px; margin-bottom: 0px;} 
#wis-herstart a {color: #00A2DF;}
.header-top {width: 1280px; height: 6rem; margin-left: auto; margin-right: auto;}
.footer-pdf-button {padding: 1rem; display: inline-block; border-radius:3px; background-color: #ffffff;}
a > .footer-pdf-button {color: #337BB8 !important; margin-bottom:0.2rem;}
.mainFooter{height:unset;}
.barBlue {text-align: center; height: unset;  padding-top: 1rem; padding-bottom:1rem;}
.footer-title{font-weight:600; text-transform: uppercase; color: #ffffff; margin-bottom: 0.5rem;}
iframe{max-height: 572px;}
table {font-size: .875rem; color: #4479b2; border-top: 1px solid #4479b2; border-bottom: 1px solid #4479b2;	width: 100%;}
th {font-weight: bold;}
tr {line-height: 1.5rem;}
tr:nth-child(2n) {background-color: #e9f5fb;}
th {text-align: left;}
td:first-child {padding-left: 1rem;}
td:last-child {padding-right: 1rem;}
hr {border: 0;	margin: 1rem;}
.btn, .btn:visited {position: relative; display: inline-block; padding: 0 2rem;margin-right: 1rem;border-radius: 3px;font-size: 1.25rem;line-height: 1.5rem; padding-top: 1rem;padding-bottom: 1rem;color: #FFFFFF;background-color: #00A2DF;}
a.btn:hover{background-color:#e9f5fb;text-decoration:none}.inpUpDown{display:inline-block;width:2.75rem;text-align:center}.stack{display:inline-block;top:.75rem;width:1.5rem;height:2.5rem}.arrUp,.arrDown{width:.75rem;height:.75rem;border:.75rem solid transparent}.arrUp{top:-.5rem;border-bottom:.75rem solid #4479b2}.arrDown{bottom:.2rem;border-top:.75rem solid #4479b2}.arrRight::after{content:'';display:block;position:absolute;right:1rem;top:1.125rem;width:14px;height:18px; background: url(../res/arrow-next-white.png) no-repeat; background-size:14px;}.arrLeft::before{content:'';display:block;position:absolute;left:1rem;top:1.125rem;width:14px;height:18px;background: url(../res/arrow-prev-white.png) no-repeat; background-size:14px;}.mainFooter{height:unset}.footerLogo{display:block;padding-bottom:3rem;border-top:1px solid #4479b2;background:url(../res/logo_waterbouw.png) center / auto 50% no-repeat}.goodfeedback{color:#4479b2}.badfeedback{color:#992f00}
#quiz_question_feedback img {max-width: 400px; height: auto;}
#quiz_question_answers img {max-width: 400px; height: auto;}
.foto-bijschrift{font-size:0.75rem !important;}
.subSub a {color:#337BB8;}
.menuSub ol.subSub > li{color:#337BB8;}
ol.subSub li.active a {color: #000000; font-weight: 600;}
h2.simulatie-title{width: 100%;  text-align: center; background-color: #00A2DF; border-top-left-radius: 1rem; border-top-right-radius: 1rem; color: #ffffff; padding-top: 0.5rem; padding-bottom: 0.5rem; margin-top:0px;}
li.home {display: none !important;}
p.klein-font {font-size: 1rem !important;}
.wrapperHome #header-vervolg-back {display: none;}
.quiz-intro {font-size: 1.25rem; margin-top: 1rem;}

@media screen and (min-width: 900px) {
	.wrapper {
		/* padding-bottom: 4.875rem; */
		/* margin-bottom: -4.875rem; */
	}
	.headerMain {text-align: left;  /*height: 9.625rem;*/ padding: 0;}
	.menuMain {position: absolute; top: 3rem; right: 12.5rem; max-width: calc(100% - 32rem); /* ~ two logos + margins */padding: 0;
	}
	.menuMain > nav > ul {text-align: right;}
	.menuMain > nav > ul > li {display: inline-block;margin-left: 1.5rem;}
	.menuMain > nav > ul > li:first-child {margin-left: 0;}
	.home > a::after {
		content: '';
		display: inline-block;
		width: 1rem;
		height: 1rem;
		background: url('/res/home.png') top right / 100% no-repeat;
	}
	.logoMain {left: 1.375rem;top: 1.625rem;width: 15rem;}
	.menuSub {position: relative; margin-bottom: 0; margin-top: -1.2rem; width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1%;}
	.menuSub > nav > ol > li.selectedSubMenu {}
	.subSub {width: calc(100% - 36px);}
	.auto > li {text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
	.auto > li > a {text-overflow: ellipsis;}
	.menuSub ol { /* main AND sub lists */
		display: inline-block;
	}
	.menuSub ol > li { /* main AND sub items */
		float: left;
	}
	.menuSub > nav > ol > li > a > div {/* stap 1/2/3/... */
		display: inline-block; padding:0px 0.25rem;
		/*width: 2.2rem;*/
	}
	.menuSub > nav > ol > li > a > div.selectedSubMenu {
		border-right: 0px solid #fff; border-radius:3px;
		border-bottom: 0;
	}
	.menuSub li.bar > div {
		width: 1px;
		height: 3.375rem; /* 100% does not work if div empty */
		background-color: #fff;
	}
	.menu2Sub {position: relative; margin-bottom: 0; margin-top: -5rem; width: 1280px; margin-left: auto; margin-right: auto;}
	.menu2Sub ol {display: inline-block;}
	.menu2Sub li {float: left;}
	.menu2Sub div {display: inline-block;border-bottom: 0;border-right: 0px solid #fff; border-radius:3px;}

	.headerLogo {display: block; position: absolute; right: 1.375rem; top: 2.375rem; width: 8.1875rem;}
	.content {margin: 1.25rem 2.125rem;}
	.mainFooter {height: 4.875rem;}
	.barBlue {
		display: block;
		/*height: 4.875rem;  if 100% has no height cause no content */
		background-color: #bdddf2;
	}
	.footerLogo {
		display: none;
	}

	/* calculated width of list items depending on available space */
	/* currently we count to max 6 list items; add more if necessary */
	.auto > li:first-child:nth-child(1) {
		/* one item */
		width: 100%;
	}
	.auto > li:first-child:nth-last-child(2),
	.auto > li:first-child:nth-last-child(2) ~ li {
		/* two items */
		width: 50%;
	}
	.auto > li:first-child:nth-last-child(3),
	.auto > li:first-child:nth-last-child(3) ~ li {
		/* three items */
		width: 33.3333%;
	}
	.auto > li:first-child:nth-last-child(4),
	.auto > li:first-child:nth-last-child(4) ~ li {
		/* four items */
		width: 24%;margin-right:1%;
	}
	.auto > li:first-child:nth-last-child(5),
	.auto > li:first-child:nth-last-child(5) ~ li {
		/* five items */
		width: 19%;margin-right:1%;
	}
	.auto > li:first-child:nth-last-child(6),
	.auto > li:first-child:nth-last-child(6) ~ li {
		/* six items */
		width: 16.6667%;
	}
[class*=col-]{float:left}.col-08{width:8.33%}.col-17{width:16.67%}.col-25{width:25%}.col-33{width:33.33%}.col-42{width:41.67%}.col-50{width:50%}.col-58{width:58.33%}.col-67{width:66.67%}.col-75{width:75%}.col-83{width:83.33%}.col-92{width:91.67%}.col-00{width:100%}}.wrapperHome header.headerMain{height:7.8rem}.col-50 ul{list-style:disc;font-size:1.1rem;margin-left:1.25rem}.col-33 ul{list-style:disc;font-size:1.1rem;margin-left:1.25rem}input#naam_lln{width:40%;float:left;font-family:'Work Sans',Helvetica;margin-top:.5rem}a#printknop{width:50%;float:right;display:inline-block;margin-bottom: 1rem;}
.col-67.home-text p {font-size: 100%;}
@media screen and (max-width:1280px){
    #home-buttons {width: 100%;}
    #home-banner-text-container { width: 100%; left: unset; margin-left: unset;}
     #home-banner-text {position: absolute; left: unset; margin-left: unset;}
    #home-banner-intro {max-width: 90%;}
    #home-banner-text-container h2{max-width: 90%;}
     .header-top {width: 100%;}
    .menuSub{width: 100%; }
    .menu2Sub{width: 100%; }
    #home-images{margin-top: -8rem;}
    .simulatie-full-section {margin-left: 0.8rem !important; margin-right: 0.8rem !important;}
}
@media screen and (max-width:1120px){
    #home-banner-text-container h2 {margin-top: 1.5rem;}
    .home-niveau-button {width: 18%;}
    #home-images{margin-top: 0px;}
    .menuMain {top: 2rem;}
}

@media screen and (max-width:980px){#home-buttons {margin-top: -2rem;}}
@media screen and (max-width:900px){
    .menuMain > nav > ul > li {line-height: 1.2rem;}
    #home-banner-intro {margin-left: 0px;}
    #home-banner-text-container h2{margin-left: 0px; font-size:1.5rem;}
    #home-buttons {padding-left:1.25rem; margin-top:1rem;}
	.home-niveau-button {width: 18%; font-size: 0.8rem;}
    #home-images{text-align:center; margin-top:2rem;}
    #home-images img {width: 60%;}
    .wrapperHome header.headerMain{height:unset;}
   .header-top {height: unset;}
    .menuMain {top: 0px;}
}
@media screen and (max-width:800px){
#home-banner-text {position: relative; margin-bottom:1rem;}
    }
@media screen and (min-width:1280px){.headerMain{width:100%;margin:0 auto}main{width:1280px;margin:0 auto}.mainFooter{width:100%;margin:0 auto}}
@media screen and (max-width:640px){.home-niveau-button {font-size: 0.625rem;}.btn{margin-bottom:.5rem}.logoMain{width:14rem}iframe{max-height:380px}}
@media screen and (max-width:480px){.home-niveau-button {width: 80%; margin-bottom: 0.2rem;}.logoMain{position:relative;left:0;top:0;width:88%;margin-right:6%;display:inline-block;max-width:380px}iframe{max-height:320px}}
@media screen and (max-width:400px){iframe{max-height:200px}}
@media print{.headerMain{display:none}}
@media print{#printknop{display:none}}