/* --------------------------------------------------
----------------------------------------------------- 
   LAYOUT.CSS - Table of Contents
   Copyright: WEBS Internet Solutions (http://www.webs.be)
-----------------------------------------------------
-----------------------------------------------------

/* Sticky Footer - hoogtes ed aan te passen per project
---------------------------------------- */
html, body {height: 100%;}

#wrap {min-height: 100%;
  height:auto;}

#main {overflow:auto;
  padding-bottom: 165px;}  /* must be same height as the footer */ 
/* 	+ Eventuele padding van de footer
	+ marge boven de footer*/

footer {position: relative;
  margin-top: -165px; /* negative value of footer height */ 
/* 	+ Eventuele padding van de footer*/
  clear:both;}

/*Opera Fix*/
body:before {
  content:"";
  height:100%;
  float:left;
  width:0;
  margin-top:-32767px;/}
  
  


/* Primary styles
---------------------------------------- */

header{
	position: relative;}

a.logo{
	width:359px;
	height:115px;
	text-indent: -9999px;
	background:url('/images/lagere-school-groenendaal-logo.png') left top no-repeat;
	display: inline-block;
	float:left;
	z-index:1;
	margin-bottom:-20px; 
	position: relative;
	
}
a.logo:hover{
	transform:scale(1.05);
	-ms-transform: scale(1.05); /* IE 9 */
	-webkit-transform: scale(1.05); /* Safari and Chrome */
	transition:all .15s;
}

/* homepage */
div.home{
	width:100%;
	height:455px;
	/* height: 575px; */
	background:#ffffff url('/images/groenendaal-small.gif') center center no-repeat;
	position: relative;
	float: left;
}
div.homeLinks{
	position: relative;
}

.homeLinks a{ position:absolute; }
	
/*
a.wg-sport{ top:275px; left:75px;}
a.wg-cultuur{ top:190px; left:215px;}
a.wg-zorg{ top:275px; left:500px;}
a.wg-milieu{ top:225px; left:425px;}
a.school-contact{ top:375px; left:875px;}
a.school-aanbod{ top:280px; left:295px;}
a.school-nieuws{ top:400px; left:275px;}
a.secundair{top:200px; left:775px;}
a.school-info{top:325px; left:750px;}
a.school-blogs{top:375px; left:500px;}
*/

/* HOME LINKS AANGEPASTE VERSIE, top 70px hoger (minder dus) */
a.wg-sport{ top:205px; left:75px;}
a.wg-cultuur{ top:120px; left:215px;}
a.wg-zorg{ top:205px; left:500px;}
a.wg-milieu{ top:155px; left:425px;}
a.school-contact{ top:305px; left:875px;}
a.school-aanbod{ top:210px; left:295px;}
a.school-nieuws{ top:330px; left:275px;}
a.secundair{top:130px; left:775px;}
a.school-info{top:255px; left:750px;}
a.school-blogs{top:305px; left:500px;}

a.personeelsplaats{ top:230px; left:275px;}


a.gotocms{
color:#fff;
position:absolute; bottom:10px; right:120px;}


span.icon{
	width:50px;
	height:50px;
  -webkit-border-radius: 25px;
          border-radius: 25px;
  background-clip: padding-box;
	border:1px solid #fff;
	background:#333;
display: block;	
	z-index:5;
	text-indent: -9999px;
	position: relative;
}


span.link{
background:#333;
font-size:16px;
height:40px;
width:0;
line-height: 40px;
padding:0 20px 0 50px;
color:#fff;
 -webkit-border-radius: 20px;
          border-radius: 20px;
  background-clip: padding-box;
  border:1px solid #fff;
  text-transform: uppercase;
   margin:-45px 0 0 10px;
  z-index:4;
  display: none;
}
.homeLinks a:hover span.link{
display:block;
width:auto;
}


a.wg-zorg span.icon{
	background:#333 url('/images/ico-home-zorg.png') center center no-repeat;
}
a.wg-sport span.icon{
	background:#333 url('/images/ico-home-sport.png') center center no-repeat;
}
a.wg-cultuur span.icon{
	background:#333 url('/images/ico-home-cultuur.png') center center no-repeat;
}
a.wg-milieu span.icon{
	background:#333 url('/images/ico-home-milieu.png') center center no-repeat;
}

a.school-nieuws span.icon{
	background:#333 url('/images/ico-home-nieuws.png') center center no-repeat;
}
a.school-contact span.icon{
	background:#333 url('/images/ico-home-contact.png') center center no-repeat;
}
a.school-aanbod span.icon{
	background:#333 url('/images/ico-home-aanbod.png') center center no-repeat;
}
a.school-info span.icon{
	background:#333 url('/images/ico-home-info.png') center center no-repeat;
}
a.school-blogs span.icon{
	background:#333 url('/images/ico-home-blogs.png') center center no-repeat;
}

a.secundair span.icon{
	background:#333 url('/images/ico-home-college.png') center center no-repeat;
}

a.personeelsplaats span.icon{
	background:#333 url('/images/ico-home-personeel.png') center center no-repeat;
}

/* LOGIN BOX & ingelogd box*/

div.login, div.ingelogd{
	background:#fff;
	width:400px;
	height:50px;
	float:right;
	position: relative;
}
div.ingelogd{
	background:#62BC19;
}

.login input{
	padding: 5px 5px 5px 25px;
	height:35px;
	line-height: 35px;
	border:2px solid #ddd;
	color:#999;
	font-size: 1.3em;
	margin:15px 10px 0 0;
	width:145px;
	float: left;
	transition:all .25s;
}
.login input:focus{
	border:2px solid #eee;
	color:#333;
	transition:all .25s;
}
.login input.gebruikersnaam{ 
	background:url('/images/ico-gebruiker-input.png') 5px center no-repeat;}
.login input.wachtwoord{ 
	background:url('/images/ico-wachtwoord-input.png') 5px center no-repeat;}
	

.ingelogd img{
	width:50px;
	height:50px;
	background:#ddd;
	float:left;
	margin-right:10px;
}
.ingelogd p{
	color:#fff;
	margin:5px 0 0 0;
	font-size:13px;
	line-height: 1.2;
}
.ingelogd p span{
	font-weight:bold;
	display:block;
	font-size:16px;
}
.ingelogd a.loguit, .login a.login, .login input.login, .ingelogd input.loguit {
	position: absolute; bottom: 0; right: 0;
	background:#333 url('/images/ico-loguit.png') 10px 10px no-repeat;
	color:#fff;
	font-size:15px;
	text-transform: uppercase;
	text-decoration: none;
	height:35px;
	line-height: 35px;
	padding:0 10px 0 35px;
	opacity:1;
	transition:all .25s;
	border: 0;
}


	
.login a.login, .login input.login{
	background:#62BC19 url('/images/ico-login.png') 10px 10px no-repeat;
	width: auto;
	margin: 0;
}
.login a.login:hover, .ingelogd a.loguit:hover, .login input.login:hover, .ingelogd input.loguit:hover{
	opacity:.5;
	transition:all .25s;
}



/* NAVIGATIE */

nav{
	background:#333;
	height:50px;
	width:100%;
	float:left;
	position: relative;
}
nav i{
	margin-right:5px;
	color:#62BC19;
	font-size:24px;
}
nav ul{
	margin:0; padding:0;
	}
nav ul li{
	display:inline;
	height:50px;
	float:left;
}
nav ul li a{
	font-size:18px;
	color:#fff!important;
	text-decoration: none;
	height:50px;
	line-height: 50px;
	padding:0 15px;
	display: inline-block;
	z-index:3;
	transition:all .25s;
}
nav ul li a:hover{
	background:#444;
	transition:all .25s;
}
nav ul li.active a{
	background:#62BC19;
}
nav ul li.active i{
	color:#fff;
}


/* SEARCH BOX */

div.search{
	position: absolute; top:20px; right:0px;
	width:250px;
	height:35px;
	background:#fff;
	padding:2px;
}
div.search input[type="text"]{
	background:url('/images/ico-search-input.png') 5px 5px no-repeat;
	width:179px;
	display: inline-block;
	border:none;
	height:31px;
	line-height: 31px;
	padding:0 5px 0 35px;
	float: left;
	margin: 0 2px 0 0;
	font-size:14px;
	color:#999;
}
div.search input[type="text"]:focus{
	color:#333;
}

div.search input[type="submit"]{
	background:#333;
	border:none;
	color:#fff;
	text-transform: uppercase;
	width:65px;
	height:31px;
	line-height: 31px;
	text-align: center;
	display: inline-block;
	font-size:14px;
	float: left;
	transition:all .25s;
}
div.search input[type="submit"]:hover{
	background:#62BC19;
	transition:all .25s;
}

div.head{
	height:150px;
	width:100%;
	float:left;
	position:relative;
	background:#62BC19 url('/images/head-balloons.png') center center no-repeat;
}


/* pagina TITLE's */

h1.slogan{
	font-weight:bold;
	font-size:48px;
	line-height: 44px;
	color:#fff!important;
	margin:30px 0 0 0;
	padding:0;
}


h1.title{
	font-weight:bold;
	font-size:60px;
	line-height: 1;
	margin:20px 0 0 0;
	color:#fff!important;}

h1.title span{
	text-transform: uppercase;
	display:block;
	font-weight:normal;}
h1.title span.welkom{
	font-size:18px;}
h1.title span.sub{
	font-size:30px;
	line-height:1.2;
	margin-top:-25px;}
h1 span.ballon{
	display:inline-block;
	background:url('/images/bg-head-balloon.png') center center no-repeat;
	width:115px;
	height:100px;
	line-height: 90px;
	font-weight: bold;
	letter-spacing: -5px;
	text-align: center;
	color:#62BC19;
	margin:-20px 0 0 15px;}




/* BREADCRUMB */

div.breadcrumb{
	float:left;
	position: relative;
	width:100%;
	background:#f2f2f2;
	height:30px;
	line-height: 30px;
}
.breadcrumb ul {
	margin:0; padding:0;
	z-index: 2;
}
.breadcrumb ul li{
	display:inline;
	list-style: none;
	color:#999;
	background:url('/images/ico-breadcrumb.png') right center no-repeat;
	padding:0 15px 0 5px;
	font-size: 1.2em;
}
.breadcrumb ul li:last-child{
	background:none;
	padding:0;
}
.breadcrumb ul li a{
	display:inline;
	list-style: none;
}




/* CONTENT */

div.content{
	padding:0 0 40px 0;
	float:left;
	width:100%;
	position: relative;
}
.logged{
	background: #eee;
}


/* Page styles */
/* team */

div.teamlid img{
	float: left;
	margin:0 20px 30px 0;	
}
.teamlid h3{
	font-size:1.8em;
	line-height: 1.2;
	margin:0;
}
.teamlid ul{
	float: left;
	margin:0; padding: 0;
}
.teamlid ul li{
	list-style: none;
}
.teamlid ul li.ttl{
	color:#999;
	font-size:1.1em;
	line-height: 1;
	margin-top:.6em;
}


/* Contact */
div.contact, div.info{
	padding:30px 0 0 0;
}
div.maps{
	background:#ddd;
	width:100%;
	height:250px;
	float:left;
	margin-bottom:30px;
}

.info img{
	margin-bottom:1em;
}

.info ul.fotos{
	width:730px;
	margin:0; padding:0;
}
.info ul.fotos li{
	list-style: none;
	display: inline;
	width:17%;
	margin-right:2%;
}



/* Blog styles */

div.blogHerken{
	margin:40px 0;
}
div.categorie{
	border-left:1px dashed #62BC19;
	padding:0 20px;
}
div.categorie ul{
	margin:0;
	padding:0;
}
.categorie ul li{
	list-style: none;
	font-size:1.4em;
	line-height: 1.2;
	margin-bottom:.6em;
}
.categorie ul li a i{
	text-decoration: none!important;
	margin-right:5px;
	float:left;
}
.categorie h4{
	font-size:1.8em;
	color:#666!important;
	margin:0 0 .5em 0;
}



div.blogitem{
	margin:20px 0 0 0;
	float:left;
}
div.date{
	width:90px;
	float:left;
	margin-right:20px;
}
p.dag, p.maand, p.nr, p.jaar{
	text-align: right;
	text-transform: uppercase;
	margin:0;
	padding:0;
	line-height: 1;
	color:#999;
}
p.dag{
	font-size:1.2em;
}
p.maand, p.jaar{
	font-size:1.4em;
}
p.nr{
	font-size:72px;
	color:#fff;
	background:#999;
	margin:5px 0;
}

div.item{
	width:599px;
	float: left;
	border-bottom:1px dashed #62BC19;
	padding:0 0 10px 0;
}
div.link{
	width:100%;
}
.item a img{
	float:left;
	margin:0 20px 10px 0;
	opacity:1;
	transition:all .25s;
}
.item a:hover img{
	opacity:.75;
	transition:all .25s;
}
.item h2{
	margin:0;
	font-size:2.4em;
}
p.blogInfo{
	font-size:1.2em;
	color:#999;
}
a.leesMeer {
}
a.leesMeer i{
	font-size: 1.4em;
	line-height: 1;
	float:right;
	text-decoration: none;
}

div.disqus{
	padding:40px 0 40px 110px;
	width:599px;
	float: left;
}

.fotoGallerij
{
    height: 100px;
    width: 150px;
    overflow: hidden;
    margin: 0 20px 10px 0;
    float:left;
}

.fotoGallerij img {
    max-height: 300px;
    margin: -75px 0 0 -100px;
}

/* blog overzicht */

div.blogs{
	padding:20px 0;
	float:left;
	width:100%;
}
.blogs h2, .blogs h2 a{
	font-size:60px;
	color:#fff;
	margin:0;
	line-height: 1;
	font-weight: bold;
	float:left;
	margin-right:40px;
}
.blogs h2 a{
	margin-right:0px;
}
.blogs h2 span{
	font-size:18px;
	display: block;
	text-transform: uppercase;
	font-weight:normal;
}
.blogs ul{
	margin:0;
	padding:0;
}
.blogs ul li{
	display: inline-block;
	list-style: none;
	border-left:1px solid #fff;
	height:80px;
	width:125px;
	padding:0px;
	text-align: center;
}
.blogs ul li a{
	background:url('/images/bg-blogs-ballon.png') center center no-repeat;
	width:85px;
	height:80px;
	line-height: 68px;
	text-decoration: none;
	display: block;
	margin:0 auto;
	font-size:45px;
	font-weight: bold;
	position:relative;
	opacity:1;
	transition:all .25s;
}
.blogs ul li a:hover{
	opacity:0.5;
	transition:all .25s;
}
.blogs a img{
	padding:8px 0 0 0;}
.blogs ul li a span{
	color:#fff;
	text-transform: uppercase;
	font-size:13px;
	font-weight: normal;
	position:absolute; top:40px; left: 35px;
}


/* Blog overzicht pagina */

.groenendaal{
	background:#62BC19;}

.blogPersoneel{
	background:#6A6153;}
.blogPersoneel a{
	color:#6A6153;}
.blogPersoneelWerkgroep{
	background:#80796D;}
.blogPersoneelWerkgroep a{
	color:#80796D;}	

.blogEerste{
	background:#0099FF;}
.blogEerste a{
	color:#0099FF;}
	
.blogTweede{
	background:#0066CC;}
.blogTweede a{
	color:#0066CC;}
	
.blogDerde{
	background:#339966;}
.blogDerde a{
	color:#339966;}
	
.blogVierde{
	background:#CCCC00;}
.blogVierde a{
	color:#CCCC00;}
	
.blogVijfde{
	background:#FF6600;}
.blogVijfde a{
	color:#FF6600;}
	
.blogZesde{
	background:#CC3333;}
.blogZesde a{
	color:#CC3333;}
	
.blogWerkgroep{
	background:#660099;}
.blogWerkgroep a{
	color:#660099;}
.blogWerkgroep h2, .blogWerkgroep h2 a, .blogPersoneelWerkgroep h2, .blogPersoneelWerkgroep h2 a{
	font-size:40px;
	line-height: 36px;}


/* blog varianten in kleur */
.personeel .head{
	background:#6A6153 url('/images/head-balloons.png') center center no-repeat;}
.personeel a, .personeel nav i, .personeel h1 span.ballon, .personeel h1, .personeel h2, .personeel h3, .personeel h4, .personeel h5, .personeel h6{
	color:#6A6153;}
.personeel nav ul li.active a{
	background:#6A6153;}
.personeel .item, .personeel .categorie{
	border-color:#6A6153;}

.eerste .head{
	background:#0099FF url('/images/head-balloons.png') center center no-repeat;}
.eerste a, .eerste nav i, .eerste h1 span.ballon, .eerste h1, .eerste h2, .eerste h3, .eerste h4, .eerste h5, .eerste h6{
	color:#0099FF;}
.eerste nav ul li.active a{
	background:#0099FF;}
.eerste .item, .eerste .categorie{
	border-color:#0099FF;}

		
.tweede .head{
	background:#0066CC url('/images/head-balloons.png') center center no-repeat;}
.tweede a, .tweede nav i, .tweede h1 span.ballon, .tweede h1 span.ballon, .tweede h1, .tweede h2, .tweede h3, .tweede h4, .tweede h5, .tweede h6{
	color:#0066CC;}
.tweede nav ul li.active a{
	background:#0066CC;}
.tweede .item, .tweede .categorie{
	border-color:#0066CC;}

	
.derde .head{
	background:#339966 url('/images/head-balloons.png') center center no-repeat;}
.derde a, .derde nav i, .derde h1 span.ballon, .derde h1 span.ballon, .derde h1, .derde h2, .derde h3, .derde h4, .derde h5, .derde h6{
	color:#339966;}
.derde nav ul li.active a{
	background:#339966;}		
.derde .item, .derde .categorie{
	border-color:#339966;}


.vierde .head{
	background:#CCCC00 url('/images/head-balloons.png') center center no-repeat;}
.vierde a, .vierde nav i, .vierde h1 span.ballon, .vierde h1 span.ballon, .vierde h1, .vierde h2, .vierde h3, .vierde h4, .vierde h5, .vierde h6{
	color:#CCCC00;}
.vierde nav ul li.active a{
	background:#CCCC00;}	
.vierde .item, .vierde .categorie{
	border-color:#CCCC00;}

	
.vijfde .head{
	background:#FF6600 url('/images/head-balloons.png') center center no-repeat;}
.vijfde a, .vijfde nav i, .vijfde h1 span.ballon, .vijfde h1 span.ballon, .vijfde h1, .vijfde h2, .vijfde h3, .vijfde h4, .vijfde h5, .vijfde h6{
	color:#FF6600;}
.vijfde nav ul li.active a{
	background:#FF6600;}
.vijfde .item, .vijfde .categorie{
	border-color:#FF6600;}


.zesde .head{
	background:#CC3333 url('/images/head-balloons.png') center center no-repeat;}
.zesde a, .zesde nav i, .zesde h1 span.ballon, .zesde h1 span.ballon, .zesde h1, .zesde h2, .zesde h3, .zesde h4, .zesde h5, .zesde h6{
	color:#CC3333;}
.zesde nav ul li.active a{
	background:#CC3333;}
.zesde .item, .zesde .categorie{
	border-color:#CC3333;}

	
.werkgroep .head{
	background:#660099 url('/images/head-balloons.png') center center no-repeat;}
.werkgroep a, .werkgroep nav i, .werkgroep h1, .werkgroep h2, .werkgroep h3, .werkgroep h4, .werkgroep h5, .werkgroep h6{
	color:#9933CC;}	
.werkgroep nav ul li.active a{
	background:#660099;}
.werkgroep h1 span.ballon{
	color:#660099;
	margin:-20px 0 0 40px;}





/* FOOTER */

footer{
	background:#333;
	color:#fff;
	padding:30px 0 0 0;
	}
div.subFooter{
	background:#fff;
	color:#999;
	width:100%;
	float:left;
	padding:10px 0;
}

ul.adres, ul.telefoon, ul.mail{
padding-left:20px;
margin-bottom:30px;
position: relative;
}
ul.adres li, ul.telefoon li, ul.mail li{
	list-style: none;
	border-left:1px solid #ccc;
	padding-left:10px;
	font-size:14px;
	line-height: 20px;
}

ul.adres:before {
	font-family: 'FontAwesome';
  content: "\f0f7";
  font-size:1.6em;
  position: absolute; top:0; left: 0;
}
ul.telefoon:before {
	font-family: 'FontAwesome';
  content: "\f095";
  font-size:1.6em;
  position: absolute; top:0; left: 0;
}
ul.mail:before {
	font-family: 'FontAwesome';
  content: "\f003";
  font-size:1.6em;
  position: absolute; top:0; left: 0;
}

.subFooter ul.copy{
	margin:0px;
	padding:0px;
	}
.subFooter ul.copy li{
	display:inline;
	border-right:1px solid #999;
	padding-right:5px;
	margin-right:5px;
	font-size:13px;
	}
ul.copy li, ul.copy li a{
	color:#999;
}
.subFooter ul.copy li:last-child{
	border-right:none;
	padding-right:0px;
	margin-right:0px;
	}



p#xsltsearch_navigation{
margin:20px 0 0 110px;
float:left;
}

div.paginering {
	margin:50px 0 0 110px;
	
}

ul.fotoalbum{
margin-left: 0!important;
list-style:none!important;
padding-left:0!important;	
}

/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */