/*------------------------------------------------------------------
	[Master Stylesheet]
	
	Project:		Christelijk College Zeist
	Version:		1.0
	Assigned to:	Rudy de Jong
    Company:		WIS Services BV http://www.wis.nl/
	Primary use:	Web
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
	[Table of contents]
	
	0. Reset Styles
	1. Global Styles
	2. Wrapper
	3. Header
	4. Menu / breadcrumbs
	5. Content
	6. Footer
	7. Extra
	
-------------------------------------------------------------------*/


	/*------------------------------------------------------------------
		[1. Reset styles]
	*/
	
	body, button, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, textarea, p, blockquote, th, td, hr {
		padding: 0;   
		margin: 0;
	}
 
		html,
		body {
			height: 100%;
		}
  
			table {border-collapse: collapse; border-spacing: 0;}   
	  
			ul {list-style:none;}

	/*------------------------------------------------------------------
		[1. Global Styles]
	*/
	
	html, body {font: normal 12px/16px Arial,Tahoma,sans-serif;color: #4E4E4E;}
	h1 {color: #231f20; font-size: 22px; margin-bottom: 30px;}
	body {background: #f1f1f2 url(/images/bg.png) repeat-x top left;}
	h2 {line-height: 50px;}
	h3 { line-height: 30px;}
	p {margin-bottom: 10px;}
	a:link, a:visited, a:active{text-decoration: none; color: #e21776;}
	a:hover{text-decoration: underline;}
	
	/*------------------------------------------------------------------
		[2. Wrapper]
	*/
	
	div#wrapper{width: 956px; margin: 0 auto; overflow: hidden; min-height: 700px;}
	
		
	/*------------------------------------------------------------------
		[3. Header]
	*/
	
	div#header{height: 103px; padding-top: 17px;}
		div#header div.logo{float: left;}
		div#header div.searchBox{float: right; padding-top: 12px;}
			div#header div.searchBox input {background: url(/images/sprite.png) no-repeat 1px 1px; height: 32px; width: 217px; border:0; float: left; margin-right: 16px; line-height: 32px; padding-left: 5px;} 
			div#header div.searchBox button {background: url(/images/sprite.png) no-repeat -224px 0px; height: 32px; width: 61px; border: 0; float: left; cursor: pointer;}

   /*------------------------------------------------------------------
		[4. Menu / Breadcrumbs]
	*/
	
	div#main-menu {min-height: 30px; width: 956px; margin: 0 auto; margin-bottom: 30px; position: relative; z-index: 2;}
		div#main-menu ul.level1>li{line-height: 30px; text-align: center; position: relative; float: left; width: 236px; margin-right: 3px; background: url(/images/sprite.png) no-repeat 1px -33px; }
		div#main-menu ul.level1>li:first-child{background: url(/images/sprite.png) no-repeat 1px -64px;}	
		div#main-menu ul.level1>li:hover{background: url(/images/sprite.png) no-repeat -237px -33px;}
		div#main-menu ul.level1>li:hover:first-child{background: url(/images/sprite.png) no-repeat -237px -64px;}
		div#main-menu ul.level1>li.last{background:url(/images/sprite.png) no-repeat 1px -95px;}
		div#main-menu ul.level1>li.last:hover{background:url(/images/sprite.png) no-repeat -237px -95px;}
			div#main-menu ul.level1>li>a{color: #58595b; font-size: 13px; text-decoration: none; display: inline-block; width: 100%;}
			div#main-menu ul.level1>li:hover>a{color: #fff; font-weight: bold; text-decoration: none;}
		
		div#main-menu ul.level2{ position: absolute; z-index: 100; top: 30px; left: 0px; width: 100%; display: none; background: url(/images/transparent.png) repeat top left;}	
			div#main-menu ul.level2>li>img{display: block; margin: 0 auto;}
			div#main-menu ul.level2>li{background: url(/images/submenu-repeater.png) repeat-y top left;}
			div#main-menu ul.level2>li.last{background: url(/images/submenu-bottom.png) no-repeat top left; height: 4px; line-height: 4px; font-size: 1px;}
			div#main-menu ul.level2>li>a{color: #a6a8ab; font-size: 13px; text-decoration: none;} 
			div#main-menu ul.level2>li>a:hover{color: #e21776; font-weight: bold;}
			
		
	
	div#breadcrumbs {height: 30px; background-color: #000; position: absolute; top:150px; left:0; width: 100%; z-index: 0;}
		div#inner-breadcrumbs{width: 960px; margin: 0 auto;}
		div#breadcrumbs ul li{float: left;}
		div#breadcrumbs a{color: #a6a8ab; line-height: 30px; font-size: 11px; padding-left: 3px;}
		
	/*------------------------------------------------------------------
		[5. Content]
	*/
	div#container-home{
		margin-top: 30px;
	}
	
		
	
	
	/*------------------------------------------------------------------
		[6. Footer]
	*/	
	
	div#footer{margin-top: 8px; overflow: hidden; height: 30px;}
		div#footer ul{margin-top: 5px;}
			div#footer ul li {float: left; color: #6d6e70; font-size: 10px;}
				div#footer ul li a {color: #6d6e70;}
				
		div#footer span{float: right; font-size: 12px;}
			div#footer span a{color: #6d6e70;}
	
	/*------------------------------------------------------------------
		[7. Extra]
	*/				
/*------------------------------------------------------------------
	[Home Sjabloon Stylesheet]
	
	Project:		Christelijk College Zeist
	Version:		1.0
	Assigned to:	Rudy de Jong
    Company:		WIS Services BV http://www.wis.nl/
	Primary use:	Web
-------------------------------------------------------------------*/

	/*------------------------------------------------------------------
		[1. Sjabloon styles]
	*/
	div#content-home-container td{vertical-align: top;}
	div#content-home-container td.table-separator{width: 4px;}
	div#content-home-container td.content-home-col1{width: 316px; height: 232px; background-color: #e6e7e8; border: 1px solid #d0d2d3;}
	div#content-home-container td.content-home-col2{ width: 316px;}
		div#content-home-container td.content-home-col2_row1 { border: 1px solid #d0d2d3; height: 160px;}
		div#content-home-container td.content-home-col2_row2{vertical-align: bottom; padding-top: 10px;}
		
	
	/*------------------------------------------------------------------
		[2. Agenda styles]
	*/
	
	ul#agenda li.header{background-color: #000; border-left: 1px solid #000; border-right: 1px solid #000; margin: 0 -1px 6px -1px;}
		ul#agenda li.header a,
		ul#nieuws li.header a,
		ul#wat-ga-jij-doen li.header a{padding-left: 18px; color: #fff; font-weight: bold; line-height: 30px;}
	ul#agenda li.titel{width: 100%; line-height: 27px; color: #e21776; padding-left: 18px; float: left; background: url(/images/purple-bullet.gif) no-repeat 18px 50%; padding-left: 27px;}
		ul#agenda li.titel span{padding:0 3px; font-weight: bold;}
		ul#agenda li.titel span.datum{color: #000;}
	ul#agenda li.datum{line-height: 27px; float: left; color: #000;}
	
	/*------------------------------------------------------------------
		[3. Nieuws styles]
	*/
	
	ul#nieuws {margin-top: 9px; height: 130px; width: 314px;}
	ul#nieuws li.header{background-color: #e21776; border-left: 1px solid #e21776; border-right: 1px solid #e21776; border-top: 1px solid #D6D7D8; margin: 0 -2px 6px -1px;}
		ul#nieuws li.titel{line-height: 22px; color: #000; float: left; background: url(/images/black-bullet.gif) no-repeat 18px 50%; padding-left: 27px;}
		ul#nieuws li.korteomschrijving{line-height: 14px; padding-left: 18px; float: left; color: #000; font-size: 12px; width: 300px;}
		ul#nieuws li.leesmeer{padding-left: 18px; float: left; width: 100%;}
		ul#nieuws li.leesmeer a{color: #e21776; float: left;   margin-top: 7px;}

	/*------------------------------------------------------------------
		[4. Wat-ga-jij-doen styles]
	*/
	
	ul#wat-ga-jij-doen{}
	ul#wat-ga-jij-doen li.header{background-color: #e21776; border-left: 1px solid #e21776; border-right: 1px solid #e21776; margin: 0 -1px 6px -1px;}
	ul#wat-ga-jij-doen li.titel{line-height: 35px; color: #231f20; margin-left: 18px; font-size: 23px; float: left; border-bottom: 1px solid #f3f4f4;}
	ul#wat-ga-jij-doen li.leesmeer{line-height: 36px; float: left; border-bottom: 1px solid #f3f4f4;}
		ul#wat-ga-jij-doen li.titel span{padding:0 7px; font-weight: bold;}
	ul#wat-ga-jij-doen	li.leesmeer a{color: #e21776; line-height: 35px;}
	
	/*------------------------------------------------------------------
		[4. Banner styles]
	*/
	
	div#banner-container{position: relative; background-color: #f7f7f7; height: 408px; overflow: hidden;}
		div#banner-container img{width: 956px; height: 405px; overflow: hidden;}
		div#banner-container div.beeldmerk{position: absolute; top: 0; right: 0; width: 195px; height: 248px; background: url(/images/watermerk.png) no-repeat top left;}
		div#banner-container div.home-text-container{text-align: left; position: absolute; top:215px; right: 2px; z-index: 2; width: 301px; height: 168px;background: url(/images/banner-heading-bg.png) no-repeat top left; color: #fff; padding-left: 120px;}
			div#banner-container div.home-text-container h1 {font-weight: bold; font-size: 23px; line-height: 40px; margin-bottom: 0; color: #fff;}
			div#banner-container div.home-text-container div.home-text-bg{width: 318px; height: 128px; background: url(/images/home-text-bg.png) repeat top left; position: absolute; top:40px; right: 0;}
			div#banner-container div.home-text-container div.home-text{position: absolute; top: 0; right: 0; z-index: 2; width: 295px; padding-right: 5px; font-size: 13px;}