@font-face {
  font-family: 'Special Elite';
  font-style: normal;
  font-weight: bold;
  src: local('Special Elite'), local('SpecialElite-Regular'), url('http://themes.googleusercontent.com/static/fonts/specialelite/v3/9-wW4zu3WNoD5Fjka35Jm_n8qdNnd5eCmWXua5W-n7c.woff') format('woff');
}
/*
 * =============================================================================
 * Primary styles Author: Rudy de Jong
 * ==========================================================================
 */
 
 
 /*
 * =============================================================================
 * Functions
 * ==========================================================================
 */
 .border-radius (@radius: 5px) {
	  -webkit-border-radius: @radius; // Saf3-4, iOS 1-3.2, Android <1.6
	     -moz-border-radius: @radius; // FF1-3.6
	          border-radius: @radius; // Opera 10.5, IE9, Saf5, Chrome, FF4,
										// iOS 4, Android 2.1+
	          
	// useful if you don't want a bg color from leaking outside the border
	   -moz-background-clip: padding; 
	-webkit-background-clip: padding-box; 
			background-clip: padding-box;
}
.border-top-radius (@radius: 5px) {
	  -webkit-border-top-left-radius: @radius; // Saf3-4, iOS 1-3.2, Android
												// <1.6
	 -webkit-border-top-right-radius: @radius; // Saf3-4, iOS 1-3.2, Android
												// <1.6
	     -moz-border-top-left-radius: @radius; // FF1-3.6
	    -moz-border-top-right-radius: @radius; // FF1-3.6
	          border-top-left-radius: @radius; // Opera 10.5, IE9, Saf5,
												// Chrome, FF4, iOS 4, Android
												// 2.1+
	         border-top-right-radius: @radius; // Opera 10.5, IE9, Saf5,
												// Chrome, FF4, iOS 4, Android
												// 2.1+
	          
	// useful if you don't want a bg color from leaking outside the border
	   -moz-background-clip: padding; 
	-webkit-background-clip: padding-box; 
			background-clip: padding-box;
}
.border-left-radius (@radius: 5px) {
	  -webkit-border-top-left-radius: @radius; // Saf3-4, iOS 1-3.2, Android
												// <1.6
   -webkit-border-bottom-left-radius: @radius; // Saf3-4, iOS 1-3.2, Android
												// <1.6
	     -moz-border-top-left-radius: @radius; // FF1-3.6
	  -moz-border-bottom-left-radius: @radius; // FF1-3.6
	       	  border-top-left-radius: @radius; // Opera 10.5, IE9, Saf5,
												// Chrome, FF4, iOS 4, Android
												// 2.1+
	       border-bottom-left-radius: @radius; // Opera 10.5, IE9, Saf5,
												// Chrome, FF4, iOS 4, Android
												// 2.1+
	          
	// useful if you don't want a bg color from leaking outside the border
	   -moz-background-clip: padding; 
	-webkit-background-clip: padding-box; 
			background-clip: padding-box;
}
.border-right-radius (@radius: 5px) {
	  -webkit-border-top-right-radius: @radius; // Saf3-4, iOS 1-3.2, Android
												// <1.6
   -webkit-border-bottom-right-radius: @radius; // Saf3-4, iOS 1-3.2, Android
												// <1.6
	     -moz-border-top-right-radius: @radius; // FF1-3.6
	  -moz-border-bottom-right-radius: @radius; // FF1-3.6
	       	  border-top-right-radius: @radius; // Opera 10.5, IE9, Saf5,
												// Chrome, FF4, iOS 4, Android
												// 2.1+
	       border-bottom-right-radius: @radius; // Opera 10.5, IE9, Saf5,
												// Chrome, FF4, iOS 4, Android
												// 2.1+
	          
	// useful if you don't want a bg color from leaking outside the border
	   -moz-background-clip: padding; 
	-webkit-background-clip: padding-box; 
			background-clip: padding-box;
}.box-shadow () {
	-webkit-box-shadow: @arguments;
	   -moz-box-shadow: @arguments;
			box-shadow: @arguments;
}

.rotation(@deg:5deg, @skew:0deg){
	-webkit-transform: skew(@skew) rotate(@deg);  /* Saf3.1+, Chrome */
     -moz-transform: skew(@skew) rotate(@deg);  /* FF3.5+ */
      -ms-transform: skew(@skew) rotate(@deg);  /* IE9 */
       -o-transform: skew(@skew) rotate(@deg);  /* Opera 10.5 */
          transform: skew(@skew) rotate(@deg);
}
.double-box-shadow (@first, @second) {
	-webkit-box-shadow: @first, @second;
	   -moz-box-shadow: @first, @second;
			box-shadow: @first, @second;
}
.text-shadow (@x: 0.1em, @y: 0.1em, @spread: 0.1em, @base-color: rgba(0,0,0,.4)) {
	text-shadow: @x @y @spread @base-color;
}
.no-text-shadow () {
	text-shadow: none;
}
.opacity (@opacity: .3) {
	@ie: @opacity*100;
			 opacity: @opacity; 			// Standard: FF gt 1.5, Opera,
											// Safari
			  filter: alpha(opacity=@ie); 	// IE lt 8
		  -ms-filter: "alpha(opacity=@ie)"; // IE 8
	  -khtml-opacity: @opacity; 			// Safari 1.x
		-moz-opacity: @opacity; 			// FF lt 1.5, Netscape
}

.transition(@seconds:2s, @property:width, @easing:ease-in){
  -webkit-transition: @property @seconds @easing;
     -moz-transition: @property @seconds @easing;
      -ms-transition: @property @seconds @easing;
       -o-transition: @property @seconds @easing;
          transition: @property @seconds @easing;
}
.linear-gradient (@base-color-top: #fff, @base-color-bottom: #000) {
	background-color: @base-color-top;
	background-image: -webkit-gradient(linear, left bottom, left bottom, from(@base-color-top), to(@base-color-bottom)); 
	background-image: -webkit-linear-gradient(bottom, @base-color-top, @base-color-bottom); /*
																							 * Chrome
																							 * 10+,
																							 * Saf5.1+,
																							 * iOS
																							 * 5+
																							 */
	background-image:    -moz-linear-gradient(left bottom, @base-color-top, @base-color-bottom); /* FF3.6 */
	background-image: 	  -ms-linear-gradient(left bottom, @base-color-top, @base-color-bottom); /* IE10 */
	background-image: 	   -o-linear-gradient(left bottom, @base-color-top, @base-color-bottom); /*
																							 * Opera
																							 * 11.10+
																							 */
	background-image: 		  linear-gradient(bottom, @base-color-top, @base-color-bottom);
			  filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorStr='@{base-color-top}', EndColorStr='@{base-color-bottom}',GradientType=1)"; 
}




/*
 * =============================================================================
 * Start main styles
 * ==========================================================================
*/

html {

}

html, body {min-height: 100%;}

body{
	background-color: #aec5e3;
    font: 12px/140% Tahoma, Verdana, sans-serif; 
    color: #6e6e6e;
	position: relative;
}	


#wrapper{
	margin: 0 auto -26px;
    position: relative;
    width: 1000px;
    min-height: 768px;
    /*background-color: #1d59a0;*/
	.box-shadow(0 0 12px 0 #000);
	behavior: url(PIE.htc);
	min-height: 100%;
	height: auto !important;
	&.home{
		background: #1d59a1 url('../images/bg.jpg') no-repeat top left;
	}	
	&.sub{
		background-color: #fff;
	}
	
	a{
		color: #1D59A0;
	}	
   
   /*.border-radius(0px 0px 5px 5px);*/
  
	h1,h2,h3,h4{
    	margin: 0;
    	padding: 0;
	}
	
	h1{}
	h2{line-height: 25px;}
	h3{font-size: 14px; line-height: 20px;}
	a{text-decoration: underline;}
	p{margin: 0 0 10px 0;}
	input{
		border: 1px solid #fff;
	}

	&.home{
		color: #fff;
		>div.logo{
			width: 218px;
			height: 224px;
			margin: 0 auto;
			padding-top: 53px;
		}

		>div.vestigingen{
			margin-top: 48px;
			position: relative;
			>div.locatie{
				position: relative;
				z-index: 2;
				&.develsingel{float: left; margin-left: 168px;}
				&.loc{float: right; margin-right: 168px;}

				img{
					&:hover{
						.box-shadow(0 0 8px 0 #fff);
						width: 267px;
						height: 182px;
						margin: -2px;
					}	
				}
				>.adres{
					text-align: center;
					margin-top:6px;
					width: 262px;
					font: normal 11px/14px Tahoma, Geneva, sans-serif;
					h1{
						font: bold 15px/25px Tahoma, Geneva, sans-serif;
					}
				}

				a{
					color: #fff;	
					text-decoration: none;
				}

				a:hover{
					text-decoration: underline;
				}
			}
			>.kies-locatie{
				float: left;
				text-align: center;
				width: 138px;
				margin-top: -10px;
			}

			>.foto-show{
				width: 100%;
				height: 88px;
				position: absolute;
				top: 41px;
				left: 0;
				z-index: 1;
				.box-shadow(0 0 12px 0 #143e70);

				>*{
					float: left;
				}
			}
		}
	}

	&.sub{
		>header{
			height: 175px;
			position: relative;
			z-index:1;
			background: #1C589F url('../images/header-schaduw.png') repeat-x bottom left;
			
			&.groepAcht{
				/* background-color: #1C589F; */
				height: 165px;
			}

			>.top-nav{
				height: 77px;
				position: relative;
				>.breadcrumbs{
					float: left;
					margin-left: 215px;
					li{
						float: left;
						color: #fff;
						font-size: 9px;
						>span{
							margin: 0 3px;
						}
						>a{
							color: #fff;
							text-decoration: none;
							&:hover{
								text-decoration:underline;
							}	
						}
					}
				}
				>.quick-nav{
					float: right;
					margin-right:35px;
					margin-top: 9px;
					
					ul{
						li{
							float: left;
							background: url(../images/quick-nav-icons.png) no-repeat top left;
							height: 16px;
							width: 16px;
							margin: 0 3px;
							position: relative;

							>a{
								position: absolute;
								top: 0;
								right: 0;
								bottom: 0;
								left: 0;
							}
							&.home{background-position: 0 0;}
							&.email{background-position: -23px 0; width: 24px;}
							&.search{background-position: -52px 0;}
							&.search-blok{
								background: none;
								width: auto;
								input{
									width: 117px;
									padding: 2px;
									float: left;
								}
							}
						}
					}	
				}
				span.ingelogd-melding{
					position: absolute;
					bottom: 5px;
					right: 20px;
					color: #f9ae00;
					font-size: 11px;
					a{color: #f9ae00;}
				}
				>.school{
					color: #e7ae16; 
					display: block;
					position: absolute;
					bottom: 2px;
					right: 38px;
					font-weight: bold;
				}
				>.payoff {
					display: block;
					position: absolute;
					bottom: 10px;
					left: 220px;
					font-weight: bold;
					width:174px;
					height:39px;
					background-image:url(/data/wcf/dc/images/altijd-in-beweging-payoff.png);
					text-indent: -9999px
				}
			}
			>.logo{
				position: absolute;
				top: 13px;
				left: 100px;
				width: 140px;
				height: 144px;
				z-index: 2;
			}
			>.foto-show{
				position: relative;
				height: 88px;
				overflow: hidden;
				>.overlay{
					position: absolute;
					bottom:0;
					left:40px;
					width: 252px;
					height: 88px;
					background: url(../images/banner-overlay.png) no-repeat top left;
				}
			}
		}
		>.main-menu{
			background-color: #fff;
			float: right;
			position: absolute;
			left: 215px;
			top: 177px;
			margin-top: -24px;
			z-index:1;
			li{
				float: left;
				/*.linear-gradient(#e4a817, #d77e19);*/
				background: url('../images/menu_bg.jpg') no-repeat top left;
				width: 157px;

				&:hover, &.active{
					/*.linear-gradient(#fe6e03, #ca4d18);*/
					background: url('../images/menu_bg_hover.jpg') no-repeat top left;
					
					a{
						font-weight: bold;
					}
				}	

				>a{
					color: #fff;
					line-height: 35px;
					text-align: center;
					text-decoration: none;
					display: block;
					font-size: 14px;

				}
			}
		}
		>section{
			min-height: 570px;
			position: relative;
		
			padding: 17px 0 19px 0;
			
			
			input{
				border: 1px solid #000;
				margin: 2px 0;
			}


			&.groepAcht{
				min-height: 600px;
				background: #fff url('../images/groep8_bg.jpg') no-repeat top left;
				padding: 0;
				
				
				
				>div.content{
					width: 100%;
					height: 487px;

					a{font-weight:normal;}
				}
				

				.tooltip{
					background-color: #1d59a0;
					color: #fff;
					padding: 10px;
					opacity: 0;
					filter: alpha(opacity=0);
					-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
					-moz-transition: opacity 2s;
					position: absolute;
					z-index: 2;
					width: 300px;
					line-height: 15px;

					a{
						color: #fff;
						text-decoration: underline;
					}

				}

				.position{position: absolute; cursor: pointer;

					.active{
						opacity: 100;
						filter: alpha(opacity=100);
						-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
					}
					/*
					&:hover{
						.tooltip{
							opacity: 100;
							filter: alpha(opacity=100);
							-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
						}
					}	*/
				}

				.slaapzak{left: 64px; top: -100%; .transition(2s, top);
					>.tooltip{top: -12px;left: -50px;}
				}
				.drop{left: 32px; top: -100%; width: 97px; height: 102px; .transition(2.5s, top); 
					>.tooltip{top: -15px; left: -28px; width: 200px;}
				}
				.fluitje{left: 30px; top: -100%; width: 190px; height: 100px; .transition(2.5s, top);
					>.tooltip{top: -5px; left: -20px; width: 175px;}
				}
				.skm{left: 265px; top: -100%; width: 143px; height: 135px; .transition(3s, top);
					>.tooltip{top: -40px; left: -50px;}
				}
				.les-volgen{left: 430px; top: -100%; width: 151px; height: 107px; .transition(3s, top); 
					>.tooltip{top: -10px; left: -50px; width: 200px;}
				}
				.usb{left: 435px; top: -100%; width: 133px; height: 118px; .transition(3s, top); 
					>.tooltip{top: -10px; left: -80px; width: 150px;}
				}
				.lab{left: 565px; top: -300%; width: 118px; height: 87px; .transition(2s, top); 
					>.tooltip{top: -20px; left: -60px; width: 175px;}
				}
				.memo{left: 750px; top: -100%; width: 116px; height: 128px; .transition(3s, top); 
					>.tooltip{top: -30px; left: -70px; width: 200px;}
				}
				.schoolpas{right: 24px; top: -300%; width: 141px; height: 102px; .transition(2s, top); 
					>.tooltip{top: -15px; left: -70px; width: 175px;}
				}
				
				.gymnasium{right: 200px; top: -100%; width: 100px; height: 70px; .transition(3s, top); z-index: 10; 
					>.tooltip{top: -30px; left: -20px;}
				}
				.kwast{top:-100%; right: 5px; width:270px; height:134px; .transition(2s, top); 
					>.tooltip{top: 34px; left: -15px; width: 270px;}
				}
				.rekenmachine{top:-100%; right: 290px; width:94px; height:117px; .transition(3.3s, top); 
					>.tooltip{top: -10px; left: -120px; width: 135px;}
				}
				
				.schoolbel{top:-100%; right: 5px; width:126x; height:171px; .transition(3.3s, top); 
					>.tooltip{top: 18px; right: 20px; width: 160px;}
				}
				.rugzak{top:-100%; left: 335px; width:100px; height:97px;
					>.tooltip{top: 18px; left: 0px; width: 160px;}
				}
				.leerlingen{top:-100%; right: 230px; width:170px; height:175px; 
					>.tooltip{top: 20px; left: 50px; width: 160px;}
				}
				.film1{top:-100%; left: 295px; width:94px; height:77px; 
					>.tooltip{top: -1000%; left: 289px; width: 160px;}
				}
				.film2{top:-100%; left: 247px; width:94px; height:77px; 
					>.tooltip{top: -1000%; left: 243px; width: 160px;}
				}
				.lunch{top:-100%; left: 104px; width:94px; height:85px; 
					>.tooltip{top: 20px; left: 0px; width: 175px;}
				}

				&.active{
					.slaapzak{top: 37px;}
					.drop{top: 180px;}
					.fluitje{top: 430px;}
					.skm{top: 415px;}
					.les-volgen{top: 150px;}
					.usb{top:340px;}
					
					.lab{top:63px;}
					.memo{top:95px;}
					.schoolpas{top:235px;}
					.gymnasium{top:414px;}
					.kwast{top:453px;}
					.rekenmachine{top: 447px;}
					.schoolbel{top: -5px;}
					.rugzak{top: 265px;}
					.leerlingen{top: 235px;}
					.film1{top: 70px;}
					.film2{top: 150px;}
					.lunch{top: 254px;}
					
					
					
				}

				.filmpjes{
					width: 142px;
					height: 163px;
					position: absolute;
					top: 70px;
					left: 240px;
					&:hover{
						-moz-transform: scale(1.1,1.1);
					}
				}
				.jongen{
					height: 86px;
				    left: 121px;
				    position: absolute;
				    top: 254px;
				    width: 72px;
					
				   &:hover{
				   	-moz-transform: scale(1.1,1.1);
				   }	
				}

				.kwast{
					> img{
						-moz-transition: -moz-transform 1s ease-in 0s;
						&:hover{
							-moz-transform: rotate(70deg);
						}	
					}
				}
			}
		
			nav.submenu{
				
				>ul{
					> li{
						border-bottom: 1px solid #c5c5c5;
						padding-bottom: 2px;
						padding-top: 1px;
						color: #c5c5c5;
						
						&.first{
							border-top: 1px solid #c5c5c5;
						}
						span{display:inline-block; vertical-align: top;}
						a{
							text-decoration: none;
							display:inline-block;
							width: 120px;
							&.active, &:hover{
								color: #E35B00;
							}
						}
						> a{
							color: #c5c5c5;
							font-size: 12px;
							font-weight: bold;
							line-height: 20px;
							display: block;
						}

						>ul{
							>li{
								a{
									color: #c5c5c5;
									font-size: 11px;
								}
							}
						}
					}
				}
			}

			div.postit {
				position:absolute;
				top:-27px;
				left:18px;
				z-index:10;
				img {
					max-height:190px;
				}
			}

			div.menu-contact{
				padding: 4px 0px 0px 38px;
				float: left;
				margin-right: 43px;
				width: 134px;

				>.submenu{
					margin-bottom: 120px;
				}
			}

			> div.content{
				float: left;
				width: 760px;
				padding: 30px 25px 40px 0;
				
				a{
					font-weight: bold; 
					color: #6E6E6E;
					text-decoration: underline;
				}


				h1{
					color: #e35b00;
					font-size: 16px;
					line-height: 30px;
					font-weight: bold;
				}

				/* Two cols template */
				div.two-cols{
					.column{
						float: left;
					}

					.left-column{
						width: 565px;
						margin-right: 50px;
					}
					.right-column{
						
					}
				}

				/* Nieuws */

				div#nieuws{
					background-color: #ffd4b2;
					padding: 12px;
					
					.header{
						color: #ca4e18;
						font-weight: bold;
						font-size: 13px;
						padding-bottom: 10px;
					}

					li{
						border-bottom: 1px dotted #000;
						padding: 5px 0;

						&.archief{
							border: none;
							padding: 10px 0;

							a{
								color: #6e6e6e;
							}
						}
					}

					strong{
						font-size: 14px;
						color: #6e6e6e;
					}
					
					strong, span{
						display: block;
					}

					a{
						color: #597aa5;
						text-decoration: none;

						&:hover{
							text-decoration: underline;
						}
					}

					span{
						&.datum{
							font-size: 10px;
							line-height: 20px;
						}
					}
				}

				/* Twitter */
				
				.twitter-header{
					color: #386CAC;
				    height: 48px;
				    line-height: 48px;
				    padding: 10px 10px 10px 60px;
				    width: 220px;
				    font-size: 16px;
					background: #E7EDF7 url('../images/twitter.png') no-repeat 3% 50%;

					a{text-decoration: none;}
				}


				.twtr-widget{
					.twtr-bd{
						padding: 0 5px 10px 5px;
					}
					
					.twtr-doc{
						.border-radius(0px);
					}
					.twtr-user{font-weight: bold;}
					/*.twtr-timeline{overflow: visible;}*/
					.twtr-hd h3, .twtr-hd h4{margin: 0 !important; padding: 0 !important;}
					.twtr-hd h3{display: none;}
					.twtr-profile-img-anchor{display: none;}
					
					.twtr-tweet{
						border-bottom: 2px dotted #fff;
					}
					.twtr-ft img, .twtr-hd, .twtr-ft{
						display: none;
					}
				}

				/* Agenda */

				div#agenda{
					margin-bottom: 10px;
					padding-right: 20px;
					.header{
						color: #6e6e6e;
						font-weight: bold;
						font-size: 16px;
						padding-bottom: 4px;
					}

					ul.archief span{width: auto;}
					
					span{
						float: left;
						
						&.titel{
							width: 194px;
							margin-left: 4px;
						}
					}

					li{display:block; overflow: hidden;}

					li.archief{
						padding-top: 5px;
						clear: both;
						float: none;
						a{
							color: #6e6e6e;
							text-decoration: none;

							&:hover{
								text-decoration: underline;
							}
						}
					}
				}
				
				/* Home template */
				table#homeTmpl{}
				table#homeTmpl td.col1, table#homeTmpl td.col2{width: 290px;}
				table#homeTmpl td.col3{width: 171px; padding-left: 30px;}
			}
			
			.popup{
				width: 562px;
				background-color: #1d59a0;
				position: absolute;
				top: 85px;
				left:50%;
				margin-left: -281px;
				z-index: 10;
				cursor: pointer;
				
				.inner{
					padding: 30px;
					color: #fff;
				}
			}
			
			.rowColor1 em, .rowColor2 em{color:#E35B00; }
		}
	}
}

footer{
	color: #fff;
	font-size: 9px;
	margin-top: -1px;
	width: 1000px;
	height: 26px;
	position: relative;
	margin: 0 auto;
	background: #1d59a0 url('../images/footer-schaduw.png') repeat-x top left;
	/*.box-shadow(0 0 12px 0 #000);*/
	behavior: url(PIE.htc);
	
	>.contact{
		top: -111px;
		position: absolute;
		width: 175px;
		font-size: 11px;
		line-height: 15px;
		left: 20px;
		color: #6E6E6E;

		a:link, a:visited, a:hover, a:active{
			color: #6e6e6e;
		}
	}
	
	>.inner{
		padding-left: 215px;
		padding-top: 9px;
		position: relative;

		a.loc {
			display:block;
			position: absolute;
			right: 0px;
			top:-29px;
		}
	}

	a:link, a:visited, a:hover, a:active{
		color: #fff;
		text-decoration: none;

		&:hover{
			text-decoration: underline;
		}	
	}
}
html.no-cssgradients #wrapper.sub .main-menu li{
	background: url('../images/menu_bg.jpg') no-repeat top left;
}

#wrapper.sub {
	section {
		.content {

			#homeTable2 .td_left {
				width:561px;
				padding-right:12px;
			}
			#homeTable2 .td_right {
				width:190px;
				padding-top:24px;
				text-align:center;
			}
			.inner_left {
				/* width:279px; */
				width:306px;
				border-top:3px solid white;
				border-right:0px solid white;
			}
			.inner_right {
				width:283px;
				border-top:3px solid white;
				
			}
			#homeTable2inner p {
				padding:0;
				margin:0;
			}
			#homeTable2inner .nieuws{
				background:#ffbf11;
				border:0px;
				border-bottom:3px solid white;
				padding:10px;
				color:#ffffff;
				h1 {
					color:#c55d29;
				}
				.list {
					a {
						color:#c55d29;
						text-decoration:none;
					}
				}
			}
			#homeTable2inner .agenda {
				background:#d38f33;
				border:0px;
				border-bottom:3px solid white;
				padding:10px;
				color:#ffffff;
				.header {
					color:#a73a0c;
				}
				.titel {
					margin-left:0px;
					font-weight:bold;
				}
				.list {
					a {
						color:#a73a0c;
						text-decoration:none;
					}
				}
			}
			#homeTable2inner .youtube {
				background:#b9e450;
				width:145px;
				float:left;
				
				border-right:3px solid white;
				
				/*
				border-bottom:2px solid white;
				padding:4px; 
				*/
			}
			#homeTable2inner .twitter {
				background:#88c8e9;
				width:149px;
				padding-right:0;
				margin-right:0;
				float:left;
				border-right:0px;
				/*
				border-bottom:2px solid white;
				padding:4px;
				*/
			}
			#homeTable2inner .info {
				background:#c40079;
				border-left:3px solid white;
				border-bottom:3px solid white;
				border-right:1px solid white;
				padding:10px;
				color:#ffffff;
				h1 {
					color:#ffffff;
				}
				a {
					color:#ff78cb;
					text-decoration:none;
				}
			}
			#homeTable2inner .buttons img{
				border:0px;
				border-left:3px solid white;
				border-bottom:3px solid white;
				float:left;
				width:129px;
			}
			
			
			/*
			*	 HOME TABLE 3
			*/
			
			#homeTable3{

				.td_left {
					width:561px;
					padding-right:12px;
				}
				.td_right {
					width:190px;
					padding-top:24px;
					text-align:center;
				}
				.inner_left {
					width:306px;
					border-top:3px solid white;
					border-right:0px solid white;
				}
				.inner_right {
					width:283px;
					border-top:3px solid white;
					
				}
				#homeTable3inner {
					p {
						padding:0;
						margin:0;
					}
					.nieuws{
						background:#ffbf11;
						border:0px;
						border-bottom:3px solid white;
						padding:10px;
						color:#ffffff;
						h1 {
							color:#c55d29;
						}
						.list {
							a {
								color:#c55d29;
								text-decoration:none;
							}
						}
					}
					.agenda {
						background:#d38f33;
						border:0px;
						border-bottom:3px solid white;
						padding:10px;
						color:#ffffff;
						.header {
							color:#a73a0c;
						}
						.titel {
							margin-left:0px;
							font-weight:bold;
						}
						.list {
							a {
								color:#a73a0c;
								text-decoration:none;
							}
						}
					}
					.youtube {
						background:#b9e450;
						float:left;
						width: 129px;
						height: 83px;
					}
					.facebook{
						width: 145px;
						float:left;
						border-right: 3px solid #fff;
						background: #466ec5;
					}
					.twitter {
						background:#88c8e9;
						width:149px;
						float:left;
					}
					.info {
						background:#c40079;
						border-left:3px solid white;
						border-bottom:3px solid white;
						border-right:3px solid white;
						padding:10px;
						color:#ffffff;
						width: 109px;
						float: left;
						h1 {
							color:#ffffff;
						}
						a {
							color:#ff78cb;
							text-decoration:none;
						}
					}
					.buttons{clear: left;}
					.buttons img{
						border:0px;
						border-left:3px solid white;
						border-bottom:3px solid white;
						float:left;
						width:129px;
					}
				}	
			}
		}
	}
}

/* Portlet styling */

 /* header portlet */
#wrapper .content .wp3-portlet:not(.login) .wp3-portlet-top, #wrapper .content .wp3-custom-dialog .wp3-portlet .wp3-portlet-top{
    background: #1C589F;
    box-shadow: 0 1px 3px 1px rgba(28, 88, 159, 0.76);
}
/* header tables styles*/
#wrapper .content .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data.wp3-portlet-table-data-blue > thead, .wp3-custom-dialog .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data.wp3-portlet-table-data-blue > thead {
    background: #AEC5E3;
}
#wrapper .content .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data > thead > tr > th,
#wrapper .content .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data > thead table.wp3-portlet-table-data-currday > thead > tr > th strong{
    color: #fff;
}
#wrapper .content .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data > thead > tr > th .wp3-portlet-table-data-currday thead{
    border-bottom: 1px solid #fff;
}
#wrapper .content .wp3-portlet .wp3-portlet-top .line-sep {
    background: #fff;
}
#wrapper .content .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data.wp3-portlet-result-cijfer-table thead,
#wrapper .content .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data > thead, .wp3-custom-dialog .wp3-portlet .wp3-portlet-content .wp3-portlet-table-data > thead {
    background: #AEC5E3;
}   
/* tooltip */
.jTooltip.default,
#wrapper .content .wp3-portlet .wp3-portlet-summary {
    background: #e7e7e7;
}
.jTooltip.default div tr.grade {
    background: #1C589F !important;
    color: #fff;
}
.jTooltip.default div tr.grade td {
    border-color: #e7e7e7 !important;
}
#wrapper .content .wp3-portlet.som_pta .wp3-portlet-content .wp3-toggle-open,
#wrapper .content .wp3-portlet.som_pta .wp3-portlet-content .wp3-slide-div  {
    background: #fff;
}
 
/* Navigation */
#wrapper .content .wp3-portlet .wp3-portlet-navigation, .wp3-custom-dialog .wp3-portlet .wp3-portlet-navigation {
    background: #c7d7ec; /* Iets lichter dan #AEC5E3*/
    color: white;
}
#wrapper .content .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn.active, .wp3-custom-dialog .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn.active,
#wrapper .content .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn:hover, .wp3-custom-dialog .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn:hover,
#wrapper .content .wp3-portlet .wp3-portlet-top .buttons .print_button:hover, 
#wrapper .content .wp3-portlet .wp3-portlet-top .buttons .print_button_popup:hover {
    background: #1C589F;
}
#wrapper .content .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn.active:before,
.wp3-custom-dialog .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn.active:before,
#wrapper .content .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn:hover:before,
.wp3-custom-dialog .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn:hover:before {
    border-top-color: #1C589F;
}
#wrapper .content .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn,
.wp3-custom-dialog .wp3-portlet .wp3-portlet-navigation.wp3-period-navigator .period-btn {
    background: #fc6118; /* Iets lichter dan 1C589F*/
    color: white;
}
#wrapper .content .wp3-portlet .wp3-button, .wp3-custom-dialog .wp3-portlet .wp3-button,
#wrapper .content .wp3-portlet .wp3-portlet-content #wp3-week-calendar .fc-button, .wp3-custom-dialog .wp3-portlet .wp3-portlet-content #wp3-week-calendar .fc-button {
    color: white;
    border-color: white;
}
#wrapper .content .wp3-portlet .wp3-button.wp3-button-blue {
    background: #3581db; /* Stuk lichter dan 1C589F*/
}
#wrapper .content .wp3-portlet .wp3-button.active, .wp3-custom-dialog .wp3-portlet .wp3-button.active,
#wrapper .content .wp3-portlet .wp3-button:hover, .wp3-custom-dialog .wp3-portlet .wp3-button:hover {
    background: #1C589F;
    border-color: #1C589F;
}
#wrapper .content .wp3-portlet .wp3-portlet-content #wp3-week-calendar .fc-event {
	text-decoration: none;
}
#wrapper.sub > header > .top-nav span.ingelogd-melding {
    bottom: 22px !important;
    right: 38px !important;
}