@import url(https://db.onlinewebfonts.com/c/2ece2ca570f9b741d03cd6305ce9f8d5?family=Noyh+R+W01+SemiLight);

:root, [data-bs-theme=light] {
	
	--lichtgroen: #b1b92f;
	--donkergroen: #223d31;
	--lichtblauw: #ADD8E5;
	--blauw: #05a3d5;
	--wit: #FFF;
	--zwart: #000;
	
	--oranje: #ffbd0a;
	--donkeroranje: #ef5921;
	--groen: #91b707;
	--turqoise: #2dc7c3;

	/*basiskleuren*/
	--cnvs-themecolor:var(--blauw);
	--cnvs-link-color:var(--blauw);
	
	/*header*/
	--cnvs-header-bg:#FFF;
	--cnvs-header-height: 160px;
	--cnvs-header-padding-y: 10px;/*logo*/
	--cnvs-header-height-shrink: 100px;
	--cnvs-header-padding-y-shrink: 10px;
	
	
	
	/*standaard hoofdmenu desktop*/
	--hoofdmenu-btn-bg: var(--blauw);
	--hoofdmenu-btn-color:var(--wit);
	--hoofdmenu-btn-radius:10px;
	--hoofdmenu-btn-bg-hi: var(--groen);
	--hoofdmenu-btn-color-hi:var(--wit);
	--hoofdmenu-btn-radius-hi:10px;
	--hoofdmenu-btn-gap:25px;
	
	/*standaard hoofdmenu mobiel*/
	--mob-hoofdmenu-btn-bg: none;
	--mob-hoofdmenu-btn-color:#000;
	--mob-hoofdmenu-btn-radius:0;
	--mob-hoofdmenu-btn-bg-hi: none;
	--mob-hoofdmenu-btn-color-hi:var(--blauw);
	--mob-hoofdmenu-btn-radius-hi:0;
	
	/*afwijkend hoofdmenu desktop*/
	--hoofdmenu-btn-different-color-bg: #FFF;
	--hoofdmenu-btn-different-color: #1C6D6C;
	--hoofdmenu-btn-different-color-bg-hi: #FFC03E;
	--hoofdmenu-btn-different-color-hi: #1C6D6C;
	
	/*afwijkend hoofdmenu mobiel*/
	--mob-hoofdmenu-btn-different-color-bg: none;
	--mob-hoofdmenu-btn-different-color: #fff;
	--mob-hoofdmenu-btn-different-color-bg-hi: none;
	--mob-hoofdmenu-btn-different-color-hi: var(--blauw);
	
	/*standaard submenu desktop*/
	--submenu-btn-color-bg:none;
	--submenu-btn-color:var(--zwart);	
	--submenu-btn-color-bg-hi:none;
	--submenu-btn-color-hi:var(--blauw);
	--submenu-tussen-lijn:1px solid var(--lichtblauw);
	
	/*standaard submenu mobiel*/
	--mob-submenu-btn-color-bg:none;
	--mob-submenu-btn-color:var(--zwart);	
	--mob-submenu-btn-color-bg-hi:none;
	--mob-submenu-btn-color-hi:var(--blauw);
	--mob-submenu-tussen-lijn:1px solid #fff;
	
	/*submenu rechts */
	--subnavrechts-color-bg:var(--blauw);
	--subnavrechts-color: #fff;
	--subnavrechts-radius: 25px;
	--subnavrechts-color-bg-hi: var(--groen);
	--subnavrechts-color-hi:var(--wit);
	
	/*font*/
	--cnvs-body-font: 'Noyh R W01 SemiLight', serif;
	--cnvs-primary-font: 'Noyh R W01 SemiLight', serif;
	--cnvs-secondary-font: var(--cnvs-primary-font);
	--cnvs-line-height-base:1;
	--cnvs-font-size-body:23px;
	--bs-body-font-weight:400;
	--bs-body-font-style:normal;
	--bs-body-line-height:1.3;
	--cnvs-line-height-content: 1.3;
	
	/*input*/
	--bs-border-width: 1.5px;
	--bs-border-color: #94A0AD;
	
	/*inhoud blokken*/
	--cnvs-content-padding: 2rem;
	--cnvs-section-margin: 1rem;
	
	/*koppen*/
	--cnvs-font-size-h1: 2.25rem;
	--cnvs-font-size-h2: 1.875rem;
	--cnvs-font-size-h3: 1.625rem;
	--cnvs-font-size-h4: 1.375rem;
	--cnvs-font-size-h5: 1.125rem;
	--cnvs-font-size-h6: 0.875rem;
	
	
	--cnvs-heading-color:#2c2c2c;
	--cnvs-headings-font-weight:700;
	
	
	/*knoppen*/
	--knop-kleur:#FFF;
	--knop-bgkleur: var(--groen);
	
	--bs-body-bg: #ECFBFF;

}
.portfolio, [class*=portfolio-] {
	--cnvs-portfolio-desc-title-size: 1.7rem;/*portfolio koppen */
}
#header{
	--cnvs-primary-menu-font:'Noyh R W01 SemiLight', sans-serif;
	--cnvs-primary-menu-submenu-font: var(--cnvs-primary-menu-font);
	--cnvs-primary-menu-font-weight: 700;
	--cnvs-primary-menu-hover-font-weight: 700;
	--cnvs-primary-menu-submenu-font-weight: 700;
	--cnvs-primary-menu-submenu-hover-font-weight: 700;
	--cnvs-primary-menu-font-size: 22px;
	--cnvs-primary-menu-submenu-font-size: 17px;
	--cnvs-primary-menu-tt:none;
	--cnvs-primary-menu-ls:1.1;/*letter spacing, moet met px als je wilt gebruiken*/
	--cnvs-primary-menu-color:var(--donkergroen);/*menu pijltjes*/
}

#bgmain .container{
	background: var(--bs-body-bg);
	background-size:80%;
	height:100%;
	z-index:0;
}
#content{
	margin-bottom:30px;
}
/* header */

.streep-onder-intro{
	background: var(--bs-body-bg);
}

.hoogtepunten .oc-item{
	padding-left:0 !important;
}
.subnav{
	background: var(--bs-body-bg);
	border-bottom-left-radius:80px;
	padding-bottom:60px;
}
.oc-item {
	margin: 10px;
	width: calc(33.33333333% - 20px) !important;
}

@media only screen and (max-width:992px) {	
	.oc-item{
		margin:0;
		 width: 100% !important;	;	
	}
}

body{
	line-height: var(--bs-body-line-height);
}
/* koppen */

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
	margin: 0 0 16px 0;
	font-family: "Noyh R W01 SemiLight", sans-serif;
	font-weight: 700;
	font-style: normal;
}
.intro h1, .intro h2, .intro h3, .intro h4, .intro h5,.intro h6 {
	margin-bottom:5px;
	margin-top:5px;
}
.button.button-circle{
	border-radius:10px;	
}
/*inhoud*/

.intro{
	/*
	background-color:#D7F1F4;
	color:#505050!important;
	*/
}
.intro-heel{
	padding-top:80px !important;
	padding-bottom:80px !important;	
}
.hoogtepunteninleiding{
	text-align:center;
	margin-top:50px;
	margin-bottom:50px;
}

.hoogtepunteninleiding h2{
	font-size: 44px;
	line-height: 1.3;
}
.hoogtepunteninleiding h2:before {
	content: "";
	background-color: #a7aaad;
	width: 15%;
	height: 1px;
	display: block;
	margin: 0px auto;
	position: relative;
	top: 63px;
}
.hoogtepunteninleiding h2:after {
	content: "";
	background-color: #ffbd0a;
	width: 60px;
	height: 3px;
	display: block;
	margin: 4px auto;
	position: absolute;
	left: calc(50% + 15px);
	top: 58px;
	transform: translateX(-50%);
}
.instawrapper{
	margin-top:30px;
	margin-bottom:30px;
}
/* voor witte strook onder */
.bgfsheader, .bgfsheaderZonderFoto {
	background: #05a3d5;
	color: #FFF !important;
}
.bgfsheader {
	/*box-shadow: inset 0 -0 0 #FFF;*/
}
.intro-left-met-text{
	padding-bottom:80px!important;
}
.titel-inspring {
	margin-left: 0;
}
.intro-left, .bloklinks, .tekst {
	
}
.inhoudblok .bloklinks{
	
}
.inhoudblok{
	margin-right:0 !important;
}
.blokrechts {
	padding-right:0 !important;
}
.intro-right-big{
	border-bottom-left-radius:80px;
	overflow:hidden;
	/*margin-bottom: -80px;*/
}
.intro-right-small{
	border-bottom-left-radius:60px;
	overflow:hidden;
	/*margin-bottom: -80px;*/
}

.downloads{
	padding-left:0!important;	
}
@media only screen and (max-width:992px) {	
	.intro-left, .border-btm-intro .intro-left {
		margin-top:0!important;
	}
	.titel-inspring {
		margin-left: 2rem;
	}
	.intro-left, .bloklinks, .tekst {
		
	}
	.blokrechts {
		padding-right:2rem !important;
	}
	.intro-right-content{
		margin-bottom:30px;	
	}
	.intro-left-met-text{
		padding-bottom:30px!important;
	}
	.streep-onder-intro{
		display:none;	
	}
	.intro-right-big , .intro-right-small{
		border-bottom-left-radius: 0;
	}
	.intro-right{
		margin-bottom:0;	
	}
	.intro-left-content{
		padding-bottom:10px;	
	}
	.inhoudblok{
		margin-right:0 !important;	
	}
	.nieuws-links{
		padding-right:0!important;	
	}
	#logo, .downloads{
		padding-left:2rem !important;
	}
}

.homeintroimage{
	width:120px;
	position:absolute;
	bottom:60px;
	right:30px;		
}
.schoolnaam{
	display:table;	
}
.schoolicoon{
	float:left;
	height:30px;	
	padding-right:8px;
}
.schoolicoonlijst{
	float:left;
	height:44px;	
	margin-top:-10px;
	padding-right:14px;
}

.schoollijstje{
	background-color:#1C6D6C;
	border-bottom-left-radius:120px;
	padding:24px 24px 24px 80px!important;
	font-family: "Noyh R W01 SemiLight", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size:19px;
	color:#FFF;
}
.schoollijstje a{
	color:#FFF!important;
}

.schoollijstje-links h2{
	color:#31B3CC;
}
.schoollijstje-links img{
	width:60%;
	max-width:200px;
}
.schoolfoto{
	width:100%;
}
.pijl{
	padding-left:6px;
	width:28px;
	margin-top:-4px;
}
.entry-image img{
	border-bottom-right-radius:40px;
	overflow:hidden;
}
@media only screen and (max-width:1200px) {	

	.schoollijstje{
		font-size:16px;
		padding-left:70px!important;
		padding-right:10px!important;
		border-bottom-left-radius:60px;
	}
	
}
@media only screen and (max-width:992px) {	
	.homeintroimage{
		bottom:20px;	
	}
	.schoollijstvak{
		padding:0;	
		
	}
	.schoollijstje{
		padding-left:40px!important;
		font-size:18px;
		margin:0!important;
	}
	
}
.device-down-lg .intro-right{
	
}
.intro h1, .intro h2, .intro h3, .intro h4, .intro a{
	color:#FFF;
}

.intro h1{
	
}
.intro h1 .editabletitel{
	
}
.intro a, .intro a:not(.btn-link):not(.text-decoration-underline):not(.more-link) {
	text-decoration:underline !important;
	color:#505050 !important;
}
.carousel-caption h3{
	text-shadow: 0 0 20px RGBA(0,0,0,0.8);
}
.inleidingkleur{
	color:#909E24;	
	font-weight:700;
	margin-bottom:24px;
}
.tekst{
	margin-bottom:36px;
}

.portfolio-desc {
	background-color:#FFF;
	border-top-left-radius:30px;
	border-bottom-right-radius:30px;
	margin-top:-30px;
	padding: 50px 30px 40px 30px;
}
.hp-1, .hp-4, #hoogtepunten .owl-item:nth-child(1), #hoogtepunten .owl-item:nth-child(4){
	background-color: var(--oranje);
	border-radius:10px;
}
.hp-2, .hp-5, #hoogtepunten .owl-item:nth-child(2), #hoogtepunten .owl-item:nth-child(5){
	background-color: var(--groen);
	border-radius:10px;
}
.hp-3, .hp-6, #hoogtepunten .owl-item:nth-child(3), #hoogtepunten .owl-item:nth-child(6){
	background-color: var(--blauw);
	border-radius:10px;
}
#hoogtepunten a.bg-btn {
	background-color: transparent;
	color: #FFF !important;
	border:2px solid #FFF;
	
}
.portfolio-desc h3 a, .portfolio-desc .h3 a{
	color: #FFF !important;
}
.hoogtepunt-btn-div{
	left:20px;	
}
.portfolio-item .portfolio-image{
	padding:10px;	
	border-radius:10px;
}
.portfolio-desc{
	background-color:transparent;
	color:#FFF;	
}
.portfolio-desc h1, .portfolio-desc h2, .portfolio-desc h3, .portfolio-desc h4, .portfolio-desc a{
	color:#fff;
}
#related-portfolio .owl-item {
	border-bottom-right-radius:30px;
}
/* inhoud  blokken bg */
.losseblokken {
	background-color:#FFF;
}
.bgblauw{
	background-color:#05a3d5;
	color:#000;
	padding-top:40px;
	padding-bottom:30px;
}
.bgblauw h1,.bgblauw h2,.bgblauw h3, .bgblauw h4{
	color:#FFF;
}
.bglichtblauw{
	background-color:#D7F1F4;
	padding:40px 0 30px 0;
}
.bglichtblauw h1,.bglichtblauw h2,.bglichtblauw h3, .bglichtblauw h4{
	color:#31B3CC;
}
.bglichtgeel{
	background-color:#FFFFD7;
	color:#394271;
	padding:40px 0 30px 0;
}
.bglichtgeel h1,.bglichtgeel h2,.bglichtgeel h3, .bglichtgeel h4{
	color:#394271;
}
.bloklinks, .blokrechts{
	padding-bottom:30px;	
}
.nieuws-links img{
	opacity:0;	
}
.onderelkaar .nieuws-links img{
	opacity:1;	
}
.nieuws-links, .nieuws-rechts{
	margin-bottom:40px;
}
.bgwitpatroon .bloklinks{
	font-size:24px;
	align-self: end;
	padding-bottom:50px;
}
.bgwitpatroon{
	background: #FFF;
	position: relative;
}
.bgwitpatroon .blokrechts{
	align-self: end;
	padding-bottom:50px;
}
.bgwitpatroon  .row{
	background: url('../images/lblauwbgrechts.png') no-repeat top right;
	background-size:40%;
}
/*footer*/

#footer {
	background:#05a3d5;
	color:#FFF;
	
}
.footertop{
	height:0;
}

#footer a, #footer h1, #footer h2, #footer h3{
	color:#FFF;	
}
.logo-btm{
	width:80%;
}
.device-down-lg .logo-btm{
	width:200px;
}


/*knoppen*/
 a.geleknop {
	display:table;
 	margin-top:16px;
	color:#1C6D6C;
	background-color:#FFC03E;
	padding: 12px 30px;
	border-radius: 50rem;
	text-decoration: none !important;
	cursor:pointer;
	font-weight:500;
}
a.bg-btn, .portfolio-desc span, .portfolio-desc span a, a.geleknop {
	background-color:var(--knop-bgkleur);
	color:var(--knop-kleur)!important;
}
a.bg-btn {
	margin-top:25px;
}
a.bg-btn:hover, a.geleknop:hover{
	background-color:var(--knop-bgkleur);
	color:var(--knop-kleur)!important;
}
.intro-left .bg-btn{
	background-color:var(--knop-bgkleur);
	color:var(--knop-kleur)!important;
	margin-top:25px;
}
.bg-btn-contact-footer{
	background-color:#FFF;
	color:#909E24!important;	
	margin-top:0;
}
.bg-btn-contact-footer:hover{
	background-color:#924C8A;
	color:#fff!important;	
}

.intro .intro-left-content a, .intro .intro-left-content a:not(.btn-link):not(.text-decoration-underline):not(.more-link) {
	color:#FFF !important;	
}