body {
margin: 0;
background-color:#FFF568; 
text-align: center;
}

#main_container{
margin: 0 auto;
width: 960px;
background-color:#FFF568;
}



/* Je moet rekening houden met een laptop dus max 960*/

/* start header */

#headersmall_container{
float:left;
width: 960px;
height:10px;
background:#FFF568;
text-align:center;
margin:5px 0px 5px 0px;
}

#headerbox_container{
float:left;
width:960px;
height:130px;
background-color:#FFF568;
text-align:left;
margin:0px 0px 0px 0px;
}

div#box1{
float: left;
height: 128px;
width: 183px;
background:#FFF568 url("img/kaasstad-logosmall.png") no-repeat top center;
text-align:center;
background-color: #FFF568;
margin:0px 0px 0px 0px;
}
div#box2{
float: left;
height: 128px;
width: 775px;
background:#FFF568 url("images/standtitelKS.jpg") no-repeat top center;
text-align:center;
background-color: #FCC568;
margin:0px 0px 0px 0px;
}

div#textfotos{
float: left;
height: 125px;
width: 750px;
background-color: #FFF568;
text-align:center;
margin:0px 0px 0px 0px;
}

#headerlinks_container{
float:left;
width: 960px;
height:160px;
background-color:#FFF568;
text-align:left;
margin:0px 0px 0px 0px;
}

 a#linkhome{
  float:left;
  margin:10px 10px 10px 20px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKShome.jpg') no-repeat top center;
}
a#linkhome:hover {
  background: url('images/buttonKSshadehome.jpg') no-repeat top center;
}  



/* horizontale links, dezelfe kleur*/

#nav, #nav ul, #nav ul ul{
list-style: none;
padding: 10px 0 0 0;
margin:125px 0px 0px 0px;
list-style: none;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 17px;
font-weight: bold;
}
/* als je verander gebeurd er ... dit is inline hoe breder, passen ze naast elkaar 3 x 180 + 10 ertussen bdzis 600*/
#nav{
width:850px;
}
/* width bij verandering geen verschil , margin, staan ze verder uit elkaar*/
#nav li{
width:180px;
display: inline;
margin: 0 5px 0 0;
}

#nav a{
display: inline;
text-decoration: none;
padding: 3px 3px 3px 3px;
margin: 0px;
height: 30px;
width: 180px;
}

/* width bij elke verandering geen verschil bij elk item*/
#nav a:link, #nav a:visited{
background: #FFFF99;
color: #9E0B0E;
text-align:left;
padding: 5px 3px 5px 5px;
border: 1px solid #00FF00;
height: 30px;
width:180px;
}

#nav a:hover, #nava:active{
background-color: #FFF200;
color: #FFFFFF;
text-decoration: none;
text-align:left;
padding: 5px 3px 5px 5px;
border: 1px solid #00FF00;
width:180px;
height: 30px;
} 



/* groene kleur is #00FF00, gele lichte kleur is #FFF568 en FFFF99 ,#FFD700 is donker geeltekst kleur roest bruis #9E0B0E */

H1 {
 color: #9E0B0E; background: ;
 font-size: 32px; 
 font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
 font-weight: bold;
 }
.paragraaftitel                   { color: #9E0B0E;}
.speciaal                               { color: #556B2F; }

H2 {
 color: #9E0B0E; background: ;
 font-size: 28px; 
 font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
 font-weight:bold;
 }
.paragraaftitel                   { color: #9E0B0E;}
.speciaal                               { color: #556B2F; }
.paragraaftitel.speciaal { color: #FF0000; background: #FFFFFF; }


H3 {
 color: #660066; background: ;
 font-size: 24px; 
 font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
 font-weight: bold;
 }
.paragraaftitel                   { color: #9E0B0E;}
.speciaal                               { color: #556B2F; }
.paragraaftitel.speciaal { color: #FF0000; background: #FFFFFF; }


H4 {
 color: #9E0B0E; background: ;
 font-size: 20px; 
 font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
 font-weight: bold;
 }
.paragraaftitel                   { color: #9E0B0E;}
.speciaal                               { color: #556B2F; }
.paragraaftitel.speciaal { color: #FF0000; background: #FFFFFF; }

/* ruimte er boven ,stond op 30 ,10 is beter */

        table {
          margin-top: 10px;
        }
   

        table  { border-collapse: collapse; border: 1px solid #00FF00;
          margin-left: auto; margin-right: auto; }

     
        table h3 {
          margin:2px 0 7px 0;
          padding:0;
          color: #660066;
        }
        
        table p {
          margin:10px 0 0 0;
          padding:0;
        }
/* als je foto kleiner maakt maar table niet, weinig nut.. */
       p#fotow{
          width:620px;
          float:left;
          margin:10px 0 0 0;
        }
        
               p#foto2011{
          width:800px;
          float:left;
          margin:10px 0 0 0;
        }
 /* wa ik kleine foto er naast margin .. */       
        
		 p#fotowa {
          width:300px;
          float:left;
          margin:100px 0 0 0;
        }
        p#tekst{
          width:300px;
          float:left;
          margin:10px 0 0 0;
        }
        p#foto {
          width:300px;
          float:left;
          margin:10px 0 0 0;
        }
        


        td { border: 1px solid #FFF568;
          width: 50px; }

        td {
          padding: 6px;
          vertical-align: top;
          width:303px;
        }
        
        tr {
          background-color:#fff;
        }
        
        tr.alt {
          color:#000;
          background-color:#FFF568;
          
          }
  

 #contentlinken{
  padding: 0;
  margin: 0;
  width: 960px;
  height:800px;
  background-color:#FFF568;
  float:left;
text-align:center;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color:#9E0B0E;
}


 #linkenboxsupertop{
  float: left;
  width: 960px;
  height: 300px;
  background-color:#FFF568;
}


 #linkenboxVT{
  float: left;
  width: 960px;
  height: 300px;
  background-color:#FFF568;
}




/* tijdelijk dubbel zo hoog, omdat tekst van het jaar erbij staat.. */

 #linkenboxsub1top{
  float: left;
  width: 960px;
  height: 150px;
  background-color:#FFF568;
}

 #linkenboxsubtop{
  float: left;
  width: 960px;
  height: 150px;
  background-color:#FFF568;
}
   
   
a#link2019{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2019.jpg') no-repeat top center;
}
a#link2019:hover {
  background: url('images/buttonKSshade2019.jpg') no-repeat top center;
}


a#link2020{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2020.jpg') no-repeat top center;
}
a#link2020:hover {
  background: url('images/buttonKSshade2020.jpg') no-repeat top center;
}




a#link2021{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2021.jpg') no-repeat top center;
}
a#link2021:hover {
  background: url('images/buttonKSshade2021.jpg') no-repeat top center;
}

a#link2022{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2022.jpg') no-repeat top center;
}
a#link2022:hover {
  background: url('images/buttonKSshade2022.jpg') no-repeat top center;
}

a#link2023{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2023.jpg') no-repeat top center;
}
a#link2023:hover {
  background: url('images/buttonKSShade2023.jpg') no-repeat top center;
}


a#link2024{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2024.jpg') no-repeat top center;
}
a#link2024:hover {
  background: url('images/buttonKSShade2024.jpg') no-repeat top center;
}


a#link2025{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2025.jpg') no-repeat top center;
}
a#link2025:hover {
  background: url('images/buttonKSShade2025.jpg') no-repeat top center;
}

a#linkV2025{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonVKS2025.jpg') no-repeat top center;
}
a#linkV2025:hover {
  background: url('images/buttonVKSShade2025.jpg') no-repeat top center;
}

 



 #linkenboxtop{
  float: left;
  width: 960px;
  height: 150px;
  background-color:#FFF568;
}

 
 #linkenstep{
  float: left;
  width: 960px;
  height: 350px;
  background-color:#FFF568;
}  


a#link2010{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2010.jpg') no-repeat top center;
}
a#link2010:hover {
  background: url('images/buttonKSshade2010.jpg') no-repeat top center;
}




a#link2011{
  float: left;
  margin:13px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2011.jpg') no-repeat top center;
}
a#link2011:hover {
  background: url('images/buttonKSshade2011.jpg') no-repeat top center;
}


a#link2012{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2012.jpg') no-repeat top center;
}
a#link2012:hover {
  background: url('images/buttonKSshade2012.jpg') no-repeat top center;
}

  #linkenboxmid{
    float: left;
  width: 960px;
  height: 140px;
  background-color:#FFF568;
}

a#link2013{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2013.jpg') no-repeat top center;
}
a#link2013:hover {
  background: url('images/buttonKSshade2013.jpg') no-repeat top center;
}

a#link2014{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2014.jpg') no-repeat top center;
}
a#link2014:hover {
  background: url('images/buttonKSshade2014.jpg') no-repeat top center;
}



a#link2015{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2015.jpg') no-repeat top center;
}
a#link2015:hover {
  background: url('images/buttonKSshade2015.jpg') no-repeat top center;
}


 #linkenboxbottom{
   float: left;
  width: 960px;
  height: 140px;
  background-color:#FFF568;
}

a#link2016{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2016.jpg') no-repeat top center;
}
a#link2016:hover {
  background: url('images/buttonKSshade2016.jpg') no-repeat top center;
}


a#link2017{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2017.jpg') no-repeat top center;
}
a#link2017:hover {
  background: url('images/buttonKSshade2017.jpg') no-repeat top center;
}


a#link2018{
  float: left;
  margin:10px 10px 10px 40px; 
  width: 250px;
  height: 135px;
  background: #FFF568 url('images/buttonKS2018.jpg') no-repeat top center;
}
a#link2018:hover {
  background: url('images/buttonKSshade2018.jpg') no-repeat top center;
}



 
#footer_container{
clear: both;
height: 50px;
background: #FFF568;
text-align: center;
color: #FFF;
}