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

#main_container{
margin: 0 auto;
width: 960px;
background-color:#FFF568;
}
#mainlaptop_container{
margin: 0 auto;
width: 750px;
background-color:#CC0000;
}
#boxlaptop{
border:1px solid #00FF00;
background-color:#F34343;
height:800px;
width:748px;
float:left;
margin:0px 0px 0px 0px;
}

/* 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:#FF568;
text-align:left;
margin:0px 0px 0px 0px;
}

div#box1{
float: left;
height: 125px;
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#textfotos{
float: left;
height: 125px;
width: 750px;
background-color: #FFF568;
text-align:center;
margin:0px 0px 0px 0px;
}


#headerlinks_container{
clear:both;
width: 960px;
height:40px;
background-color:#FFF568;
text-align:left;
margin:0px 0px 0px 0px;
}


#headerlinks_container2{
clear:both;
width: 960px;
height:40px;
background-color:#FFF568;
text-align:left;
margin:0px 0px 0px 0px;
}

#headerlaptop-fotos_container{
width: 750px;
height: 130px;
background-color:#FFF568;
text-align:center;
margin:5px 0px 5px 0px;
border: 0px solid #00FF00;
}


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




/* fotos 1 pix rand eraf*/

#content-fotos2010_container{
background-color:#FFF568;
height:3230px;
width:958px;
float:left;
border:1px solid #00FF00;
}

#content-fotos2011_container{
background-color:#FFF568;
height:800px;
width:958px;
float:left;
border:1px solid #00FF00;
}

#content-fotos2012_container{
background-color:#FFF568;
height:1400px;
width:958px;
float:left;
border:1px solid #00FF00;
}

#content-fotos2013_container{
background-color:#FFF568;
height:1450px;
width:958px;
float:left;
border:1px solid #00FF00;
margin:10px 0px 0px 0px;
}



#fotocontainer {
 background-color:#FFF568;
 height:1400px;
 width:958px;
 float:left;
 border:1px solid #00FF00;
 margin:10px 0px 0px 0px;
}


ul {list-style:none;}

#featured, #feat-nav {width:100%; float:left;cursor:pointer;}
#featured img {margin-left:50px;}
#feat-nav {margin-top:7px;}

#feat-nav li, #feat-nav button, #feat-nav img {
  border:0  !important;
  outline:0 !important;
  margin:0  !important; 
  padding:0 !important;
  width:177px;
}

#feat-nav ul{list-style:none;}
#feat-nav li {float:left;}
#feat-nav button:hover {background:#FF9900;}
#feat-nav button.active {background:#660066}

/* boven in ook juiste java styling zijn puntjes wil je niet*/


#contentnbb_container{
background-color:#FFF568;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color:#9E0B0E;
width: 880px;
height: 150px; 
margin:20px 0px 0px 2px;
}


/* horizontale links, dezelfe kleur*/

#nav, #nav ul, #nav ul ul{
list-style: none;
padding: 10px 0 0 0;
margin:10px 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;
}
/* 125px stond bij marging... nu  10 , zo 2e laag ermooi onder 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;
          
          }
          
          
#footer_container{
clear: both;
height: 50px;
background: #FFF568;
text-align: center;
color: #FFF;
}


div#boxkrant2013{
float: left;
height:1270px;
width:960px;
background: #FFF568 url("img/KS2013krant.jpg") no-repeat top center;
background-color:#FFFF99;
text-align:center;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
color:#9E0B0E;
margin:0px 0px 0px 0px;
}

div#boxkrant2014{
float: left;
height:1270px;
width:960px;
background: #FFF568 url("img/KS2014krant.jpg") no-repeat top center;
background-color:#FFFF99;
text-align:center;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
color:#9E0B0E;
margin:0px 0px 0px 0px;
}

div#boxkrant2015{
float: left;
height:578px;
width:1200px;
background: #FFF568 url("img/KS2015krant.jpg") no-repeat top center;
background-color:#FFFF99;
text-align:center;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
color:#9E0B0E;
margin:0px 0px 0px 0px;
}

div#boxkrant2015-2{
float: left;
height:1446px;
width:1500px;
background: #FFF568 url("img/KS2015krant2.jpg") no-repeat top center;
background-color:#FFFF99;
text-align:center;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
color:#9E0B0E;
margin:0px 0px 0px 0px;
}



#linkboximp{
background-color:#FFF568;
height:60px;
width:192px;
float:left;
margin:5px 0px 5px 0px;
}

.impbutton{
clear:both;
width: 192px;
height: 54px; 
border-width: 0px;
background:url("") no-repeat center;
}

a#linkimp{
  float: left;
  margin:5px 0px 0px 0px;  
  width: 192px;
  height: 54px;
  background: url('img/impi.jpg') no-repeat top center;
}

a#linkimp:hover {
  background: url('img/impshade.jpg') no-repeat top center;
}





div#spel23{
float: left;
height:1290px;
width:960px;
background: #FFF568 url("img/2014IMPspel23.jpg") no-repeat top center;
background-color:#FFF568;
text-align:center;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
color:#9E0B0E;
margin:0px 0px 0px 0px;
}

div#spel10{
float: left;
height:1945px;
width:960px;
background: #FFF568 url("img/2014IMPspel10.jpg") no-repeat top center;
background-color:#FFFF99;
text-align:center;
font-family:comic sans ms, arial, times new roman ,Trebuchet MS, verdana, helvetica, sans-serif;
font-size: 24px;
font-weight: bold;
color:#9E0B0E;
margin:0px 0px 0px 0px;
}