@charset "utf-8";
/* CSS Document *

/*-------------------------------------------------------------------------------------*/
/*GENERAL -----------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

* {
	margin: 0;
}

html, body {
	padding:0px;
	margin:0px;
	height:100%;
}
body {
	font-family: 'Overlock', cursive;
	font-size: 15px;
	color:#474747;
	background: #ffffff;
	line-height: 22px;
}

body.popup {
	background-color:white; 
	background-image:none;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Londrina Solid', cursive;
}

a {color:#eb5c1e; text-decoration:none;}
a:hover {color:#eb5c1e; text-decoration:underline;}
a:active {text-decoration:none; background:none;}

img {max-width:100%;}

.text-orange {color: #FA8900;}
.text-pink {color: #E91C74;}

.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -182px;
	-webkit-transition: padding-top 0.5s;
    -moz-transition: padding-top 0.5s;
    -ms-transition: padding-top 0.5s;
    -o-transition: padding-top 0.5s;
    transition: padding-top 0.5s;
}

.wrapper.active {
	padding-top:35px;
	-webkit-transition: padding-top 0.5s;
    -moz-transition: padding-top 0.5s;
    -ms-transition: padding-top 0.5s;
    -o-transition: padding-top 0.5s;
    transition: padding-top 0.5s;
}

.push {
	height: 182px;
}

.button {
	background-color:#77b02b;
	height:33px;
	padding:0 17px;
	border:none;
	line-height:33px;
	color:#ffffff;
	text-decoration:none;
	display:block;
	/* text-transform:uppercase; */
}

.button:hover {
	color:#ffffff;
	text-decoration:none;
	background-color:#1f9f38;
}

/*-------------------------------------------------------------------------------------*/
/*HEADER ------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

.header {
	height:110px;
	position:relative;
	z-index:501;
}

.header .logo {
	display:block;
	/* margin:23px 0 0 0; */
	width:256px;
	height:106px;
	text-align:center;
	position:absolute;
}

.slideshow, #slideshow {
	width:100%!important;
	/* height:432px!important; */
}

.slideshow img {
	min-height: 100%;
    min-width: 100%;
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
    display: block;
    top: 50%!important;
    left: 50%!important;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}

/*-------------------------------------------------------------------------------------*/
/*SEARCH ------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

.headerRight {
	float:right;
	margin:14px 0 0 0;
}

.headerRight .button {
	float:left;
	margin:0 12px 0 0;
	position:relative;
	padding-right:40px;
}

.headerRight .enroll {
	background-color:#bd2c6e;
}

.headerRight .button::after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
	pointer-events:none;
	top:0;
	right:11px;
	font-size:19px;
}

.headerRight .enroll::after {
	content: "\f234";
}

.headerRight .portal {
	background-color:#eb5c1e;
}

.headerRight .portal::after {
	content: "\f023";
}

.headerRight .button:hover {
	background-color:#1f9f38;	
}

.searchToggle {
	background:#77b02b;
	width:33px;
	height:33px;
	display:block;
	cursor:pointer;
	position:relative;
	float:right;
	z-index:501;
}

.searchToggle:hover {
	background-color:#1f9f38;
}

.searchToggle::after {
    content: "\f002";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    top: 6px;
    left: 8px;
	pointer-events:none;
	font-size:19px;
	color:#ffffff;
}

.searchToggle.active::after {
	content: "\f00d";
}

.searchWrapperOnsite {
    z-index: 502;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
	margin-top:-35px;
	-webkit-transition: margin-top 0.5s;
    -moz-transition: margin-top 0.5s;
    -ms-transition: margin-top 0.5s;
    -o-transition: margin-top 0.5s;
    transition: margin-top 0.5s;
}

.searchWrapperOnsite.active {
	margin:0;
}

.searchWrapperOnsite input {
	width:100%;
	height:35px;
	background:#f7f7f7;
	border-radius:0;
	border:none;
	color:#474747;
	padding:0 15px;
	line-height:35px;
	float:left;
}

::-webkit-input-placeholder {color: #474747;}
:-moz-placeholder {color: #474747;}
::-moz-placeholder {color: #474747;}
:-ms-input-placeholder {color: #474747;}

.searchWrapperOnsite .searchOnsiteSubmitWrapper {
	position:relative;
	width:35px;
	height:35px;
	float:left;
	margin-left:-35px;
	background:#77b02b;
}

.searchWrapperOnsite .searchOnsiteSubmitWrapper a {
	width:35px;
	height:35px;
	display:block;
}

.searchWrapperOnsite .searchOnsiteSubmitWrapper a::after {
	content: "\f002";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    top: 6px;
    left: 9px;
	pointer-events:none;
	font-size:19px;
	color:#ffffff;
}

/*-------------------------------------------------------------------------------------*/
/*MENU --------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

.navbar-header {
	float:none;
}
.mainMenu {
	width:100%; 
	z-index:999;
	padding-right:20px;
	margin-bottom:30px;
	margin-top:31px;
}

ul.cssMenu {
	cursor:default; 
	text-align:left;
	padding: 0 0 0 0;
	list-style:none;
	list-style-type: none; 
	width:100%;
	margin: 0;
}

ul.cssMenu li.homeMenu {
	cursor:pointer;
	color:#ffffff;
}

ul.cssMenu li {
	line-height: 25px; 
	list-style-type: none; 
	display:block; 
	clear:both; 
	margin:0; 
	padding:5px 15px 5px 15px;
	color: #ffffff; 
	text-align: left;
	position:relative;
	list-style:none;
	background:#77b02b;
	text-transform:uppercase;
	margin-bottom:8px;
}

ul.cssMenu > li:nth-child(3n+1) {background:#FA8900;}
ul.cssMenu > li:nth-child(3n+2) {background:#E91C74;}
ul.cssMenu > li:nth-child(3n+3) {background:#82BB27;}

ul.cssMenu li a { 
	line-height: 25px; 
	display: block; 
	margin: 0; 
	padding: 0;
	color: #ffffff; 
    text-decoration: none;
    display: flex;
    justify-content: space-between;
}

ul.cssMenu li a[target="_blank"]::after {
    display: inline-flex;
    align-items: center;
    font-size: .75rem;
    content: '\f35d';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: inherit;
    opacity: .5;
    margin-left: .5rem;
}

.noTouch ul.cssMenu li:hover, .noTouch ul.cssMenu li:hover a, ul.cssMenu li.pressed a { 
	color: #ffffff; 
	text-decoration:none;
}


.noTouch ul.cssMenu li.hasKids:hover a, ul.cssMenu li.hasKids.pressed a { 
	color:#ffffff;
}

ul.cssMenu li ul {
	width:240px; 
	cursor:default; 
	text-align:left; 
	position:absolute; 
	display:none;
	z-index:999; 
	margin:0; 
	padding: 0 0 0 1px;
}

ul.cssMenu li ul li {
	min-height:30px; 
	line-height:30px; 
	position:relative; 
	margin:0 0 0 0; 
	padding: 5px 20px 5px 20px; 
	text-align:left; 
	color:#ffffff;
	background:#1f9f38;
	border-bottom:1px solid #ffffff;
}

ul.cssMenu > li:nth-child(3n+1) ul li {background:#FA8900;}
ul.cssMenu > li:nth-child(3n+2) ul li {background:#E91C74;}
ul.cssMenu > li:nth-child(3n+3) ul li {background:#82BB27;}

.noTouch ul.cssMenu li ul li:hover, ul.cssMenu li ul li.pressed {
	background:#77b02b;
}

ul.cssMenu li ul li > a {word-wrap:break-word;} 


.noTouch ul.cssMenu li:hover > ul, ul.cssMenu li.pressed > ul { 
    right: -240px;
	top:0;
	display:block;
}

.navbar-collapse {max-height:none;}

@media (max-width: 991px) {
	ul.cssMenu li {padding-right:10px;}
	ul.cssMenu li ul {width:240px;}
	ul.cssMenu li ul li {padding:5px 20px;}
	.noTouch ul.cssMenu li:hover > ul, ul.cssMenu li.pressed > ul {right: -240px;}
}

/*-------------------------------------------------------------------------------------*/
/*MENU MOBILE -------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

@media (max-width: 767px) {
	.mainMenu {padding-right:0;}
	.navbar-header {height:50px;}
	
	.navbar-toggle {
		float:left;
		background:#f17900;
		width:40px;
		height:40px;
		border-radius:0;
		margin:20px 0 0 15px;
		z-index:99999;
		padding:0 8px;
    }
    
    .navbar-toggler {
        background: #f17900;
        margin-top: 20px;
    }

    .navbar-toggler:focus {outline: none;}
	
	.navbar-toggle .icon-bar {
		background:#ffffff;
	}
	
	.mainMenu {margin:0;}
	
	.navbar-collapse {
		padding:0;
		margin-left: 0;
    	margin-right: 0;
		margin-top: 19px;
		z-index:999;
		position:relative;
	}
	
	.navbar-collapse.in {overflow-y:inherit!important;}
	
	ul.cssMenu li {
		background:#f17900;
		text-align:left;
		padding:0;
		margin-bottom:0;
	}
	
    ul.cssMenu li a {
		color:#ffffff;
		padding:10px 15px;
	}
	
	.noTouch ul.cssMenu li:hover > ul, ul.cssMenu li.pressed > ul {
	    right: 0;
		position: relative;
		width: 100%;
	}

	.noTouch ul.cssMenu > li.hasKids::nth-child(2):hover, ul.cssMenu > li.hasKids.pressed:nth-child(2) {background:#1f9f38;}
	.noTouch ul.cssMenu > li.hasKids::nth-child(3):hover, ul.cssMenu > li.hasKids.pressed:nth-child(3) {background:#4a79bc;}
	.noTouch ul.cssMenu > li.hasKids::nth-child(4):hover, ul.cssMenu > li.hasKids.pressed:nth-child(4) {background:#955fa2;}
	.noTouch ul.cssMenu > li.hasKids::nth-child(5):hover, ul.cssMenu > li.hasKids.pressed:nth-child(5) {background:#eb5c1e;}
	.noTouch ul.cssMenu > li.hasKids::nth-child(6):hover, ul.cssMenu > li.hasKids.pressed:nth-child(6) {background:#e6175c;}
	.noTouch ul.cssMenu > li.hasKids::nth-child(7):hover, ul.cssMenu > li.hasKids.pressed:nth-child(7) {background:#bd2c6e;}
	.noTouch ul.cssMenu > li.hasKids::nth-child(8):hover, ul.cssMenu > li.hasKids.pressed:nth-child(8) {background:#81398e;}
	.noTouch ul.cssMenu > li.hasKids::nth-child(9):hover, ul.cssMenu > li.hasKids.pressed:nth-child(9) {background:#4a79bc;}
	
	ul.cssMenu li ul li {
		background:#77b02b;
		border-bottom:1px solid #1f9f38;
		padding:0;
	}
	
	.noTouch ul.cssMenu li ul li:hover, ul.cssMenu li ul li.pressed {
		background:#77b02b;
	}
	
	ul.cssMenu li ul li:first-child {border-top: 1px solid #1f9f38;}
	ul.cssMenu li ul li:last-child {border-bottom: none;}
	
	ul.cssMenu li ul li a {padding:10px 25px;}
	
	ul.cssMenu li ul li ul li  {
		background:#1f9f38;
		border-bottom:1px solid #1f9f38;
		padding:0;
	}
	
	ul.cssMenu li ul li ul li a {padding:10px 35px;}
}


/*-------------------------------------------------------------------------------------*/
/*CONTENT -----------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

.content {
	position:relative;
	z-index:501;
}

.slideshow-container {position: relative;}
.slideshow-container::after {
	content:"";
	background:url(/images/content.png) top center no-repeat;
	width:100%;
	height:110px;
	position:absolute;
    bottom: 0;
    z-index: 2;
}
.slideshow-image{
    height: 265px;
    background: no-repeat center center / cover;
    width: auto;
}

.content .contentColumn {
	padding-top:25px;
	padding-bottom:40px;
}

.content .contentWrapper {
	margin:0;
	padding:0;
}

.modules {
	width:100%;
	background:#f7f7f7;
	padding:30px 0 30px 0;
}


.modules .links h2 {
	color:#bd2c6e;
	font-size:23px;
	font-weight:700;
	margin:0 0 20px 0;
}

.modules .links a {
	display:block;
	text-align:left;
	background:#fff;
	margin-bottom:20px;
}

/*-------------------------------------------------------------------------------------*/
/*ALBUMOS -----------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

.albumOnSite .title {
	color:#1f9f38;
	font-size:23px;
	font-weight:700;
	margin:0 0 20px 0;
	text-align:center;
}

.albumOs {
	margin-left: -15px;
    margin-right: -15px;
	text-align:center;
}


.albumOs .albumOSContent::after {
	display:table;
	content:"";
	clear:both;
}

.albumOs .owl-item {
	float:left;
	position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
	width:33.33333333333333%;
}

.albumOs .owl-item .albumThumb {
	overflow:hidden;
	cursor:pointer;
}

.albumOs .owl-item .albumThumb img {
	width:100%;
}

.albumOs .albumsLink {
	display:none;
}

/*-------------------------------------------------------------------------------------*/
/*FOOTER ------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

.footer {
	color:#ffffff;
	line-height:22px;
	font-size:15px;
	position:relative;
	padding-bottom:5px;
	background: #f7f7f7 url(/images/footer.png) top center no-repeat;
}

.footer .footerTop {
	height: 220px;
	padding-top:58px;
}

.footer .title {
	font-weight:700;
	text-transform:uppercase;
}

.footer a {
	color:#ffffff;
}

.footer .phone, .footer .mail {
	position:relative;
	padding-left:22px;
}

.footer .phone::before, .footer .mail::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 15px;
}

.footer .phone::before {content: "\f095";}
.footer .mail::before {content: "\f0e0"; font-size:13px;}

.footer .socialIcon {
	width:37px;
	height:37px;
	background:#4a79bc;
	display:block;
	margin:8px 10px 0 0;
	float:left;
	position:relative;
}

.footer .socialIcon::after {
	font-family: 'Font Awesome 5 Brands';
    position: absolute;
    top: 8px;
    left: 11px;
    font-size: 17px;
	pointer-events:none;
}

.footer .socialIcon.twitter::after {content: "\f099";}
.footer .socialIcon.facebook::after {content: "\f09a"; left: 14px;}
.footer .socialIcon.youtube::after {content: "\f167"; left: 12px;}

.footer .socialIcon:hover {
	background:#81398e;
}

.footer .stichting {
	text-align:right;
}

.footer .stichting img {
	width: 185px;
	border-radius: 5px;
  	box-shadow: 2px 5px 10px 0px rgba(138, 138, 138, 0.2);
  	margin: 1rem 0;
}

.footer .footerBottom {
	height:30px;
	text-align:center;
	background: transparent;
	font-size:13px;
	line-height:30px;
}

.footer .footerBottom a {
	color: #fff;
}

/*-------------------------------------------------------------------------------------*/
/*MEDIA QUERIES -----------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

@media (max-width: 1199px) {
	
}

@media (max-width: 991px) {
	.header .logo {width: 175px; height: 239px;	left:-9px;}
	.header .logo img {max-width:144px;}
	.stichting span {display:none;}
	.footer .footerTop {padding-top:66px;}
	.albumOnSite .title, .modules .links h2 {font-size:21px;}
}

@media (max-width: 767px) {
	.modules .links a {text-align:center;}
	.header {height:80px;}
	.header .quickMenu {display:none;}
	.header .slideshow {position:relative;}
	.header .slogan {font-size:20px; bottom:20px;}
	.header .menu {position:relative; background: url(/images/logoMobile.png) center center no-repeat;}
	.headerRight {margin: 20px 0 0 0; position: absolute; top: 0; right: 15px;}
	.header .overlay {display:none;}
	.searchToggle {width:40px; height:40px;}
	.searchToggle::after {top: 9px; left: 12px;}
	.header .logo {max-width: 220px; margin: 0; top: 10px; height: auto; left: 50%; margin-left: -87px;}
	.search .searchToggle {width:40px; height:40px; right:15px; top:5px; margin:0; position:absolute;}
	.search .searchToggle::after {top:9px; left:11px;}
	.content::before {content:none;}
	.content {z-index:1;}
	.newsOS .newsContentItem {width:100%; margin-bottom:30px;}
	.newsOS .newsContentItem:last-child {margin-bottom:0;}
	.header .logo {max-width:220px;}
	.header .slideshow, .header #slideshow, .header .headerLeft, .header .slideshow .overlay {height:250px!important;}
	.content .contentContainer {padding-top:0;}
	.footer {text-align:center; background:none;}
	.footer .socialIcon {float:none; display:inline-block;}
	.footer .socialMedia {margin-top:10px; margin-bottom:10px;}
	.search, .search input {width:100%;}
	.searchWrapperOnsite .searchOnsiteSubmitWrapper {margin-left:-35px;}	
	.albumOnSite {margin-bottom:30px;}
	.footer .footerTop {height:auto; padding-top:10px; background: #77b02b;}
	.footer .stichting {text-align:center; margin-bottom:10px;}
}