html {width:100%;}
body {font-size:100%; font-family: 'Open Sans', sans-serif; font-weight: 300; color: #555; -webkit-text-size-adjust: 100%; -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
h1, h2, h3, .sliderHeading, .heading2, .heading3, .filterHeading {word-wrap:break-word; line-height: 120%; margin-bottom: 20px;font-family: 'Lato'}
h1, .sliderHeading {font-size: 225%; font-weight: 700; color: #6c207f;}
h1.noMargin {margin-bottom: 10px;}
h2, .heading2, .filterHeading {font-size: 155%; font-weight: 400; color: #6c207f;}
h3, .heading3 {font-size: 112.5%; font-weight: 700;}
.noResults, #searchMessage {font-size: 155%; font-weight: 400; margin-top: 20px; color: #555; display: inline-block;}
.dateTime {color: #aaa; font-size: 87.5%; margin-bottom: 20px; display: block; font-style:italic;}
.dateTime:first-letter {text-transform: capitalize;}
a {outline:0; cursor: pointer; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent;}
a:link, a:visited, a:active {text-decoration: none;}
strong {font-weight: 600; color: #000;}
em {font-style: italic;}
.partPaginationLoadMore {background-color:#6c207f; padding:13px 50px; margin:40px 0px; font-weight: 700; border-radius: 5px; text-align: center; color: #fff; -webkit-transition:background-color 0.3s; transition:background-color 0.3s; display: inline-block; cursor:pointer; position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.partPaginationLoadMore:hover {background-color: #6c207f;}
.partPaginationLoadMore.loadIcon {background-image: url('/images/style/ajax-loader.svg'); background-repeat: no-repeat; background-position: center; background-size: 28px 28px; color: transparent;}
.basicContainer {max-width: 1440px; margin:0px auto; padding: 0px 20px; min-width: 320px;}
.basicContainerSmall {max-width: 1086px;}
.basicContainerSmall .buttonContainer {background-color: rgba(108,32,127,0.05); padding:20px;}
.basicContainerSmall .partContentFileImageGallery.single {margin-bottom: 30px;}
.partClearBoth {clear:both;}
.container {background: #fff; padding: 80px 0px 80px 0px;}
.container.colorContainer {background: #6c207f; color: #fff;}
.ctaButton {background: #6c207f; display: inline-block; color: #fff;border:2px solid #6c207f; text-decoration: none; padding: 12px 14px; transition: 0.3s; font-weight: 600; margin-bottom: 20px;}
.ctaButton:link, .ctaButton:visited, .ctaButton:active {color: #fff; text-decoration: none;}
.ctaButton:hover {background: transparent; text-decoration: none; color:#6c207f; border-color: #6c207f;}
.colorContainer .ctaButton {border: 2px #fff solid;}
.colorContainer .ctaButton:hover {background: #fff; color: #6c207f;}
header#home {background-color: #F7F4F8;}
/* Start CSS */
.stickyScroll {background-color: #fff; box-shadow: 0 2px 2px -2px rgba(0,0,0,0.3); position: fixed; left: 0; top: 0; width: 100%; z-index: 1001;}
.stickyScrollGhost {height: 100px;}
.stickyScroll .basicContainer {height: 100px; display: flex; align-items: center;}
#logo {height: 64px; background: url('/images/style/logo.png') no-repeat left center; background-size: contain; width: 400px;margin-right: auto;}
.partNavigation-h {position: relative;}
#searchIcon {background: url('/images/style/icon-search.svg') no-repeat center; outline:0; border:0; cursor: pointer; background-size: contain; width: 16px; height: 16px; margin-left: 20px;}
#mobileMenuContainer {position: fixed; overflow-x:hidden; background-color:#fff; z-index: 1001; top:0; right:0; margin-right: -30%; width: 30%; height: 100%; transition: 0.5s;}
#mobileMenuContainer.mobileMenuContainerActive {margin-right: 0px; transition: 0.5s; min-width: 320px;}
#mobileMenuOverlay {transition: 0.2s; background-color: rgba(0,0,0,0.0); position: fixed; top:0; right: 0; height: 100%; width: 100%; z-index: 1000; visibility: hidden; opacity: 0;}
#mobileMenuOverlay.mobileMenuContainerActive {background-color: rgba(0,0,0,0.8); visibility: visible; opacity: 1;}
.mobileMenuOpen, .mobileMenuClose {cursor: pointer; background-repeat: no-repeat; background-position: left center; font-weight: 600; color:#6c207f;}
.mobileMenuOpen {background-image: url('/images/style/icon-bars.svg'); display: none; margin-left: 20px; padding:0px 0px 0px 30px; background-size: contain;}
.mobileMenuClose {background-image: url('/images/style/icon-cross.svg'); background-size: 16px 16px; background-position: left 20px center; display: block; padding-left: 46px; color:#d71f26; height: 100px; box-shadow: 0 2px 2px -2px rgba(0,0,0,0.3); line-height: 100px;}
.header {background-repeat: no-repeat; background-attachment: fixed; background-position: center top 100px; background-size: 100% auto; padding-top: 17.3611111111%;}
#services {background-color: #6c207f; padding:10px 0px 10px 0px; /*1px white above*/}
#services .basicContainer {padding-left: 10px; padding-right: 10px; }
#services .serviceItem {display: flex; align-items: center; flex: 1 1 auto; background-color:rgba(255,255,255,0.2);transition: box-shadow 0.5s; padding:0px 30px; font-size: 135%; margin:10px 10px; height: 92px; font-weight: 400; color: #fff; text-decoration: none; line-height: 1.2em; text-align: center; transition: 0.3s;}
#services .serviceItem:hover, #services .serviceItem.selected {box-shadow: 4px 4px 5px 0 rgba(0,0,0,0.1); background-color:rgba(255,255,255,0.4); color:#fff;border-color:#fff;}
#services .serviceItemIcon {margin-right: 14px; width: 40px; height: 40px; background-repeat: no-repeat; background-size: contain; background-position: center;}
#services .serviceItemTitle {line-height: 120%; text-align: left;}
.serviceItem:nth-child(1) .serviceItemIcon {background-image: url('/images/style/icon-stichting-okf.svg');}
.serviceItem:nth-child(2) .serviceItemIcon {background-image: url('/images/style/icon-opleiding-verzorgen.svg');}
.serviceItem:nth-child(3) .serviceItemIcon {background-image: url('/images/style/icon-opleiding-volgen.svg');}
.serviceItem:nth-child(4) .serviceItemIcon {background-image: url('/images/style/icon-vooropleidingen.svg');}
#nieuwsSlider {text-align: center;padding-bottom:60px;}
#nieuwsSlider .ctaButtonNews {}
#homeUpdates {background: #f0f0f0;}
#homeUpdates .oneSecondColumn {background-color: #fff; box-shadow: 0 1px 5px rgba(0,0,0,.08); width: calc(50% - 25px); padding:50px 50px 20px 50px; color: #555; position: relative;}
#homeUpdates .oneSecondColumn:nth-child(1) {margin-right: 25px;}
#homeUpdates .oneSecondColumn:nth-child(2) {margin-left: 25px;}
#homeUpdates .oneSecondColumn h2 { color: #6c207f;text-align: center;margin-bottom:30px;}
#homeUpdates .oneSecondColumn h2:before {display: inline-block; content:""; vertical-align: middle; margin-right: 15px;}
.oneSecondColumnLeft h2:before {background: url('/images/style/icon-calendar.svg') no-repeat left center; width: 25px; height: 25px; background-size: contain;}
#homeUpdates .oneSecondColumnRight {padding-bottom: 90px;}
.oneSecondColumnRight h2:before {background: url('/images/style/icon-uitgelicht.svg') no-repeat left center; width: 25px; height: 25px; background-size: contain;}
.oneSecondColumnRight .ctaButton {position: absolute; bottom: 30px; left: 50%; transform: translate(-50%, 0);}
#homeUpdates .oneSecondColumn h3 {margin-bottom:15px; color: #6c207f;}
#homeUpdates .oneSecondColumn h3 a {color: #6c207f; transition: 0.3s;}
#homeUpdates .oneSecondColumn h3 a:hover {color: #6c207f;}
/* Nieuws, agenda en vacatures */
#content {padding:50px 0px 30px 0px;}
.newsContainer {overflow:hidden; margin-bottom: 20px;}
.newsContainer:nth-child(even) {background-color:rgba(108,32,127,0.05)}
.newsItem {overflow: hidden;}
.newsItem .partContentFileImageGallery.single {max-width: 434px; width: 100%; float: right; margin-bottom: 0px;}
.newsContent {float: left;width: calc(100% - 434px); padding:20px 50px 20px 20px;}
.newsContent h2 {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 63px; overflow: hidden; color: #6c207f;}
.newsContent h2 a {color: #000; transition: 0.3s;}
.newsContent h2 a:hover {color: #6c207f;}
.newsContent .date {color:#aaa;font-style: italic; font-size: 87.5%; display: block; line-height: 150%;}
.newsContent .date:first-letter {text-transform: capitalize;}
.newsContent .partContentText {overflow:hidden; height: 105px; position: relative;}
.newsContainer:nth-child(even) .newsContent .partContentText:after {background-image: linear-gradient(rgba(0,0,0,0), rgba(244,151,0,0.05));}
.newsContent .partContentText p:last-child {margin-bottom: 0px;}
.buttonContainer {overflow: hidden;}
.buttonContainer .ctaButton {float: right; margin-bottom: 0px;}
.buttonContainer .ctaButton:hover {}
.socials {margin-bottom: 20px; margin-top: 10px;}
.socials a {display: inline-block; margin-left: 20px;}
.socials a:first-child {margin-left: 0px;}
.socials a svg {height: 25px; fill: #fff;}
.socialLabel {float: left; line-height: 40px; margin-right: 5px;}
.socialIconContainer {float: left;}
.socialShareIcon {width: 40px;height: 40px; background-size: 30px 30px; background-repeat: no-repeat; background-position: center; display: inline-block;}
.socialShareIconMail {background-image: url('/images/style/icon-email.svg');}
.socialShareIconFacebook {background-image: url('/images/style/icon-fb.svg');}
.socialShareIconTwitter {background-image: url('/images/style/icon-twitter.svg');}
.socialShareIconGoogle {background-image: url('/images/style/icon-google.svg');}
.socialShareIconBlogger {background-image: url('/images/style/icon-blogger.svg');}
.socialShareIconWhatsapp {background-image: url('/images/style/icon-whatsapp.svg');}
.basicContainer.agendaContainer #mainContent {margin-top: 20px; margin-bottom: 40px;}
.agendaItem {padding:20px 20px 20px 20px;}
.agendaItem a {color:#6c207f;}
.agendaItem:nth-child(odd) {background-color:rgba(108,32,127,0.05)}
.agendaItem .date {display: inline-block; vertical-align: middle; color: #000; width: 55px;}
.agendaItem .date span:nth-child(1) {display: block; font-size: 24px; font-weight: 600;}
.agendaItem .date span:nth-child(2) {display: block; text-transform: uppercase;}
.agendaItem .heading3 {display: inline-block; vertical-align: middle; color: #000; margin-bottom: 0px; width: calc(100% - 60px); transition: 0.3s;}
.agendaItem .heading3:hover {color: #6c207f;}
.oneSecondColumnRight .agendaItem {padding:0px; margin-bottom: 20px;}
.oneSecondColumnRight .agendaItem:nth-child(odd) {background-color: transparent;}
.oneSecondColumnRight .agendaItem .date {color: #6c207f;}
.oneSecondColumnRight .agendaItem .heading3 {color: #6c207f;}
.oneSecondColumnRight .agendaItem .heading3:hover {color: #6c207f;}
/* End nieuws, agenda en vacatures */
/* Logo's */
#logoGalleryContainer { display: flex; flex-wrap: wrap; }
.logoGalleryItem { width: calc(33% - 60px); margin: 30px; display: flex; align-items: center; justify-content: center; }
.logoGalleryItem a { display: block; transition: opacity 0.3s; }
.logoGalleryItem a:hover { opacity: 0.5; }
.logoGalleryItem img { max-width: 100%; max-height: 100%; display: block; transition: opacity 0.3s; }
/* #logoGalleryContainer {display: flex; overflow: hidden; font-size: 0; text-align: center;}
.logoGalleryItem {display: inline-block; width: 25%; height: 135px; padding:10px;}
.logoGalleryItem a,
.logoGalleryItem img {margin:0px auto; display: block; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.logoGalleryItem a img {position: static; top:0; -webkit-transform: none; transform: none; -webkit-transition: 0.3s; transition: 0.3s; filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
filter: gray;
-webkit-filter: grayscale(100%);}
.logoGalleryItem a:hover img {filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
-webkit-filter: grayscale(0%);
}
.logoGalleryItem img {max-width: 100%; max-height: 100%;} */
.flexContainer {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start;}
.oneSecondColumn, .oneThirdColumn {flex:0 1 auto; /* flex-grow flex-shrink flex-basis */ align-self: auto; float:left; /* float left is specific for IE9 fix */ }
.oneThirdColumn {width: 33.33%;}
.oneSecondColumn {width: 50%;}
/* Homepage bottom image */
#imageWithButtonsContainer {background-repeat: no-repeat; background-position: top center; background-size: cover; max-width: 1400px; margin: 0px auto; padding:20px; padding-bottom: 0px; position: relative;}
#imageWithButtonsContainer .ctaButton {background-color: #6c207f; width: calc(50% - 30px); font-size: 225%; border:none; text-align: center; margin-right: 100px; padding:50px;}
#imageWithButtonsContainer .ctaButton:hover {background-color: rgba(108,32,127,0.6);color:#fff;}
#imageWithButtonsContainer .ctaButton:first-child {margin-top: 0px;}
#imageWithButtonsContainer .ctaButton span {position: relative; top: 50%; transform: perspective(1px) translateY(-50%);}
/* End homepage bottom image */
/* Footer */
footer {}
footer .oneThirdColumn {background-color: rgba(255,255,255,0.2); padding:20px 30px;color:#fff;}
footer .oneThirdColumn:nth-child(1) {width: calc(33.33% - 25px); margin-right: 25px;}
footer .oneThirdColumn:nth-child(2) {width: calc(33.33% - 50px); margin:0px 25px;}
footer .oneThirdColumn:nth-child(3) {width: calc(33.33% - 25px); margin-left: 25px;}
footer .partNavigation-v li a {color:#fff;}
.oneThirdColumnContactInfo {}
.oneThirdColumnContactInfo strong {color: #fff;}
.oneThirdColumnContactInfo p {line-height: 150%; padding:10px 0px;}
.oneThirdColumnContactInfo p:first-child {padding-top: 0px;}
.oneThirdColumnContactInfo p a {color: #fff; text-decoration: underline;}
#servicesFooter {}
#servicesFooter li {}
#servicesFooter li:first-child a {margin-top: 0px;}
#servicesFooter li a {text-decoration: none; color: #fff; font-weight: 600; display: inline-block; margin:18px 0px; padding:10px 0px 10px 50px; background-repeat: no-repeat; background-size: contain;}
#servicesFooter li:hover a {text-decoration: underline;}
#servicesFooter li:nth-child(1) a {background-image: url('/images/style/icon-stichting-okf.svg');}
#servicesFooter li:nth-child(2) a {background-image: url('/images/style/icon-opleiding-verzorgen.svg');}
#servicesFooter li:nth-child(3) a {background-image: url('/images/style/icon-opleiding-volgen.svg');}
#servicesFooter li:nth-child(4) a {background-image: url('/images/style/icon-vooropleidingen.svg');}
/* End footer */
#sidebar {float: left; width: 354px; padding-right: 30px; margin-bottom: 20px;}
#sidebar .heading2 {color: #6c207f; display: block;}
.filterHeading {display: block; margin-bottom: 15px; color: #6c207f;}
.filterList {margin-bottom: 40px; font-size: 100%;}
.filterList li {padding:5px 0px;}
.filterList li a {display: inline-block; line-height: 130%; text-decoration: none; position: relative; padding:3px 0px 3px 28px; color: #555;}
.filterList li a span {display: inline-block; color: #999; margin-left: 5px;}
.filterList li a span:before {content: '('}
.filterList li a span:after {content: ')'}
.filterList li.inactive a {opacity: 0.3; cursor: default;}
.filterList li.selected a {color: #6c207f; font-weight: 600;}
.filterList li a:before {content: ''; width: 20px; height: 20px; border:solid 1px #aaa; margin-right: 10px; margin-top: 0px; position: absolute; left: 0; top: 3px;}
.filterList li.selected a:before {border-color: #6c207f; background: #6c207f url('/images/style/icon-check-white.svg') no-repeat center; background-size: 12px 12px;}
.filterListCheck {}
.filterListRadio {}
.filterListRadio li a:before {border-radius: 50%;}
.filterListContainer {position: relative; margin-top: 20px;}
.filterListContainer.filterListContainerLoading {opacity: 0.4;}
.filterListContainer.filterListContainerLoading:before {content: ''; height: 100%; width: 100%; position: absolute; z-index: 1;}
.filterItemContainer {height: 200px; width: 400px;}
.filterItemContainer.filterItemContainerLoading {background-image: url('/images/style/ajax-loader.svg'); background-repeat: no-repeat; background-position: top center; background-size: 28px 28px; color: transparent;}
#mainContent {float: left; width: calc(100% - 354px);}
#subItemContainer {}
.subItem {padding:50px 50px 30px 50px;}
.subItem:nth-child(odd) {background-color: rgba(244,151,0,0.05);}
.subItem.secure h2 a:after {content: ''; background: url(/images/style/icon-lock.svg) no-repeat; background-size: contain; width: 14px; height: 18px; display: inline-block; margin-left: 8px;}
.subItem h2 a {color: #000; transition: 0.3s;}
.subItem h2 a:hover {color: #6c207f;}
.subItem .ctaButton {background: #6c207f;}
.subItem .ctaButton:hover {background: #fff; border-color: #6c207f; color: #6c207f;}
/* form */
#formContact {max-width: 600px;}