:root {
	/*
	hamburgerknop
	*/
	--hamburgerKleur:#3298d9;
	
	/*
	hoofdmenu
	*/
	--hoofdMenuMinimaleHoogte:60px;
	--hoofdMenuAchtergrondKleur:transparant;
	--hoofdMenuAchtergrondStickyKleur:#3298d9;
	--hoofdMenuAchtergrondStickyKleurMobiel:#3298d9;
	--hoofdMenuAchtergrondStickyHoogte:60px;
	--hoofdMenuTekstKleur:#fff;
	--hoofdMenuTekstKleurMobiel:#fff;
	--hoofdMenuActieveTekstKleur:#09649e;
	--hoofdMenuActieveTekstKleurMobiel:#09649e;
	--hoofdMenuHoverTekstKleur:#09649e;
	--hoofdMenuHoverTekstKleurMobiel:#09649e;
	--hoofdMenuStickyLogoHoogte:50px;
	
	/*
	uitklapmenu
	*/
	--uitklapmenuTopBorderKleur:  #3298d9;
	--uitklapmenuSubMenuTekstKleur: #000;
	--uitklapmenuSubMenuHoverTekstKleur: #3298d9;
	--uitklapmenuSubMenuActieveTekstKleur:#3298d9;
	--uitklapmenuSubMenuTekstKleurMobiel: #000;
	--uitklapmenuSubMenuHoverTekstKleurMobiel: #FFF;
	--uitklapmenuSubMenuActieveTekstKleurMobiel:#FFF;
	--uitklapmenuAchtergrondMobiel:  #a8d3ef;
	
	/*
	header
	*/
	--fullheaderAchtergrondKleur:transparant;/*hele breedte*/
	--logoBreedte:25%;
	--logoMaxBreedte:400px;
	--logoBreedteMobiel:60%;
	--logoMaxBreedteMobiel:300px;
	--tekstInspringMobiel:0;/*om evt ruimte te geven voor logo*/
	--headerTekstAfstandTopMobiel:35px;
	--navInspring:0;/*logoBreedte + een marge*/
	--tekstbreedte:70%;
	--tekstbreedteMobiel:60%;
	--fotobreedte:22%;
	--fotobreedteMobiel:32%;
	--fotoMaxbreedte:340px;

	
	/*
	hoofdteksten
	*/
	--standaardFont: 'Karla', Arial,sans-serif;
	--tekstKleur:#111;
	--inleidingKleur:#0a78be;
	
	/*
	koppen
	*/
	--titelFont: 'Nunito',Arial,sans-serif;/*'Karla', Arial,sans-serif*/
	--titelWeight: 600;
	--kopKleur:#0a78be;
	--kopKleurZijkant:#FFF;
	--datumTekstKleur:#eb931b;
	--NieuwsKopTekstKleur:#2e3087;
	--datumStartTekstKleur:#f38f0c;
	
	/*
	Quotes
	*/
	--quoteKleur:#65B0E2;
	--quoteAchtergrondKleur: #a8d3ef;
	--quoteTekstKleur:#fff;
	--quotePersoonTekstKleur:#3498DA;
	
	/*
	links
	*/
	--linkKleur:#bc7616;
	--linkHoverKleur:#eb931b;
	
	/*
	vlakken achter formulieren
	*/
	--formAchtergrondKleur:#f6f6f6;
	--formTekstKleur:#000;	
	
	/*
	Datum vlakjes
	*/
	--datumvakAchtergrondKleur:#dc1280;
	--datumvakTekstKleur:#FFF;
	
	/*
	button
	*/
	--buttonAchtergrondKleur:#0a78be;
	--buttonTekstKleur:#FFF;
	--buttonHoverAchtergrondKleur:#0D94EE;
	--buttonHoverTekstKleur:#FFF;
	
	/*
	submenu rechts
	*/
	--subMenuAchtergrondKleur:#a8d3ef;
	--subMenuTekstKleur:#FFF;
	--subMenuTekstActieveKleur:#0a78be;
	
	/*
	carrousel
	*/
	--bolletjeAchtergrondKleur:#FFF;
	--bolletjeAchtergrondKleurActief:#fab06a;
	
	/*
	intro gekleurd vak
	*/
	--introHomeTekstKleur:#FFF;
	--introAchtergrondGrootte: 100% 100%;/*100% 100% als hij horizontaal en vertikaal moet sizen, anders 100%*/
	
	/*
	tabellen
	*/
	--rijKleur1:#F3FAF3;
	--rijKleur2:#E7F3E8;
	--rijDonkereKleur:#9fd3a1;
	
	/*
	hoogtepunten  (indien in gebruik, soms ook bij introducties)
	*/
	--HoogtepuntenKopKleur:#FFF;
	--HoogtepuntenBGKleur:#efefef;
	--hoogtepuntenImageRadius:100%;
	
	
	/*
	drie kolommen kleuren (indien in gebruik, bij de componenten)
	*/
	--KolomAchtergondkleur1:#f39200;
	--KolomTekstkleur1:#fff;
	--KolomAchtergondkleur2:#e6007e;
	--KolomTekstkleur2:#fff;
	--KolomAchtergondkleur3:#009ce2;
	--KolomTekstkleur3:#fff;
	--KolomAchtergondkleur4:#efefef;
	--KolomTekstkleur4:#fff;
	--KolomAchtergondkleur5:#efefef;
	--KolomTekstkleur5:#fff;
	--KolomAchtergondkleur6:#efefef;
	--KolomTekstkleur6:#fff;
	--KolomAchtergondRadius: 20px;
	
	/*
	Afrondingen plaatjes en kaders
	
	*/
	--borderRadius:20px;
	--HeaderFotoborderRadius:100%;
	--MedewerkerFotoborderRadius:50%;
	
	/*
	footer
	*/
	--footerAchtergrondKleur:#a8d3ef;
	--fullfooterAchtergrondKleur:#a8d3ef;/*hele breedte*/
	--footerTekstKleur:#FFF;
	--schoolSiteBannerAchtergrondKleur:#a8d3ef;
	
}

/*
extra classes voor knoppen, die ook in de areas.css staan van de klant in de map cp/css
*/

.groeneknop, .nieuwsbericht a.groeneknop, .vacature a.groeneknop{
	background-color:#3c913d;	
	color: #FFF!important;	
	border-radius:10px;
	padding:16px 24px;
	margin-right:20px;
	margin-bottom:20px;
	text-decoration:none;
	font-weight:700;
	display: inline-block;
}
.groeneknop:hover{
	color: #FFF!important;	
	text-decoration:none;
	background-color:#46AA46;	
}
.blauweknop, .nieuwsbericht a.blauweknop, .vacature a.blauweknop{
	background-color:#0a78be;	
	color: #FFF!important;	
	border-radius:10px;
	padding:16px 24px;
	margin-right:20px;
	margin-bottom:20px;
	text-decoration:none;
	font-weight:700;
	display: inline-block;
}
.blauweknop:hover{
	color: #FFF!important;	
	text-decoration:none;
	background-color:#0D94EE;	
}
.bannerwrapper{
	margin-top:-20px;	
	max-width:1700px;
}
.hometekstvatter{
	max-width:1400px;
}
.headerbg{
	padding-top:0;
}
.header-nav {
	 top: 10px;
}
.header-logo{
	position:relative;
	margin: 10px auto;
	left:0;
}
.header-foto-div{
	bottom:-40px;	
	position:absolute;
	right:0;
}
.header_img, .header_img_breed{
	margin-bottom:30px;	
}
.menu-link{
	font-size:17px;		
}
.justify-content-lg-center {
	/*justify-content: normal !important;*/
}
@media (max-width: 992px){
	.header-foto-div{
		top:100px;
		z-index:-1;
	}
	.headerbg {
		z-index: 2;
	}
	#primary-menu-trigger, #page-menu-trigger {
		z-index: 3;
		top:28px;
	}
	.primary-menu{
		width:100%;	
		
	}
	.full-header .primary-menu .menu-container{
		border-radius:20px;
	}
}