
/*------------------------------------------------------------------
	[Master Stylesheet]
	
	Project:		Teylingen College (Redesign)
	Version:		1.0
	Last change:	28/10/09
	Assigned to:	Rudy de Jong (wis)
	Primary use:	Web
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
	[Color codes]
	
	
    
*/

/*------------------------------------------------------------------
	[Typography]

	
	
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
	[Table of contents]
	
	1. Body
	2. Wrapper
	
	
-------------------------------------------------------------------*/

	/*----------------------------------------------------------------
		[1. Body]
	-----------------------------------------------------------------*/
	
		body {
			background-color: #d9dadc;
            font: normal 11px/15px Arial,Verdana,sans-serif;
        }
		
		td, div, span {
			font: normal 11px/15px Arial,Verdana,sans-serif;
			vertical-align: top;
		}
		
		h1 {
			color: #4e5651;
            font-weight: bold;
            line-height: 30px;
            font-size: 17px;
		}
		
		h2 {
			color: #f08b1d;
            font-weight: bold;
            font-size: 13px;
            line-height: 20px;
        }
        
        h3 {
			font-size: 14px;
			line-height: 25px;
		} 
		
    
    /*------------------------------------------------------------------
		[2. Wrapper]
	*/
		
        #wrapper {
        	width: 1000px;
            margin: 0 auto;
            background-color: #fff;
        }
    	
	
	/*------------------------------------------------------------------
		[3. Header]
	*/
	
    	#header {
        	height: 126px;
			position: relative;
			z-index: 3;
        }
        
        	#header .left {
            	float: left;
                width: 600px;
            }
        
                #header .left .logo {
                    float: left;
                    margin-top: 5px;
                    margin-left: 12px;
                    display: inline;
                }
                
                #header .left .slogan {
                    float: left;
                    font: italic 20px/30px Arial,Verdana,sans-serif;
                    margin-top: 89px;
                    margin-left: 21px;
                    color: #880038;
                }
            
            
            
            #header .right {
        		float: left;
                width: 400px;
            }
            	
                #header .right .topmenu {
                	
					position: absolute;
					right: 101px;
					top: 10px;
                    margin-bottom: 10px;
                }
                
                    #header .right .topmenu span {
                        float: left;
                    }
                
                     .separator {
                        color: #525753;
                        margin: 0 10px;
                     }
                     
                     #header .right .topmenu span a {
                        color: #525753;
                     }	
    			
                #header .right .search_box {
                	float: right;
                    width: 195px;
					margin-top: 35px;
                    margin-bottom: 9px;
                }
                
                	#header .right .search_box .input {
                    	border: 0;
                        width: 165px;
                        height: 19px;
                        padding-left: 7px;
                        padding-top: 6px;
                        color: #525753;
                        font-style: italic;
                        font-size: 11px;
                         float: left;
                        background: url(/images/inputbg.gif) no-repeat top left;
                    }
                    
                    #header .right .search_box .button {
                    	float: left;
                        margin-top: 5px;
                        margin-left: 3px;
                    }
        		
                #header .right .locatie_selector {
                	float: right;
                    width: 195px;
                    padding-left: 55px;
                    position: relative;
					z-index: 2;
                }
                
                	#header .right .locatie_selector span {
                    	background: url(/images/inputbg.gif) no-repeat top left;
                        width: 171px;
                        text-align: center;
                        padding-top: 5px;
                        height: 20px;
                        display: block;
                        color: #525753;
                        cursor: pointer;
                    }
                    
                #header .right .locatie_selector #locaties {
                	position: absolute;
					z-index: 1;
                    top: 24px;
                    left: 67px;
                    background-color: #fff;
					
						background: url(/images/locatie_bg.png) no-repeat bottom left;
					
                }    
                
                    #header .right .locatie_selector #locaties ul {
                        list-style-type: none;
                        border-top: 0;
                        width: 127px;
                        padding-left: 20px;
                        padding-right: 20px;
                        height: auto;
                    }
                    
                    	#header .right .locatie_selector #locaties ul li a {
                        	color: #525753;
                        }
        		
                #header .right .portals {
                	height: 22px;
                    position: absolute;
					bottom: 0;
					right: 0;
                    background-color: #d9dadc;
                    margin-top: 10px;
                }
                
                	#header .right .portals span a {
                    	color: #525753;
                        font-size: 12px;
						padding: 0 10px;
                        margin-top: 3px;
                        display: inline-block;
                    }
                    
                    #header .right .portals span a.last {
                    	margin-right: 0;
                    }
                    
			                  
	/*------------------------------------------------------------------
		[4. Content]
	*/
    
    	#center_container {
        	min-height: 600px;
            height: auto !important;
            height: 600px;
            position: relative;
            padding-left: 12px;
            width: 988px;
			overflow: hidden;
        }
        
        #welkom_tekst {
        	height: 25px;
            background-color: #a51d28;
			color: #fff;
            padding-left: 37px;
            position: absolute;
            top: 42px;
            width: 963px;
            left: 0px;
            z-index: 1;
        }
        
        	#welkom_tekst a{
                color: #fff;
                font: normal 18px Arial,Verdana,sans-serif;
            }
        
        #center_container .duinzigt {
        	position: absolute;
            top: 270px;
            left: 0px;
            width: 290px;
            height: 173px;
            background: url(/images/background_locatie_red2.gif) no-repeat top left;
        }
        
        #center_container .kts {
        	position: absolute;
            top: 270px;
            right: 0px;
            width: 289px;
            height: 174px;
            background: url(/images/background_locatie_orange2.gif) no-repeat top left;
        }
        
        #center_container .leeuwenhorst {
        	position: absolute;
            top: 338px;
            left: 334px;
            width: 289px;
            height: 173px;
            background: url(/images/background_locatie_green2.gif) no-repeat top left;
        }
        
        	#center_container .duinzigt,
            #center_container .kts,
        	#center_container .leeuwenhorst {
            	padding: 11px 20px 0 24px;
            }
        
        	#center_container .duinzigt table tr.tr0 td.td0 a ,
            #center_container .kts table tr.tr0 td.td0 a,
        	#center_container .leeuwenhorst table tr.tr0 td.td0 a{
            	color: #fff;
               
                font: bold 20px/30px Arial,Verdana,sans-serif;
            }
            
            #center_container .duinzigt table tr.tr1 td.td0,
            #center_container .kts table tr.tr1 td.td0,
        	#center_container .leeuwenhorst table tr.tr1 td.td0,
            #center_container .duinzigt table tr.tr1 td.td0 a,
            #center_container .kts table tr.tr1 td.td0 a,
        	#center_container .leeuwenhorst table tr.tr1 td.td0 a {
            	color: #fff;
                font: bold 13px/21px Arial,Verdana,sans-serif;
                padding-top: 0px;  
			}
            
        
    
    /*------------------------------------------------------------------
		[5. Locatie Navigatio]
	*/
    
    	 #topnav {
            width: 507px;
            height: 27px;
            position: absolute;
            top: 42px;
            right: 0;
            z-index: 2;
            background-color: #faf1ed;
        }  

        
        #topnav ul {
        	list-style-type: none;
            padding-left: 20px;
            padding-top: 5px; 
        }
        
        	#topnav ul li {
            	float: left;
            }
            
            	#topnav ul li a {
                	color: #525753;
                }
    
		 #breadcrumbs {
         	position: absolute;
            top: 15px;
            left: 38px;
            height: 20px;
            z-index: 2; 
         }     
         
         	#breadcrumbs ul {
            	list-style-type: none;
            } 
            
				#breadcrumbs ul li {
                	float: left;
                }
                
                	#breadcrumbs ul li a {
                    	color: #525753;
                    }
                    
            #breadcrumbs span {
            	font-size: 10px;
                padding-right: 5px;
            }        
                	
	/*------------------------------------------------------------------
		[6. Menu]
	*/
    
    
    	#menu {
        	width: 243px;
            min-height:195px;
			height: auto !important;
			height: 195px;
            background: url(/images/menu_bg.png) no-repeat top left;
           
            top: 5px;
            left: 12px;
            padding-top: 70px;
            position: absolute;
		}
        
        #menu #level2 {
        	
            width: 243px;
            position: absolute;
            z-index: 0;
            top: 75px;
            left: 0;
        }
        
        	#menu #level2 div.nonactive {
            	height: 30px;
                padding-left: 25px;
				
            }
			
			#menu #level2 div.nonactive:hover {
				background: url(/images/level1_bg.gif) no-repeat top left;
			}
			
			#menu #level2 div.nonactive a:hover {
				color: #fff;
				font-weight: bold;
			}
            
            	#menu #level2 div.active {
                	background: url(/images/level1_bg.gif) no-repeat top left;
                    padding-left: 23px;
                    height: 24px;
                    width: 220px;
                    padding-top: 6px;
                }
                
                	#menu #level2 div.active a {
                    	font-weight: bold;
                        color: #fff;
                        display: block;
                        font-size: 14px;
                        text-decoration: none;
                    }
            
            	#menu #level2 div.nonactive a {
                	color: #525753;
                    font-size: 14px;
                    display: block;
                    width: 217px;
                    line-height: 30px;
                    text-decoration: none;
                }
             
        
        	#menu .level3 {
            	width: 238px;
                position: absolute;
                top: -12px;
                left: 243px;
                z-index: 1;
                display: none;
            }
            
            	#menu .level3 div {
                	height: 28px;
                    background: url(/images/submenu_bg.png) no-repeat top left;
                }
            	
	            #menu .level3 a {
                	color: #fff;
                    font-size: 13px;
                    display: block;
                    height: 30px;
                    text-decoration: none;
                    padding-top: 5px;
                    padding-left: 10px;
                }
                
                	#menu .level3 a:hover {
                    	background-color: #fff;
                        color: #ee8c00;
                        width: 228px;
					}
                    
                  
                    
    /*------------------------------------------------------------------
		[7. Footer]
	*/
	
    	#footer {
        	height: 25px;
            text-align: center;
			padding-top: 10px;
        }
        	
           #footer ul {
           		list-style-type: none;   
                text-align: center;	
                margin: 0 auto;
                height: 100%;
                display: inline-block;
           }
           
           	#footer ul li {
            	float: left;
                height: 11px;
                padding-top: 9px;
            }
            
            	#footer a {
                	color: #525753;
					vertical-align: middle;
                }
				
				#footer span {
					vertical-align: middle;
				}
	
    /*------------------------------------------------------------------
		[8. Extra]
	*/      
    
    	a:link,
        a:visited,
        a:active {
        	text-decoration: none;
			color: #4e5651;
			outline: none;
        }
        
        a:hover {
        	text-decoration: underline;
			color: #4e5651;
			outline: none;
        }
    
    
    
   
    #content {
        width: 100%;
        height: 100%;
    }
   
    #left {
    	width: 243px;
        float: left;
        padding-top: 248px;
        margin-top: -3px;
    }
    
    		ul#agenda {
            	list-style-type: none;
            }	
            
            	ul#agenda li {
                	padding-left: 10px;
                    overflow: hidden;
					color: #fff;
					font-style: italic;
                }
			
				#center_sub ul#agenda li {
					color: #000;
				}
				
				ul#agenda li.titelsub {
					margin-bottom: 5px;
				} 
                
				
				ul#agenda li.titel {
					margin-bottom: 5px;
				}
                	#center_sub ul#agenda li a {
                    	color: #525753;
                        width: auto;
                    }
                    
                	ul#agenda li a:link,
					ul#agenda li a:visited,
					ul#agenda li a:active {
                    	color: #fff;
                        
                        line-height: 15px;
                        display: inline-block;
                        width: 170px;
						padding-bottom: 6px;
						font-style: normal;
                    }
					
					ul#agenda li a:hover {
						text-decoration: underline;
					}
                    
                    
                    ul#agenda li a.overzicht {
                    	font-size: 13px;
                        display: block;
                        text-align: right;
                        margin-top: 15px;
                        font-style: italic;
                    }
            
            	ul#agenda li.kop {
                	color: #fff;
                    font-size: 14px;
                    font-weight: bold;
                    margin-bottom: 20px;
                    margin-left: 0;
                    width: 100%;
                    height: auto;
					font-style: normal;
                }
                
                #center_sub ul#agenda span {
                	color: #525753;
                }
                
                 ul#agenda span {
                	float: left;
                    color: #fff;
                    margin-right: 5px;
                }
                
           ul.archief li {
           		color: #525753;
           }  
           
           		ul.archief li a.link {
           			color: #525753;
           		}   
                
        #left .left_middle {
        	height: 133px;
            background: url(/images/highlight_1_bg.gif) no-repeat top left;
            margin-bottom: 13px;
            padding: 20px 25px;
            overflow: hidden
        }
        
        
        #left .left_bottom {
        	height: 87px;
            background: url(/images/highlight_2_bg.gif) no-repeat top left;
            padding: 20px 19px;
            overflow: hidden;
        }
    
    
    #center_home {
    	float: left;
        
        	width: 745px;
        
        
    }
    
    #center_sub {
    	float: left;
        
        	width: 705px;
        
    	
        min-height: 300px;
        height: auto !important;
        height: 300px;
        padding: 80px 20px 30px 20px;
        background-color: #fff;
    }
    
    	#center_sub p {
        	margin-bottom: 20px;
        }
		
		#center_sub ul{
			margin-left: 20px;
		}
		
		#center_sub ol{
			margin-left: 20px;
		}
    
    #right {
    	margin-top: 66px;
    	width: 507px;
        float: right;
        min-height: 500px;
        background-color: #fff;
    }
    
    	#right .right_top {
        	height: 109px;
        }
        
        	#right .right_top ul {
            	list-style-type: none;
                background-color: #a4c400;
                overflow: hidden;
                height: 100%;
            }
            
            	#right .right_top ul li {
                    padding: 15px 80px 15px 23px;
                    width: 240px;
                    float: left;
                    vertical-align: top;
                    color: #fff;
                    font-size: 18px;
                    line-height: 22px;
                }
                
                	#right .right_top ul li a {
                    	color: #fff;
                    }
                
                #right .right_top ul li.afbeelding {
                	padding: 0;
                    height: 109px;
                    
					width: 160px;
                }
 		
        #right .right_middle {
        	padding: 20px;
        }
        
        #right .right_bottom {
        	padding: 20px;
        }
        
        ul#nieuws {
        	list-style-type: none;
            margin-bottom: 30px;
            overflow: hidden;
        }
        
       ul#nieuwstitel {
        	margin-bottom: 0;
            list-style-type: none;
        }
        
        	ul#nieuws li {
            	float: left;
                width: 300px;
            }
        
        	ul#nieuwstitel li.kop {
            	color: #4e5651;
                font-size: 14px;
                font-weight: bold;
                margin-bottom: 10px;
                float: none;
            }
            
            ul#nieuws li.titel {
            	color: #f08b1d;
                font-weight: bold;
                font-size: 14px;
            }
            
            ul#nieuws li.datum {
            	color: #880038;
                margin: 3px 0px;
            }
            
             ul#nieuws li.afbeelding {
             	width: 145px;
                height: 104px;
                overflow: hidden;
                margin-right: 10px;
             }
             
             ul#nieuws li.korteomschrijving {
             	line-height: 18px;
             }
             
             ul#nieuws li.langeomschrijving {
             	margin-top: 20px;
                clear: left;
                width: 100%;
             }
             
             	ul#nieuws li a {
                	font-style: italic;
                    color: #4e5651;
                    text-decoration: underline;
                }
                
                	ul#nieuws li.archief {
                    	display: block;
                        width: 100%;
                        text-align: right;
                        margin-top: 10px;
                    }
     #spacer {
     	height: 45px;
        float: left;
     }   	
     .sitemap_level_1 {
        
        font-family:verdana;
        font-size:14px;
        font-weight:bold;
        cursor:pointer;
        padding:2px;
        padding-left:6px;
    }
    .sitemap_level_2 {
       
        font-family:verdana;
        font-size:12px;
        padding:2px;
        padding-left:14px;
        cursor:pointer;
    }
    .sitemap_level_3 {
      
        font-family:verdana;
        font-size:11px;
        padding:1px;
        padding-left:26px;
        cursor:pointer;
    }
    .sitemap_level_4 {
      
        font-family:verdana;
        font-size:10px;
        padding:1px;
        padding-left:56px;
        cursor:pointer;
    }
    .sitemap_level_5 {
       
        font-family:verdana;
        font-size:10px;
        padding:1px;
        padding-left:106px;
        cursor:pointer;
    }

