@charset "utf-8";
/* CSS Document */

/*-------------------------------------------------------------------------------------*/
/*GENERAL -----------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

* {
	margin:0;
}

html, body {
	padding:0px;
	margin:0px;
	height:100%;
}
body {
	background: url(/images/site/bg.png) repeat;
	color:#333333;
	font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
	font-size: 16px;
    line-height: 24px;
	font-weight:400;
}

body.popup {
	background-color:white; 
	background-image:none;
}

a {color:#bf2828; text-decoration:none;}
a:hover {color:#bf2828; text-decoration:underline;}
a:active {text-decoration:none; background:none;}

.wrapper {
	min-height: 100%;
	height: auto !important; 
	height: 100%;
	margin: 0 auto -64px; 
}

.push {
	height:64px;
}

em, i {
	font-style:italic;
}

table.table-responsive {
    border: 1px solid transparent;
    border-collapse: unset;
}

table.table-responsive td {
    vertical-align: top;
    padding: .75rem;
}

/*-------------------------------------------------------------------------------------*/
/*GLOBAL ------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/

h1 {font-family: 'Montserrat', Arial, Helvetica, sans-serif; color:#006c86; font-size:27px; line-height:27px; font-weight:700; padding:0; margin:0 0 20px 0;}
h2 {font-family: 'Montserrat', Arial, Helvetica, sans-serif; color:#bf2828; font-size:24px; line-height:24px; font-weight:700; padding:0; margin:0 0 20px 0;}
h3 {font-family: 'Montserrat', Arial, Helvetica, sans-serif; color:#bf2828; font-size:19px; line-height:24px; font-weight:700; padding:0; margin:0 0 10px 0;}
h4 {font-family: 'Droid Sans', Arial, Helvetica, sans-serif; color:#333333; font-size:11px; line-height:24px; font-weight:400; padding:0; margin:4px 0;}
h5 {font-family: 'Droid Sans', Arial, Helvetica, sans-serif; color:#333333; font-size:11px; line-height:24px; font-weight:400; padding:0; margin:0;}
h6 {font-family: 'Droid Sans', Arial, Helvetica, sans-serif; color:#333333; font-size:16px; line-height:24px; font-weight:700; padding:0 0 15px 0; margin:0;}

button, .button {
    background: #006c86;
    color: #ffffff;
    cursor: pointer;
    padding: 0 15px;
    display: inline-block;
    height: 30px;
    text-align: center;
    font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 15px;
	line-height: 30px;
	border:none;
}

.button:hover {
	color: #ffffff;
	text-decoration:none;
	background:#fcaf17;
}

/* BOOTSTRAP OVERRIDE */
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    padding-right: 10px;
    padding-left: 10px;
}

.container {
	padding-right: 10px;
    padding-left: 10px;
}

.row {
    margin-right: -10px;
    margin-left: -10px;
}

/*-------------------------------------------------------------------------------------*/
/*HEADER ------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/
.header .headerTop {
	height:91px;
	position:relative;
}

.header .headerTop .logoImage {
	width:140px;
	height:153px;
	display:block;
	float:left;
	margin:6px 0 0 0;
	position:absolute;
	z-index:501;
}

.header .headerTop .logoText {
	width:344px;
	height:43px;
	display:block;
	float:left;
	margin:35px 0 0 166px;
}

.header .slideshow {
	height:402px;
	border:10px solid #ffffff;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.5);
	-moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.5);
	box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.5);
	background:#ffffff;
}

.header .contactInfo {
	font-size:14px;
	color:#006c86;
}

.header .contactInfo a {
	color:#006c86;
	text-decoration:underline;
}

.header .slideshowText {
	padding-right: 0;
    padding-left: 5px;
	width:20%;
	float:left;
}

.header .subSites .subsiteButton {
	width:100%;
	height:65px;
	display:block;
	margin-bottom:10px;
	line-height:65px;
	color:#ffffff;
	font-size:16px;
	font-family: 'Montserrat', Arial, Helvetica, sans-serif;
	padding:0 0 0 52px;
	text-decoration:none;
	position:relative;
	background-repeat:no-repeat;
	background-size:100%;
	background-position:center center;
}

.header .subSites .subsiteButton.vcorg {background-image:url(/images/site/vcorg.png);}
.header .subSites .subsiteButton.bogerman {background-image:url(/images/site/bogermanschool.png);}
.header .subSites .subsiteButton.polyander {background-image:url(/images/site/polyanderschool.png);}
.header .subSites .subsiteButton.peuterhof {background-image:url(/images/site/peuterhof.png);}


.header .subSites .subsiteButton::after {
	content:"";
	top:0;
	left:0;
	position:absolute;
	width:100%;
	height:100%;
	pointer-events:none;
	background-color:rgba(0, 108, 134, 0.8);
}

.header .subSites .subsiteButton:hover::after {
	background-color:rgba(0, 108, 134, 1);
}

.header .subSites .subsiteButton span {
	position:relative;
	z-index:1;
}

.header .subSites .subsiteButton span::before {
	content:"";
	position:absolute;
	left:-45px;
	top:-13px;
	width:39px;
	height:42px;
	background:url(/images/site/logoImage.png);
	background-size:100%;
}

.header .contactInfo .address, 
.header .contactInfo .postal, 
.header .contactInfo .phone, 
.header .contactInfo .mail {
	position:relative;
	padding-left:30px;
	display:block;
}


.header .contactInfo .address::before, 
.header .contactInfo .phone::before, 
.header .contactInfo .mail::before {
    font-family: 'FontAwesome';
    font-size: 19px;
    position: absolute;
    left: 0;
    top: 0;
    line-height: 24px;
}

.header .contactInfo .address::before {content: '\f015';}
.header .contactInfo .phone::before {content: '\f095';}
.header .contactInfo .mail::before {content: '\f0e0'; font-size:18px;}
.header .contactInfo .mail:hover {color:#bf2828;}

/*-------------------------------------------------------------------------------------*/
/*CONTENT -----------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/
.content .contentWrapper {
	background:#ffffff;
	padding: 25px 20px;
	margin-top:40px;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.5);
	-moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.5);
	box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.5);
	min-height: 323px;
}

/*-------------------------------------------------------------------------------------*/
/*FOOTER ------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/
.footer {
	height:62px;
	text-align:right;
	padding-top: 29px;
}

.footer a.poweredBy {
	font-size:14px;
	color:#006c86;
	line-height:35px;
	display:inline-block;
}

/*-------------------------------------------------------------------------------------*/
/*MEDIA QUERIES -----------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------*/
@media(max-width:1199px){
	.header .headerTop .logoImage {width:90px; height:100px;}
	.header .headerTop .logoText {width:280px; margin-left:100px;}
	.header .headerTop .logoImage img, .header .headerTop .logoText img {max-width:100%;}
	.header .subSites .subsiteButton {font-size:13px;}
	 #slideshow img {min-width:100%; min-height:100%;}
}

@media(max-width:991px){
	.header .slideshowContainer {width:70%;}
	.header .slideshowText {width:30%;}
	.header .headerTop {height:150px;}
}

@media(max-width:767px){
	.header .slideshowContainer {width:100%; padding-right:0; border:10px solid #ffffff;}
	.header .headerTop {height:100px;}
	.header .headerTop .logoImage {margin-top:2px;}
	.header .slideshowText {width:100%;}
	.header .slideshow {height:250px; border:none;}
	.header .slideshowText {margin-top:20px; padding:0;}
}

@media(max-width:480px){
	.header .headerTop {height:110px;}
	.header .headerTop .logoImage {height: 58px; margin-top: 5px; position: relative; text-align: center;width: 100%;}
	.header .headerTop .logoText img {width:280px;}
	.header .headerTop .logoText {margin:0; width:100%; text-align:center;}
	.header .headerTop .logoImage img {width:53px;}
}