@charset "utf-8";


#paginaheader{ height: 480px; box-sizing: border-box; padding: 210px 0 0 0 ; background: #fff url(../img/kruimelpad/bg-nieuws.jpg) no-repeat top center; background-size:  cover }

#paginaheader h3{ font-size: 51px; font-weight: normal;padding: 0 0 30px 0; width: 510px;  }
#paginaheader h3 span{ padding: 0; margin: 0; border: 0; }
#paginaheader h3:before { content:''; opacity: 0.2; position: absolute; top: -5px; left: -25px; width: 20px; height: 15px; background: url(../img/svg-quoteboven.svg)no-repeat;}
#paginaheader h3 span:last-of-type:after { content:''; opacity: 0.2; position: absolute; bottom: -5px; right:  -25px; width: 20px; height: 15px; background: url(../img/svg-quoteonder.svg)no-repeat;}
#paginaheader .container {  box-sizing: border-box; }

#paginaheader.nieuwsvervolg { height: 280px;  }
#paginaheader.nieuwsvervolg .container{  display: none; }



#kruimelpad{  padding: 35px 0 30px 0; background: #25337C; color: #fff; }
#kruimelpad .content{ font-size: 11px;  z-index: 1; }
#kruimelpad .content a{ color: #fff;}
#kruimelpad .content a:hover{ color: #fff!important; }
#kruimelpad .content .kruimellinks{ opacity: 0.6; height: 20px; line-height: 22px; margin-top: 10px; box-sizing: border-box; padding-left: 25px; background: url(../img/svg-sitemap.svg) no-repeat left center; background-size: 13px auto; }
#kruimelpad .content .kruimellinks:hover{ opacity: 1.0; }
#kruimelpad .content h1{ color: #fff; font-size: 43px; text-transform: uppercase; box-sizing: border-box; padding-right: 420px; }

#kruimelpad:before, #kruimelpad:after{ content:''; position: absolute; width: 100%; height: 1px; background: #25337C; left: 0px; opacity: 0.3; }
#kruimelpad:before{ top: -10px;}
#kruimelpad:after{ bottom: -10px;}



#inhoud.vervolgpagina{ padding: 50px 0 50px 0;  border-bottom: 1px solid #ddd; }
#inhoud.vervolgpagina .content{	min-height: 550px;}
#inhoud.vervolgpagina .content.zijmenucontent{ width: 100%; padding: 0 440px 0 0 ; box-sizing: border-box;	}


#inhoud.vervolgpagina .zijmenu{ z-index: 4; position: absolute; right: 0px; top: -150px; width: 360px; box-sizing: border-box; padding: 40px; background: #F6F6F6; }

#inhoud.vervolgpagina .zijmenu{ top: -150px; }
#inhoud.vervolgpagina.dubbelregel .zijmenu{  top: -200px; }


#inhoud.vervolgpagina .zijmenu:before{ content:''; position: absolute; top: 20px; left: -12px; width: 12px; height: 540px; background: url(../img/visual-zijmenu.png) no-repeat right top; }
#inhoud.vervolgpagina .zijmenu h3{ font-weight: normal; font-size: 16px; padding: 0 0 10px 0; color: #333; }
#inhoud.vervolgpagina .zijmenu h3:nth-child(1){ font-size: 20px; }
#inhoud.vervolgpagina .zijmenu a{ line-height: 120%; padding: 15px 20px; box-sizing: border-box; margin-top: 10px; color: #364385; text-decoration: none;  border-color: #E7E7E7; background-color: #E7E7E7; }
#inhoud.vervolgpagina .zijmenu .btn:after{ border-color: #F6F6F6;  }
#inhoud.vervolgpagina .zijmenu a.active{  color: #fff; background: #364385; }



#inhoud.vervolgpagina .zijmenu .input{ position: relative; margin-bottom: 10px; float: left; background: #fff; width: 220px; padding: 0 0 0 45px; box-sizing: border-box; border-radius: 4px; border: 1px solid #eee; box-shadow: inset 3px 3px 3px rgba(0,0,0,0.2); }
#inhoud.vervolgpagina .zijmenu .input:after { content:''; position: absolute; top: 0px; left: 0px; bottom: 0px; width: 45px; background: #23327B; border-radius: 4px 0 0 4px; }
#inhoud.vervolgpagina .zijmenu input[type=text] { padding: 17px 25px 15px 15px; box-sizing: border-box; font-size: 12px; font-style: italic; border: 0; background: 0; outline-style: none; }
#inhoud.vervolgpagina .zijmenu .input:hover{ box-shadow: inset 4px 4px 6px rgba(0,0,0,0.3); border-color: #ddd; }
#inhoud.vervolgpagina .zijmenu .input.telefoon:after { background: #23327B url(../img/svg-telefoon-wit.svg) no-repeat center center; background-size: 14px auto; }
#inhoud.vervolgpagina .zijmenu input[type=button] { position: relative; float: left; border: 0; margin-left: 10px; width: 40px; height: 40px; cursor: pointer;  outline-style: none;  background: url(../img/svg-verzenden.svg) no-repeat center center; background-size: 21px auto; }

#inhoud.vervolgpagina .zijmenu .split { margin-top: 30px; border-top: 3px solid #ddd; height: 40px; }
#inhoud.vervolgpagina .zijmenu .tel{ padding: 10px 20px 10px 40px; margin: 0; font-weight: 300; font-size: 30px;  width: 100%; color: #213279; background: url(../img/svg-telefoon.svg) no-repeat left center; background-size: auto 26px; }
#inhoud.vervolgpagina .zijmenu .tel:hover{ text-decoration: none; }




#inhoud.vervolgpagina h1{ font-size: 41px; padding-bottom: 15px; color: #364385; padding: 0 0 10px 0;  }
#inhoud.vervolgpagina h2{ font-size: 20px; padding-bottom: 15px; border-bottom: 2px solid #ddd; margin-bottom: 20px; color: #333; padding: 20px 0 20px 0; }
#inhoud.vervolgpagina h3{ font-size: 16px;	color: #364385; padding: 20px 0 10px 0;  }



#inhoud.vervolgpagina ul{ list-style-position:outside; padding: 10px 0 20px 35px; list-style-type: disc; position: relative; float: left; width: 100%; }
#inhoud.vervolgpagina ol{ list-style-position:outside; padding: 10px 0 20px 35px; list-style-type: decimal; position: relative; float: left; width: 100%; }
#inhoud.vervolgpagina p{ padding: 10px 0 10px 0; }
#inhoud.vervolgpagina a{ color: #0052A0; text-decoration: underline; }
#inhoud.vervolgpagina a:hover{ color: #0052A0; text-decoration: underline; }
#inhoud.vervolgpagina img{ max-width: 100%; height: auto;  }

#nieuws { border-bottom: 2px solid #eee; padding-bottom: 80px; }

.nieuwsitem{ position: relative; float: left;	width: 100%;  margin: 0 0 50px 0; height: 140px; }
.nieuwsitem .left{	position: absolute; top:0px; left: 0px; width: 130px; height: 130px;  }
.nieuwsitem .right{	position: relative; float: left; width: 100%; padding-left: 160px; box-sizing: border-box; color: #333;  }
.nieuwsitem .right .title  { color: #000; font-family: 'PT Serif', serif;  padding-bottom: 3px; font-size: 23px; }
.nieuwsitem .right .title span { position: relative; float: left; border-bottom: 1px solid #DDDDDD; padding: 0 5px 10px 0; }


.nieuwsitem .left:before{ content:''; position: absolute; top: -5px; left: -5px; right: -5px; bottom: -5px; transition: all .2s linear; -o-transition: all .2s linear;    -moz-transition: all .2s linear;    -webkit-transition: all .2s linear; }

    
.nieuwsitem:hover .right .title span{  border-bottom: 1px solid #364385; }
.nieuwsitem:hover .left:before{ border: 1px solid rgba(0,0,0,0.2); }
.nieuwsitem:hover .leesverder{  text-decoration: underline; }

.nieuwsitem .right .cat  { color: #000; font-family: 'PT Serif', serif;  padding-bottom: 3px; font-size: 14px; }
.nieuwsitem .right .leesverder  {  font-weight: bold; padding-top: 5px; color: #1F3279; }
.nieuwsitem .left img { width: 100%; height: auto;    }
.nieuwsitem .left .datum { color: #fff; }

.nieuwsitem:hover .right .title{ text-decoration: underline; }
.nieuwsberichtintrotekst { font-weight: bold; font-size: 15px; }
.nieuwsberichtdatum{ padding-bottom: 40px; font-size: 11px; }
.nieuwsberichttekst{ }
.nieuwsdetailsintro{	box-sizing: border-box; padding-left: 160px; min-height: 170px; }
.nieuwsdetailsintro img{	position: absolute; left: 0px; top: 0px; width: 130px; height: auto; }
.nieuwsdetailsintro h3 { font-weight: normal; font-size: 16px; padding: 0 0 10px 0!important; color: #333!important;  }
.nieuwsdetailsintro h3 span{ position: relative; float: left; border-bottom: 2px solid #DDDDDD; padding: 0 5px 20px 0; font-size: 20px;  }

#inhoud.vervolgpagina .zijmenu .linkblok { padding-bottom: 40px;  }
#inhoud.vervolgpagina .zijmenu .linkblok h3{font-weight: normal; font-size: 18px; padding: 0 0 20px 0!important; margin-bottom: 10px; color: #333!important; border-bottom: 1px solid #DDDDDD;  }
#inhoud.vervolgpagina .zijmenu .linkblok a{ position: relative; float: left; width: 100%; font-size: 13px; font-weight: bold; text-transform: uppercase; box-sizing: border-box; padding: 5px 50px 0 0; background: url(../img/svg-pijl-blauw-rechts.svg) no-repeat 95% 5px; background-size: 5px auto; }
#inhoud.vervolgpagina .zijmenu .linkblok a:hover{ background-position: 98% 5px; padding: 5px 40px 0 10px;}
#inhoud.vervolgpagina .zijmenu .linkblok a span{ font-weight: normal; font-size: 10px; color: #666; padding-top: 3px; }
#inhoud.vervolgpagina .zijmenu .linkblok.vastgepinde { padding-bottom: 20px; }
#inhoud.vervolgpagina .zijmenu .linkblok.bijpassend { padding-bottom: 20px; }
#inhoud.vervolgpagina .zijmenu .linkblok.vastgepinde h3{ background: url(../img/svg-vastgepint.svg) no-repeat right 10px top; background-size: 20px auto; }

#inhoud.vervolgpagina .zijmenu .btn { width: 100%; }
#inhoud.vervolgpagina .zijmenu .btn.active { margin-top: -5px; color: #fff; background: #364385 url(../img/svg-pijl-wit-links.svg) no-repeat 20px center; background-size: 6px auto; padding-left: 40px; margin-bottom: 30px;}

@media screen and (min-width: 1024px) and (max-width: 1319px) {
	#paginaheader { padding-top: 200px; }
	#paginaheader h3{ font-size: 41px; font-weight: normal;padding: 0 0 30px 0; width: 430px;  }	
	
	#inhoud.vervolgpagina .zijmenu{ top: -150px; }
	#inhoud.vervolgpagina.dubbelregel .zijmenu{ top: -200px; }
	

}

@media screen and (min-width: 740px) and (max-width: 1023px) {

	
	#paginaheader { margin-top: 70px; height: 250px;     padding: 70px 0 0 0; }
	#paginaheader.nieuwsvervolg { height: 180px; }
	#paginaheader h3 { font-size: 30px; width: 330px; }
	
	#inhoud.vervolgpagina .zijmenu {  width: 250px; padding: 25px; top: -150px;   }
	#inhoud.vervolgpagina .content.zijmenucontent{     padding: 0 290px 50px 0;	 }
	#inhoud.vervolgpagina .zijmenu a { font-size: 11px; }	

	.nieuwsitem .left{ width: 80px; height: 80px; }
	.nieuwsitem .right{ padding-left: 100px; }
	.nieuwsitem .right .title span { font-size: 18px; }
	.nieuwsitem  {  font-size: 13px;  }
	
	#inhoud.vervolgpagina.dubbelregel .zijmenu{ top: -180px; }
	
	#kruimelpad .content h1{ font-size: 28px; padding-right: 290px; }	
}


@media screen and (min-width: 1px) and (max-width: 739px) {
	#paginaheader { margin-top: 120px; height: 150px;     padding: 40px 0 0 0; }
	#paginaheader.nieuwsvervolg { height: 110px; }
	#paginaheader h3 { font-size: 16px; width: 180px; font-weight: bold; }
	
	#inhoud.vervolgpagina .zijmenu { display: none; }
	#kruimelpad .content h1{ font-size: 20px; padding-right: 0px; }
	#kruimelpad { padding: 25px 0 20px 0; }
	#kruimelpad .content .kruimellinks { margin-top: 5px; }
	
	#kruimelpad .content .kruimellinks { white-space: nowrap;     overflow: hidden;    text-overflow: ellipsis; }
	
	
	#inhoud.vervolgpagina .content.zijmenucontent{     padding: 0;	min-height: auto; }
	
	.nieuwsitem .left{ width: 50px; height: 50px; }
	.nieuwsitem .right{ padding-left: 70px; }
	.nieuwsitem  {  font-size: 12px;  }
	.nieuwsitem .right .title span { font-size: 16px; }
	
	.nieuwsdetailsintro{ padding: 0; }
	.nieuwsdetailsintro h3 span { box-sizing: border-box; padding-left: 70px; min-height: 70px; }
	.nieuwsdetailsintro img { width: 50px; }
	.nieuwsberichtintrotekst{
		position: relative;
		float: left;
		width: 100%;
	}
	
}