/* Design & Code (c) ABOVO Media */
html, body { 
	padding			: 0; 
	margin			: 0; 
}

body {
	font			: normal 12px "Trebuchet MS", "Verdana", "Arial", sans-serif;
	color			: #444; 
}	

#wrapper {
	margin			: 0 auto;
	width			   : 900px;
	height			: auto;
}

#hidden{
	display:none;
	}

#top {
	position		      : relative;
	float			      : left;
	width			      : 100%;
	padding-bottom    : 20px;
	height            : 189px;

}

	#top #logo {
		float     : left;
      height    : 111px;
      position  : absolute;
      top       : -116px;
      width     : 311px;		
	}

		#top #logo img {
			width			: 311px;
			height	   : 111px;
			border      : 0;
		}

	#top #stichting {
		float			   : left;
		width			   : 140px;
		height			: 70px;
		margin			: 95px 0 0 26px;
	}	

		#top #stichting img {
			width			   : 140px;
			height			: 70px;
		}

	#top #header {
		position		   : absolute;
		width			   : 370px;
		height			: 250px;
		top				: 0;
		left			   : 466px;
		background		: transparent url('../_images/header1.png') no-repeat top left;
	}

		#top #header #overlay {
			position		   : absolute;
			width			   : 370px;
			height			: 250px;
			top				: 0;
			left			   : 0;
			background		: transparent url('../_images/header_overlay.png') no-repeat top left;			
		}

#left {
	float			: left;
	width			: 200px;
	padding-top : 11px;
}

	#left #menu {
	   display    : none;
		width			: 200px;
		margin			: -61px 0 0 0;
		position		: relative;
		background 		: #00adef url('../_images/menu_top.gif') no-repeat top left;
	}
   
	#left .block {
		width			: 145px !important;
		overflow:hidden;
		padding			: 17px 17px 0 17px;
		margin       : -3px 0 20px 0;
		color			: #fff;
		background 		: #dc3676 url('../_images/block_small_pink.gif') no-repeat 0 -15px;
	}
	
	#left .block h2 {
      margin         : 0px;
   }
	

   #left .block a {
      color             : #ffffff;
   }
   
   
		#left .blue {
			color			: #ffffff;
			background-color: #718fff;
			background-image: url('../_images/block_small_blue.gif');
		}
	
		#left .orange {
			color			: #ffffff;
			background-color: #ff8a23;
			background-image: url('../_images/block_small_orange.gif');
		}
	
		#left .green {
		   color           : #ffffff;
			background-color: #91ca31;
			background-image: url('../_images/block_small_green.gif');
		}
   
	#left .block .bottom {
		width			   : 200px;
		height			: 15px;
		background 		: #fff url('../_images/block_small_pink.gif') no-repeat top left;
		margin			: 0 0 0 -17px;
		position       : relative;
	}

		#left .blue .bottom {
			background-image: url('../_images/block_small_blue.gif');
		}
	
		#left .orange .bottom {
			background-image: url('../_images/block_small_orange.gif');
		}
	
		#left .green .bottom {
			background-image: url('../_images/block_small_green.gif');
		}
		
		
#content_blok ol li{
	list-style-type: decimal;
	} 
	


#right {
	float      : left;
   margin     : 20px 0 0 25px;
   width      : 675px;
   overflow   : hidden;
}
   #right #content_blok table td{
   padding-left:2px;
   }

   #right #home_right{
   width: 315px;
   float:right;
   margin-left: 20px;
   }
   
	#right #image {
		float			: left;
		width			: 315px;
		height			: 216px;
		position		: relative;
		cursor			: pointer;
		margin-bottom  : 28px;
	}

		#right #image img {
			width			: 315px;
			height			: 220px;
		}

		#right #image div {
			position		: absolute;
			top				: 0;
			left			: 0;
			width			: 295px;
			height			: 65px;
			padding			: 156px 0 0 20px;
			background		: transparent url('../_images/image_overlay_turquoise.png') no-repeat top left;
		}

	#right #news {
		float			: left;
		width			: 315px;
		margin			: 0 0 5px 0px;
	}

	#right .block {
		float			: left;
		width			: 281px;
		padding			: 13px 17px 0 17px;
		margin			: -3px 0 20px 0;
		color			: #fff;
		background 		: #72bf44 url('../_images/block_green.gif') no-repeat 0 -15px;
		overflow:hidden;
	}

		#right .green {
			background     : #91CA31 url('../_images/block_green.gif') no-repeat 0 -15px;
		}
	
		#right .orange {
			color			: #444;
			background 		: #ff8a23 url('../_images/block_orange.gif') no-repeat 0 -15px;
		}
		
		#right .blue {
         background     : #718fff url('../_images/block_blue.gif') no-repeat 0 -15px;
      }
      
      #right .blue a {
         color : #ffffff;
         text-decoration:underline;
      }
      
      
	#right .block .bottom {
		width			: 315px;
		height			: 15px;
		background 		: #fff url('../_images/block_green.gif') no-repeat top left;
		margin			: 0 0 0 -17px;
		position		: relative;		
	}

		#right .orange .bottom {
			background-image: url('../_images/block_orange.gif');
		}
		
		#right .blue .bottom {
         background-image: url('../_images/block_blue.gif');
      }

	#right .block .image {
		position		: relative;
		width			: 285px;
		height			: 115px;
		margin			: 10px 0;
	}

   .photoalbum h3 {
      font-size   : 15px;
      margin      : 0 0 15px 0 !important;
      font-weight : bold;
   }
   
   .photoalbum p {
      margin      : 12px 0 0 0 !important;
   }

		#right .block span {
			position		: absolute;
			width			: 285px;
			height			: 115px;
			top				: 0;
			left			: 0;
			background		: transparent url('../_images/overlay_orange.png') no-repeat top left;
		}

#footer {
	float			: left;
	width			: 900px;
	margin			: 20px 0 0 0;
	padding			: 10px 0 20px 0;
	background		: transparent url('../_images/hr.gif') repeat-x top left;
}

	#footer #copyright {
		float			: left;
	}

	#footer #sitemap {
		float			: right;
	}

.hr {
	height			: 1px;
	margin			: 10px 0 17px 0;
	background		: transparent url('../_images/hr.gif') repeat-x left;
}

.border {
	float			: right;
	margin			: 0 0 10px 10px;
	border			: 1px solid #02abee;
	padding			: 1px;
}

.clear {
	clear			: both;
}
	
/* Headings H1-H6 */
h1 { 
	font-size		: 18px;
	font-weight		: bold;
	color			   : #c60751;
	margin			: 0 0 15px;
}

h2 { 
   font-size      : 15px;
   font-weight    : bold;
   color       : #c60751;
   margin         : 0 0 5px 0;
}

   .menu_onderwijs h1,
   .menu_onderwijs h2 {
      color    : #c60751;
   }

   .menu_school h1,
   .menu_school h2 {
      color    : #f15f15;
   }
   
   .menu_ouders h1,
   .menu_ouders h2 {
      color    : #7db820;
   }
   
   .menu_klassen h1,
   .menu_klassen h2 {
      color    : #4a66d1;
   }
   
   .menu_aanmelden h1,
   .menu_aanmelden h2 {
      color    : #b928e3;
   }

	#newsletter h2 {
		color			: #FFFFFF;
		padding			: 0 0 0 23px;
		background		: transparent url('../_images/mail.gif') no-repeat 0 8px;
	}

	#news h2 {
		color			: #c60751;
		margin			: 0 0 10px 0;
	}
	
	#agenda h2 {
      color       : #ffffff;
      position    : relative;
   }
   
   #left #bluebox .tekstblok_h2{
   color:#FFFFFF;
   }
   #left #bluebox h2{
   color:#FFFFFF;
   }
   
   #agenda h2 a {
      color       : #2e6e08;
      font-weight : normal;
      font-size   : 12px;
      top         : 0px;
      right       : 0px;
      padding-top : 4px;
      display     : block;
      position    : absolute;
   }
   

h3 { }

	#right h3 {
		margin			: 10px 0;
		font-weight		: bold; 
	}

	#image h3 {
		font-size		: 21px;
		color			: #fff;
		margin			: 0;
		font-weight		: normal;
	}

h4 { }

	#right h4 {
		margin			: 10px 0;
		font-weight		: bold; 
	}

	#news h4 {
		width			: 302px;
		height			: 22px;
		color			: #fff;
		padding			: 5px 0 0 13px;
		margin			: 0 0 5px 0;
		font-weight		: normal;
		background		: transparent url('../_images/news_title.gif') no-repeat top left;
	}

h5 { 
	margin			: 10px 0;
	font-weight		: bold;
}

h6 {
	margin			: 10px 0;
	font-weight		: bold; 
}


/* Paragraph and Link Styles */
p { }

	#right p {
		margin			: 0 0 15px 0;
	}

	#news p {
		padding			: 0 5px;
	}


em{
 font-style:italic;	
}
a { 
	color			: #c60751;
}

	#menu ul.main li a {
		display			: block;
		width			: 165px;
		height			: 24px;
		color			: #fff;
		text-decoration	: none;
		padding			: 5px 0 0 15px;
		font-size		: 14px;
		font-weight		: bold;
		background		: transparent url('../_images/menu_background.gif') no-repeat top left;
	}	

	#menu ul.main li a:hover {
		background-position: center left;
	}

	#menu ul.main li a.active, #menu ul.main li a.active:hover {
		background-position: bottom left;
	}

	#menu ul.main li ul.submain li a {
		padding-left	: 25px;
		width			: 155px;
		font-size		: 12px;
	}

	.pink a {
		color			: #7c0131;
	}

	.blue a { 
		color			: #029ed9;
	}

	.orange a {
		color			: #fff;
	}

	.banner a {
		color			: #029ed9;
		text-decoration	: none;
	}

	.banner a:hover {
		text-decoration	: underline;
	} 
		
	#right a{
		text-decoration	: none;
	}
	
	#orangebox a {
		color			: #c60751;
		text-decoration	: none;
	}
	

	
	#image a {
		color			: #073e70;
		font-size		: 16px;
		text-decoration	: none;
	}

	#image:hover a, #image a:hover, #right a:hover, #orangebox a:hover, #bluebox a:hover, #newsletter a:hover, #contact a:hover {
		text-decoration	: underline;
	}

	#news a {
		color			: #c60751;
		text-decoration	: none;
	}

	#news a:hover {
		text-decoration	: underline;
	}

	h4 a { 
		padding			: 0 0 0 20px;
	}
	
	#news h4 a {
      color       : #000000;
   }

   #left #agenda a{
   
   text-decoration:none;
   }
   
   #left #agenda a:hover{
   text-decoration:underline;
   }
   
	#agenda ul li a {
		color			: #fff;
		padding			: 0 0 0 10px;
		text-decoration	: none;
	}

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

	#sitemap ul.main li a {
		text-decoration	: none;
		color			: #c60751;
	}

	#sitemap ul.main li a:hover {
		text-decoration	: underline;
	}
	
/* Lists and Navigation */
ul { }	

	#menu ul.main {
		padding			: 15px 10px;
		background		: transparent url('../_images/menu_bottom.gif') no-repeat bottom left;
	}

	#menu ul.main li { }

	
	#menu ul.main li ul.submain { 
	}

	#menu ul.main li ul.submain li { }

	#right ul {
		margin			: 10px 0 10px 20px;
	}

	#right ul li {
		list-style-type	: disc;
	}
   
   #left #agenda ul{
   margin-bottom:10px;
   width:181px;
   }
   
	#agenda ul {
		width			: 315px;
		margin			: 12px 0 0 -17px;
		position		: relative;
	}
	
	
	


	#agenda ul li {
		list-style-type	: none;
		color			: #286802;
		border-bottom	: 1px solid #b2e272;
		padding			: 6px 0 7px 32px;
		background		: transparent url('../_images/arrow.gif') no-repeat 17px 10px;
		cursor			: pointer;
	}

   #agenda ul li.last {
      border-bottom  : none;
      padding-bottom : 0;
   }

	#sitemap ul.main { }

	#sitemap ul.main li {
		display			: inline;
		padding			: 0 7px 0 6px;
		background		: transparent url('../_images/bar.gif') no-repeat right;
	}

	#sitemap ul.main li.last {
		background		: none;
		padding-right	: 0;
	}
	
	#main_sitemap ul li {
		list-style-image: url('../_images/arrow2.gif');
		font-weight     : bold;
	}
	#main_sitemap ul li a{
		text-decoration: none;
	}
	#main_sitemap ul li a:hover {
		text-decoration: underline;
	}
	
	#main_sitemap ul li ul li {
      font-weight: normal;
   }
   
   #main_sitemap ul li ul {
      margin-top : 2px;
   }
	

/* Forms */
form { }

	#contact input { 
		border: 1px solid #999;
		height			: 19px;
		margin-bottom: 3px; 
		padding			: 1px 0 0 5px;
	}
	#contact select {
		border: 1px solid #999;
		height			: 23px;
		margin-bottom: 2px; 
		padding			: 1px 0 0 5px;		
	}

	#contact textarea {
		 border: 1px solid #999;
		 margin-bottom: 3px; 
		 padding			: 5px 0 0 5px;
		 font			: normal 12px "Trebuchet MS", "Verdana", "Arial", sans-serif;		 
	}
	
	#newsletter form {
		width			: 180px;
		margin			: 8px 0 5px -7px;
	}
	
	#newsletter a{
		text-decoration	: none;
	}

	#newsletter input {
		width			: 140px;
		height			: 23px;
		background		: transparent url('../_images/newsletter_input.gif') no-repeat top left;
		border			: 0;
		float			: left;
		color			: #fff;
		padding			: 6px 0 0 15px;
		font			: normal 12px "Trebuchet MS", "Verdana", "Arial", sans-serif;
	}
	
	#newsletter img {
		cursor			: pointer;
		width			: 25px;
		height			: 29px;
	}
	
/*****************************/
/****** MAIN MENU STYLES *****/
/*****************************/

body {
   background        : #ffffff url('../_images/header/home_bg_color.gif') repeat-x top left;
}
body #top {
   background        : transparent url('../_images/header/home_bg.gif') no-repeat top center;
}

/*** onderwijs ***/
body.onderwijs {
	background			: #ffffff url('../_images/header/onderwijs_bg_color.gif') repeat-x top left;
}
body.onderwijs #top {
	background			: transparent url('../_images/header/onderwijs_bg.gif') no-repeat top center;
}

/*** school ***/
body.school {
   background        : #ffffff url('../_images/header/school_bg_color.gif') repeat-x top left;
}
body.school #top {
   background        : transparent url('../_images/header/school_bg.gif') no-repeat top center;
}

/*** ouders ***/
body.ouders {
   background        : #ffffff url('../_images/header/ouders_bg_color.gif') repeat-x top left;
}
body.ouders #top {
   background        : transparent url('../_images/header/ouders_bg.gif') no-repeat top center;
}

/*** aanmelden ***/
body.aanmelden {
   background        : #ffffff url('../_images/header/aanmelden_bg_color.gif') repeat-x top left;
}
body.aanmelden #top {
   background        : transparent url('../_images/header/aanmelden_bg.gif') no-repeat top center;
}

/*** klassen ***/
body.klassen {
   background        : #ffffff url('../_images/header/klassen_bg_color.gif') repeat-x top left;
}
body.klassen #top {
   background        : transparent url('../_images/header/klassen_bg.gif') no-repeat top center;
}


#menu {
   width                : 900px;
   margin               : 139px auto 0 auto;
   z-index              : 999 !important;
   position             : relative;
      
}

#menu ul
{
   margin               : 0;
   padding              : 0;
   text-indent          : 0;
   list-style-image     : none;
   list-style-type      : none;
}

#menu li
{
   float                : left;
   list-style-type      : none;
   height               : 30px;
   min-width            : 30px;
   padding              : 20px 0 0 0;
   position             : relative;
   width                : 180px;
}

#menu li.school {
   background           : transparent url(../_images/header/school_menuitem_top.gif) no-repeat bottom left;
}
#menu li.schoolhover,
#menu li.school:hover {
   background           : transparent url(../_images/header/school_menuitem_top_hover.gif) no-repeat bottom left;
}
#menu li.schoolhover ul,
#menu li.school:hover ul {
   background           : transparent url(../_images/header/school_menuitem_middle.gif) no-repeat top left;
   display				: block;
}
#menu li.schoolhover ul li.last,
#menu li.schoolhover ul li.lasthover,
#menu li.school:hover ul li.last {
   background           : transparent url(../_images/header/school_menuitem_bottom.gif) no-repeat left bottom;
}



#menu li.ouders {
   background           : transparent url(../_images/header/ouders_menuitem_top.gif) no-repeat bottom left;
}
#menu li.oudershover,
#menu li.ouders:hover {
   background           : transparent url(../_images/header/ouders_menuitem_top_hover.gif) no-repeat bottom left;
}
#menu li.oudershover ul,
#menu li.ouders:hover ul {
   background           : transparent url(../_images/header/ouders_menuitem_middle.gif) no-repeat top left;
   display				: block;
}
#menu li.oudershover ul li.last,
#menu li.oudershover ul li.lasthover,
#menu li.ouders:hover ul li.last {
   background           : transparent url(../_images/header/ouders_menuitem_bottom.gif) no-repeat left bottom;
}



#menu li.aanmelden {
   background           : transparent url(../_images/header/aanmelden_menuitem_top.gif) no-repeat bottom left;
}
#menu li.aanmeldenhover,
#menu li.aanmelden:hover {
   background           : transparent url(../_images/header/aanmelden_menuitem_top_hover.gif) no-repeat bottom left;
}
#menu li.aanmeldenhover ul,
#menu li.aanmelden:hover ul {
   background           : transparent url(../_images/header/aanmelden_menuitem_middle.gif) no-repeat top left;
   display				: block;
}
#menu li.aanmeldenhover ul li.last,
#menu li.aanmeldenhover ul li.lasthover,
#menu li.aanmelden:hover ul li.last {
   background           : transparent url(../_images/header/aanmelden_menuitem_bottom.gif) no-repeat left bottom;
}



#menu li.klassen {
   background           : transparent url(../_images/header/klassen_menuitem_top.gif) no-repeat bottom left;
}
#menu li.klassenhover,
#menu li.klassen:hover {
   background           : transparent url(../_images/header/klassen_menuitem_top_hover.gif) no-repeat bottom left;
}
#menu li.klassenhover ul,
#menu li.klassen:hover ul {
   background           : transparent url(../_images/header/klassen_menuitem_middle.gif) no-repeat top left;
   display				: block;
}
#menu li.klassenhover ul li.last,
#menu li.klassenhover ul li.lasthover,
#menu li.klassen:hover ul li.last {
   background           : transparent url(../_images/header/klassen_menuitem_bottom.gif) no-repeat left bottom;
}


#menu li.onderwijs {
   background           : transparent url(../_images/header/onderwijs_menuitem_top.gif) no-repeat bottom left;
}
#menu li.onderwijshover,
#menu li.onderwijs:hover {
   background           : transparent url(../_images/header/onderwijs_menuitem_top_hover.gif) no-repeat bottom left;
}
#menu li.onderwijshover ul,
#menu li.onderwijs:hover ul {
   background           : transparent url(../_images/header/onderwijs_menuitem_middle.gif) no-repeat top left;
   display				: block;
}
#menu li.onderwijshover ul li.last,
#menu li.onderwijshover ul li.lasthover,
#menu li.onderwijs:hover ul li.last {
   background           : transparent url(../_images/header/onderwijs_menuitem_bottom.gif) no-repeat left bottom;
}


#menu li a:link,
#menu li a:visited,
#menu li a:active,
#menu li a:hover
{
   display              : block;
   height               : 26px;
   text-decoration      : none;
   background-color     : transparent;
   color                : #ffffff;
   font-size            : 12pt;
   padding-top          : 2px;
   padding-left         : 16px;
   font-weight          : bold;
}

#menu li ul
{
   display              : none;
   left                 : 0;
   padding-top          : 3px;
   position             : absolute;
   top                  : 50px;
   width                : 180px;
   z-index              : 333;
}

#menu li ul li.last,
#menu li ul li.lasthover {
   margin-bottom        : -19px;
   padding-bottom       : 20px;
}

#menu li:hover a:link,
#menu li:hover a:visited,
#menu li:hover a:active,
#menu li:hover a:hover,
#menu li.hover a:link,
#menu li.hover a:visited,
#menu li.hover a:active,
#menu li.hover a:hover
{
   color                : #ffffff;
}

#menu li:hover ul,
#menu li.hover ul
{
   display              : block;
}

#menu li ul li
{
   position             : relative;
   width                : 165px;
   padding              : 9px 0 0 15px;
   color                : #ffffff;
   height               : auto;
}

#menu li ul li a:link,
#menu li ul li a:visited,
#menu li ul li a:active,
#menu li ul li a:hover
{
   display:inline;
   font-size:10pt;
   font-weight:normal;
   margin:0;
   padding-top:5px;
   padding-bottom:5px;
   position:relative;
   text-align:left;
   text-transform:none;
   padding-left:0;
}

#menu li ul li a:active,
#menu li ul li a:hover
{
   color                : #000000 !important;
}

#menu li:hover ul li a:link,
#menu li:hover ul li a:visited,
#menu li:hover ul li a:active,
#menu li:hover ul li a:hover,
#menu li.hover ul li a:link,
#menu li.hover ul li a:visited,
#menu li.hover ul li a:active,
#menu li.hover ul li a:hover
{
   background-image     : none;
}

#menu li ul li ul
{
   display              : none!important;
   position             : absolute;
   left                 : 240px;
   top                  : 0px;
   width                : 250px;
   z-index              : 334;
}

#menu li ul li:hover ul,
#menu li ul li.hover ul
{
   display              : block!important;
}