@charset "utf-8";
/*********************** XS = DEFAULT ***********************/

/*********************** COMMON ***********************/
body {
	font-family: "PT Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #666666;
}

h1, .h1, h2, .h2 {
	font-size: 21px;
}

.left {
	float: left;
	display: inline;
	padding: 0;
	margin: 0;
}

.right, .left.special {
	float: right;
	display: inline;
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4 {
	font-weight: normal;
	padding: 0;
	margin: 0;
	color: #00bfe9;
}

.btn {
	color: #FFFFFF;
	border: none;
	background-color: #222222;
	border-radius: 0;
}

.btn:hover {
	background-color: #444444;
	color: #FFFFFF;
}

.btn.btn-sm {
	border-radius: 3px;
	font-size: 12px;
	line-height: 1.5;
	padding: 5px 10px;
}

.line-box .header-box a.btn {
	color: #FFFFFF;
	margin-top: 0;
}

.clearfloat {
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0px;
}

/*********************** CONTAINERS ***********************/
.contentcontainer {
	/*background: url('../images/bg_html.png') top repeat-x #00bee9;*/
	
}

#content .container {
	padding-top: 35px;
	padding-bottom: 30px;
}

#content .container {
	padding-left: 0;
	padding-right: 0;
}

#content .logocontainer {
	display: none;
}

ul {
	padding: 20px 0 20px 20px;
	margin: 0;
}

#content .contentLeftInside ul {
	padding: 20px 0 20px 20px;
	margin: 0;
}

#content .contentLeftInside ul.subnavi {
	list-style: none;
	padding: 0;
	margin: 0 0 10px 0;
	border: none;
}

#content .contentLeftInside ul.subnavi li {
	padding: 0;
	margin: 0 0 5px 0;
	border: none;
	line-height: inherit;
}

#content .contentLeftInside ul.subnavi li a {
	display: block;
	padding: 12px 0 10px 10px;
	background: #e5f8fd;
	color: #00bfe9;
	text-decoration: none;
}

#content .contentLeftInside ul.subnavi li a:hover {
	background: #cdf0f9;
}

#content .contentLeftInside ul.subnavi li a i {
	line-height: inherit;
}

#content .contentLeftInside ul.subnavi .submenucontainer .submenu {
	padding-top: 0;
	padding-bottom: 0;
}

.navSearchHolderInner {
	width: 100%;
}
/*********************** HEADER ***********************/
.headercontainer {
	padding: 0;
	position: relative;
}

#header .menuwrapper {
	width: 100%;
}

#header #logo {
	background-image: url('../images/bg_logo_xs.png');
	padding-left: 30px;
	padding-right: 35px;
	margin-left: 5px;
}
/*********************** FOOTER ***********************/
#footer {
	width: 100%;
	padding: 0;
	margin: 0;
	background: #e5e5e5;
}

#footer h1, #footer h2, #footer h3 {
	color: #666666;
}

#footer #footerWrapper {
	padding: 30px 0;
}

#footer .contentLeft {
	width: 100%;
	margin-bottom: 20px;
}

#footer .contentLeft .btn {
	display: inline-block;
	color: #ffffff;
	border: none;
	font-size: 14px;
	text-decoration: none;
	padding: 8px 15px;
	margin: 0 0 10px 0;
	background-color: #666666;
}

#footer .contentLeft .btn:hover {
	display: inline-block;
	color: #ffffff;
	border: none;
	font-size: 14px;
	text-decoration: none;
	padding: 8px 15px;
	margin: 0 0 10px 0;
	background-color: #888888;
}

#footer .contentLeft ul.social {
	list-style: none;
	padding: 0;
	margin: 0;
}

#footer .contentLeft ul.social li {
	float: left;
	display: inline;
}

#footer .contentLeft ul.social li a.twitter {
	display: block;
	width: 20px;
	height: 20px;
	background: url('../images/bg_social_icons.png') 5px 0 no-repeat;
	padding: 0;
	margin: 8px 0 0 10px;
	text-indent: -9999em;
}

#footer .contentLeft ul.social li a.facebook {
	display: block;
	width: 20px;
	height: 20px;
	background: url('../images/bg_social_icons.png') -35px 0 no-repeat;
	padding: 0;
	margin: 8px 0 0 10px;
	text-indent: -9999em;
}

#footer .contentLeft ul.social li a.googleplus {
	display: block;
	width: 20px;
	height: 20px;
	background: url('../images/bg_social_icons.png') -75px 0 no-repeat;
	padding: 0;
	margin: 8px 0 0 10px;
	text-indent: -9999em;
}

#footer .copyright {
	padding: 10px 0 0 0;
	color: #888888;
}

#footer .copyright a {
	color: #888888;
	text-decoration: none;
}

#footer .copyright a:hover {
	text-decoration: underline;
}

#footer .contentRight {
	width: 100%;
}

#footer .contentLeft h2, #footer .contentRight h2 {
	padding: 0;
	margin: 0 0 10px 0;
}

#footer .footerbottom {
	background: #00bfe9;
	padding: 8px 0;
	margin: 0;
}

#footer .footerbottom #footerLogo a {
	/*display: block;
	max-width: 92%;
	margin: 8px 0;
	height: 52px;
	background-repeat: no-repeat;
	background-size: contain;
	width: 280px;
	text-indent: -9999em;*/
}

/*********************** MENUS ***********************/
.mainmenu {
	float: right;
}

.mainmenu ul {
	padding: 0;
}

.mainmenu ul li {
	border-top: none;
}

.mainmenu ul li.last, .mainmenu ul li.submenucontainer ul li.last {
	margin-bottom: 0;
}

.mainmenu ul li.collapsed {
	border-bottom: none;
}

.mainmenu ul li.submenucontainer.collapsed {
	border-left: none;
}

.mainmenu ul li a {
	color: #000000;
}

.mainmenu ul li.active a {
	background: #9fdc29;
}

.mainmenu ul li a i {
	line-height: inherit;
}
/*********************** HOMEPAGE ***********************/

/*** Calendar ***/
#calendar {
	background: #f6e5ff;
}

#calendar .header {
	background: #8748ab;
	padding: 10px 10px 8px 15px;
}

#calendar .header h2 {
	text-shadow: 2px 2px 0px #4b2481;
}

#calendar .header h2 a {
	text-shadow: 2px 2px 0px #4b2481;
}

#calendar .tableHolder {
	padding: 15px 25px 0 25px;
}

#calendar table {
	width: 100%;
}

#calendar table th {
	border-right: solid 1px #ebd5f6;
}

#calendar table td {
	background: #ffffff;
	border-right: solid 1px #f3ecf6;
	border-bottom: solid 1px #f3ecf6;
}

#calendar table td.kids {
	background: url('../images/bg_table_cat.png') top right no-repeat #9fdc29;
}

#calendar table td.parent {
	background: url('../images/bg_table_cat.png') top right no-repeat #00bfe9;
}

#calendar .btn {
	background: #8748ab;
}

#calendar .btn:hover {
	background: #9257b3;
}

#calendar ul li .legendaKids {
	background: #9fdc29;
}

#calendar ul li .legendaAdult {
	background: #00bfe9;
}

/*** Kids ***/
#kids {
	background: #f5fbe9;
}

#kids .header {
	background: #9fdc29;
}

#kids .header h2 {
	text-shadow: 2px 2px 0px #6fca14;
	color: #ffffff;
}

#kids ul li {
	color: #9fdc29;
}

#kids ul li a {
	color: #9fdc29;
	font-size: 15px;
	text-decoration: none;
}

#kids ul li a:hover {
	text-decoration: underline;
}

/*** Parents ***/
#parents {
	background: #e5f8fd;
}

#parents .header {
	background: #00bfe9;
}

#parents .header h2 {
	text-shadow: 2px 2px 0px #009fde;
	color: #ffffff;
}

#parents ul li {
	color: #00bfe9;
}

#parents ul li a {
	color: #00bfe9;
	font-size: 15px;
	text-decoration: none;
}

#parents ul li a:hover {
	text-decoration: underline;
}

/*********************** COMPONENTS ***********************/
#agenda {
	padding: 0;
	margin: 0;
}

#agenda h2 {
	color: #8748ab;
	padding: 0;
	margin: 0 0 10px 0;
}

#agenda table {
	padding: 0;
	margin: 0;
}

#agenda table th {
	padding: 0 20px 5px 0;
	margin: 0;
	text-align: left;
	color: #8748ab;
	font-weight: normal;
}

#agenda table td {
	padding: 0 20px 5px 0;
	margin: 0;
	text-align: left;
}

/*** Teachers ***/
#teachers .carousel .carousel-inner>.item>.photowrapper {
	height: 240px;
}

#teachers .carousel .carousel-inner>.item>.photowrapper>.imageoverlay {
	background-image: url('../images/bg_teacher_photo_holder.png');
}

#teachers .carousel .carousel-inner>.item>.description {
	background-image: url('../images/bg_teacher_description_holder_bottom.png');
	margin-top: -20px;
	padding-top: 50px;
}

#teachers .carousel .carousel-inner>.item>.description a {
	color: #9fdc29;
	font-style: normal;
	text-decoration: none;
}

/*** News ***/
.newsoverview {
	margin: 0;
}

.newsoverview h2, h2 {
	color: #00bfe9;
	padding: 0;
	margin: 0 0 10px 0;
}

.newsoverview .item {
	margin-bottom: 20px;
}

/* .newsoverview .item h3, .item h3 {
	color: #00bfe9;
	padding: 0;
	margin: 0;
} */

/*********************** OTHER ***********************/
div.detailimgwrap.leftfloat img {
	margin: 10px 20px 20px 0px;
}

.navSearchHolder div.right {
	float: right;
}

.cleft #content .contentLeft {
	padding-bottom: 10px;
}

.cright #content .contentRight {
	padding-bottom: 10px;
}

#content div.wrapper.clearfix {
	background-color: #ffffff;
}
/*********************** SMALL (SM) ***********************/
@media ( min-width : 650px) {
	/*********************** CONTAINERS ***********************/
	.container {
		width: auto;
	}

	/*********************** HEADER ***********************/
	#header #logo a {
		float: left !important;
	}

	/******************* MIJNSCHOOL *******************/
	.mijnschoollayout #header .logocontainer {
		width: 300px;
	}
	.mijnschoollayout #header .menuwrapper {
		width: auto;
		float: right;
	}

	/*********************** FOOTER ***********************/
	/*********************** MENUS ***********************/
	/*********************** HOMEPAGE ***********************/
	.homepage #content .container {
		padding-top: 30px;
	}
	#teachers .carousel {
		padding-left: 10px;
	}
	#teachers .carousel .carousel-inner>.item>.photowrapper {
		width: 175px;
	}
	#teachers .carousel  .carousel-inner>.item>.description {
		background-image: url('../images/bg_teacher_description_holder_right.png');
		margin: 0 0 0 -30px;
		padding: 10px 15px 10px 60px
	}

	/*********************** OTHER ***********************/
}

/*********************** SMALL - MEDIUM HEADER FIX ***********************/
@media ( min-width : 792px) {
}

/*********************** MEDIUM (MD) ***********************/
@media ( min-width : 992px) {
	/*********************** CONTAINERS ***********************/
	.container {
		width: 970px;
	}
	#content .contentRightInside {
		border-left: 1px solid #dddddd;
	}
	.cleft #content .contentLeft {
		padding-bottom: 0px;
	}
	.cright #content .contentRight {
		padding-bottom: 0px;
	}

	/*********************** HEADER ***********************/
	#header .logocontainer {
		display: block;
		position: relative;
		margin-bottom: -35px;
	}
	#header #logo {
		background-image: url("../images/bg_logo.png");
		padding: 10px 45px 40px;
		background-size: contain;
	}
	#header .menuwrapper {
		margin-left: -340px;
		padding-left: 340px;
	}
	#header .menuwrapper .headerSearchContainer, .homepage #header .menuwrapper .headerSearchContainer {
		width: 100%;
	}
	#header .menuwrapper .headerSearchContainer form, .homepage #header .menuwrapper .headerSearchContainer form {
		width: 75%;
	}

	/*** Carrousel ***/
	#headercarrousel {
		display: none;
		position: relative;
		float: right;
		width: 750px;
		height: 350px;
		z-index: 6;
		padding: 10px 10px 0;
	}
	#headercarrousel .carrouselframe {
		background-image: url('../images/bg_carrousel_frame_md.png');
		background-position: center top;
		width: 100%;
		left: 0;
	}

	/*** Descriptions ***/
	#headercarrousel .carrouselDescriptions {
		display: block;
		top: 180px;
		width: 380px;
		height: 120px;
		padding: 10px 15px;
		left: -205px;
		color: #ffffff;
	}
	#headercarrousel .carrouselDescriptions .carrouseltitle {
		text-shadow: 2px 2px 0px #ff3c00;
		font-size: 20px;
		color: #ffffff;
		margin-bottom: 14px;
	}

	/*********************** FOOTER ***********************/
	#footer .footertop .contentLeft, #footer .footertop .contentRight {
		width: 50%;
	}

	/*********************** MENUS ***********************/
	.mainmenu {
		width: auto;
		margin-top: 10px;
		background: none;
	}
	.mainmenu ul {
		margin-bottom: 0;
	}
	.mainmenu ul li a {
		color: #FFFFFF;
		padding: 10px 8px;
	}
	.mainmenu .headerSearchContainer {
		display: block;
		float: right;
	}
	#footer .contentLeft, #footer .contentRight {
		width: 50%;
	}

	/*********************** HOMEPAGE ***********************/
	.homepage #headercarrousel {
		display: block;
	}
	.homepage #quicklinks {
		margin-top: -60px;
	}
	.homepage #header .logocontainer {
		display: block;
		margin-bottom: -75px;
	}
	.homepage #header #logo {
		padding: 15px 60px 55px 55px;
	}
	.homepage #header #logo a {
		width: 220px;
		height: 110px;
	}
	.homepage #header .menuwrapper {
		margin-left: -340px;
		padding-left: 340px;
		float: right;
	}
	.homepage #header .menuwrapper .mainmenu {
		float: right;
		width: auto;
	}
}
/*********************** LARGE (LG) ***********************/
@media ( min-width : 1200px) {
	/*********************** CONTAINERS ***********************/
	.container {
		width: 1170px;
	}

	/*********************** HEADER ***********************/
	#header .menuwrapper {
		margin-left: -380px;
		padding-left: 380px;
	}
	/*** Carrousel ***/
	#headercarrousel {
		height: 370px;
		width: 793px;
	}
	#headercarrousel .carrouselframe {
		background-image: url('../images/bg_carrousel_frame_lg.png');
	}

	/*** Descriptions ***/
	#headercarrousel .carrouselDescriptions {
		left: -290px;
	}

	/*********************** FOOTER ***********************/
	#footer .footertop .contentLeft {
		width: 58.33%;
	}
	#footer .footertop .contentRight {
		width: 41.67%;
	}

	/*********************** MENUS ***********************/
	.mainmenu {
		background: none;
		position: relative;
	}
	.mainmenu ul li a {
		padding: 12px 15px;
	}

	/*********************** HOMEPAGE ***********************/
	.homepage #header .logocontainer {
		margin-bottom: -90px;
	}
	.homepage #header #logo a {
		height: 140px;
		width: 280px;
	}
	.homepage #header .menuwrapper {
		margin-left: -425px;
		padding-left: 425px;
	}
	.homepage .contentLeft, .homepage .contentRight {
		padding-left: 25px;
		padding-right: 25px;
	}
	/*********************** OTHER ***********************/
}