@import url(/include/css/editor.php);

/** COLORS ****
#e4f2f7		Light Blue		Footer background
#f18f00		Orange			Nav + Font color
*/

body {
	background: url('/image/background.gif') repeat-x;
	}

#container {
	width: 970px;
	width: 992px;
	margin: 59px auto 0px auto;
	}

/** HEADER **/

#header {
	height: 78px;
	position: relative;
	padding: 0px 11px;
	background: url('/image/header-corners.gif') no-repeat center bottom;
	}
#logo {
	height: 137px;
	width: 309px;
	float: left;
	position: absolute;
	margin-top: -59px;
	border-right: 1px solid #ffffff;
	}
#logo img {
	display: block;
	}

#navigation {
	width: 660px;
	height: 90px;
	top: 0;
	right: 11px;
	position: absolute;
	}


/** LAYOUT **/

#shadow {
	background: url('/image/shadow.png') repeat-y;
	}
#site {
	padding-top: 7px;
	min-height: 650px;
	padding: 7px 18px 0px;
	background: url('/image/shadow-btm-fade.png') repeat-x left bottom;
	}
#dots {
	background: url('/image/bg-dots.gif') repeat-y center top;
	}
.content #dots {
	background-image: url('/image/bg-dots-content.gif');
	}
.content #wrapper {
	background-image: url('/image/visual-content.jpg');
	background-repeat: no-repeat;
	background-position: left top;
	}



/** CONTENT - HOME **/


#homeText #intro {
	height: 6.4em;
	overflow: hidden;
	}

#homeText h1,
#homeText h1 a,
#homeText p {
	color: #ffffff;
	}


/** CONTENT **/

#content {
	min-height: 300px;
	width: 708px;
	width: 688px;
	width: 664px;
	margin-left: 20px;
	float: left;
	}

#aboutSchool {
	width: 331px;
	width: 307px;
	margin-right: 25px;
	float: left;
	}
#middlebar {
	width: 356px;
	width: 307px;
	margin-left: 25px;
	padding-top:28px;
	float: left;
	}

#sidebar {
	width: 222px;
	padding-left: 25px;
	float: right;
	}

	#newspaper {
		display: block;
		width: 245px;
		height: 247px;
		position: absolute;
		z-index: 21;
		margin-top:-55px;
		margin-left: -23px;
		background: url('/image/uitdeklas.gif') no-repeat;
		}
			#newspaper div.ifnoflash {
				color: #073BA6;
				text-align: center;
				margin: 92px 0 0 50px;
			}
	#news {
		height: 163px;
		}
	#calendar {
		height: 163px;
		}
		#calendarItem1{
			float:left;
			margin-right:4px;
			padding:4px;
			padding-left:0px;
			background: #fff;
			/*border:1px solid #e4f2f7;*/ 
			width:140px;
			height:120px;
			overflow:hidden;
			}
		#calendarItem2{
			float:left;
			margin-right:0px;
			padding:4px;
			background: #fff;
			/*border:1px solid #e4f2f7;*/ 
			width:140px;
			height:120px;
			overflow:hidden;
			}			
		p.date { 
			background:#f6f6f6; 
			display:block;
			margin-right:4px; 
			width:39px; 
			height:47px; 
			float:left; 
			}
		p.dateHome { 
			background:#f6f6f6; 
			display:block;
			margin-right:4px; 
			width:39px; 
			height:47px; 
			float:right; 
			}			
		span.day { 
			display:block; 
			border-bottom:1px solid #DEE8F2; 
			font-size:20px; color:#0073AA;
			line-height:30px; 
			text-align:center; 
			}
		span.month { 
			display:block; 
			letter-spacing:1px; 
			font-weight:bold; 
			text-align:center; 
			color:#F18F00; 
			}
		p.calendarLink{
			padding-bottom:15px;
			}		
		h2.calendarTitle{
			margin-bottom: 4px;
			}
		h4.calendarTitle{
			font-weight:bold;
			text-decoration:none;
			}
		h4.calendarTitle a{
			text-decoration:none;
			}			
		img.calendarImage{
			float:right;
			margin-left:5px;
			}	
	#voetlicht {
		min-height: 100px;
		margin-top: 192px;
		/*margin-top: 130px;*/
		clear: both;
		background: url('/image/uitdeklas.png') no-repeat -23px -247px;
		}


/** FOOTER **/

#footer {
	height: 79px;
	background: #e4f2f7;
	overflow: hidden;
	}
#footer div {
	width: 970px;
	margin: 0px auto;
	}
#footer p {
	padding-left: 25px;
	float: left;
	width: 720px;
	}
#footer p.copy {
	padding-top: 44px;
	}
#footer #footlogo {
	width: 200px;
	}
#footer img {

	}


/** CLASSES **/

.clear {
	clear: both;
	height: 1px;
	}

.itemlist {
	margin: 0;
	padding: 0;
	list-style: none;
	background: url('/image/dot-hori.gif') repeat-x left top;
	}
.itemlist li {
	background: url('/image/dot-hori.gif') repeat-x left bottom;
	padding-bottom:2px;
	padding-top:2px;
	}

.itemlist li img {
	clear:both;
	margin-top:6px;
}
.itemlist li a {
	padding-bottom: 1px;
	padding-left: 20px;
	text-decoration: none;
	background: url('/image/arrow.gif') no-repeat left center;
	}

.readmore {
	text-align: right;
	margin-top: 1em;
	}
.readmore a,
.readmore a span {
	color: #ffffff;
	font-size: 90%;
	text-decoration: none;
	background: url('/image/readmore-left.gif') no-repeat center left;
	}
.readmore a {
	line-height: 22px;
	display: inline-block;
	/* padding: 5px 0px; */
	}
.readmore a span {
	padding: 5px 10px;
	line-height: 22px;
	background: transparent url('/image/readmore-right.gif') no-repeat center right;
	}

.formbutton {
	display: block;
	width: 90px;
	height: 22px;
	line-height: 22px;
	color: #ffffff;
	font-size: 90%;
	text-decoration: none;
	background: url('/image/formbutton.gif') no-repeat center left;
	}
.float {
	float:left;
	margin-right:10px;
	margin-bottom:5px;
}

.back {
	text-align: left !important;
}

#headerScroller {
	position: relative;
	height: 303px;
	background-color: white;
}

#headerScroller #headers {
	margin: 0;
}

#headerScroller #headers li {
	position: absolute;
	top: 0;
	left: 0;
	
	list-style: none;
}

#headerScroller #headers li img {
	height: 303px;	
}

#homeText {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 20;
	
	width: 300px;
	height: 283px;
	
	padding-left: 20px;
	padding-right: 636px;
	padding-top: 20px;
	
	background: url(/image/header-mask.png);
	background-repeat: no-repeat;
	
	color: #ffffff;
}

#photoAlbumsSidebar {
	list-style: none;
	margin: 0;
}

#photoAlbumsSidebar li {
	clear: both;
	display: block;
	height: 80px;
	width: 220px;
}

#photoAlbumsSidebar a {
	text-decoration: none;
}

#photoAlbumsSidebar img {
	float: left;
	margin-right: 4px;
}


#albumReadmore {
	clear: both;
	
}

