﻿/*******************************/
/* Algemene stijlkenmerken     */
/* via tags en classen         */
/*******************************/

html{height: 100%;}

body
{ font-family: verdana,arial, sans-serif;
  padding: 0px;
  margin: 0px;
  font-size: .78em; /*:small;*/ 
  background: #90A1B9 url(pattern.png) repeat;
  color: #555;
}

/* unordered list in menu */
ul
{ margin: 2px 0px 18px 16px;
  padding: 0px;
}

ul li
{ list-style-type: square;
  margin: 0px 0px 6px 0px; 
  padding: 0px;
}

/* ordered list */
ol
{ margin: 8px 0px 0px 24px;
  padding: 0px;
}

ol li
{ margin: 0px 0px 11px 0px; 
  padding: 0px;
}  

/*******************************/
/* Struktuur stijlkenmerken    */
/*******************************/

/* margin lefts / margin rights - to centre content */
#main, #footer, #logo, #menubar, #site_content
{ margin-left: auto; 
  margin-right: auto;
}

/* main container */
#main
{ width: 966px;
  background: #FFF url(main.png) repeat-y;
  color: #555;
}

/* logo */
#logo
{ width: 950px;
  height: 90px;
  border-top: 1px solid #F2F2F0;
  background: #444 url(header.png) no-repeat left center;
  color: #FFF;
}

/* navigation menu */
#menubar
{ background: #90A1B9 url("menu.png") repeat;
  width: 950px;
  height: 50px;
} 

ul#menu{margin: 0px;}

ul#menu li
{ float: left; 
  margin: 0px 0px 0px 0px; 
  padding: 0px;
  list-style: none;
} 

ul#menu li a 
{ font-family: verdana, arial, sans-serif;
  display: block; 
  float: left; 
  height: 34px;
  text-decoration: none; 
  padding: 16px 15px 0px 15px;
  text-align: center;
  border-right: 1px solid #F2F2F0;
  background: transparent;
  color: #FFF;
} 

ul#menu li a:hover, ul#menu li a.current, ul#menu li a.current:hover
{ background: #55555D url("menu_sel.png") repeat;} 

/* main content */
#site_content
{ width: 950px;
  overflow: hidden;
} 

/***********************************/
/* Rondingen menu links en inhoud  */
/***********************************/
		
.rtop, .rbottom{display: block; background: #90A1B9; }  
/* Kleur van de rondekesuitsnijding = die van vak er omheen */
.rtop .r1, .rtop .r2, .rtop .r3, .rtop .r4,
.rbottom .r1, .rbottom .r2, .rbottom .r3, .rbottom .r4
{ display: block;
  height: 1px;
  overflow: hidden; 
  background: #FFFEFB;  /*Kleur van de latjes boven en onder = die van de sidebar zelf */
}

.r1{margin: 0 5px;}
.r2{margin: 0 3px;}
.r3{margin: 0 2px;}

.rtop .r4, .rbottom .r4
{ margin: 0 1px;
  height: 2px;
}

/*******************************/
/* De eigenlijke inhoud        */
/*******************************/

/* page content */
#content_container
{ text-align: left;
  width: 930px;
  float: left;
  padding: 15px 0px 15px 0px;
  margin-left: 8px ;
}

#content
{ text-align: left;
  float: left;
  width: 900px;
  /* min-height : 472px; */
  padding: 8px 15px 8px 15px;
  background: #FFFEFB;  /* Kleur van de ronde vakken van de inhoud*/
}

/* footer */
#footer
{ width: 910px;
  height: 32px;
  padding: 16px 21px 0px 19px;
  text-align: center; 
  border-top: 2px solid #F2F2F0;
  background: #6D6A78 url("menu.png") repeat;
  color: #333;
  font: 12px Verdana, Arial, sans-serif;
}

#footer a
{ background: transparent;
  color: #FFF;
}

#footer a:hover
{ background: transparent;
  color: #333;
}

/*******************************/
/* Opmaak van 3 colommen       */
/*******************************/

#tripplebox 
{ margin-top: 10px;
  width: 880px;
  padding: 10px 8px 10px 8px;
}

#tripplebox .colom
{
  width: 270px;
  float: left;
  min-height: 500px;
  padding: 0px 8px 0px 8px;
}

#topic
{ text-align: left;
  float: left;
  width: 270px;
  padding: 10px 10px 10px 10px;
  margin: 0px 1px 0px 1px;
  /* background: #FFFFFF;  Voor testing*/
}

#topic .hoofding
{ background: #FFCE00 ;
  width: 250px;
  height: 30px;
  padding: 2px 5px 2px 5px;
  color:#003651;
  font: 14px Verdana, Arial, sans-serif; font-weight: bold;
  text-align: center;
}

#topic .boodschap
{ width: 250px;
  padding: 5px 5px 4px 6px;
  background-color:#EEEEEE;
}

#topic .boodschap p
{ color:#000066;
  font: 11px Verdana, Arial, sans-serif; 
  text-align:justify; 
}

#topic .boodschap a
{ color:#900000;
  font: 11px Verdana, Arial, sans-serif; 
  text-align:left;
  text-decoration:none;
}

#topic .boodschap h2
{ color:#550077;
  font: 12px Verdana, Arial, sans-serif; 
  text-align:left;
}

#topic .foto1
{ width: 150px;
  height: 90px;
  border : 2px solid #990000;
}

#topic .foto2
{ width: 140px;
  height: 105px;
  border : 2px solid #990000;
}

/*******************************/
/* Opmaak van een topic  van 2 */
/*******************************/
#doublebox { 
width : 880px;
margin-left : 10px;
margin-top: 10px;
padding: 10px 8px 0px 8px;
} 

/*******************************/
/* Niet even groot LG en RK    */
/*******************************/

#doublebox .boxLG { 
width : 600px;
float : left;
background-color:#EEEEEE;
padding: 0px 10px 0px 10px;
} 

#doublebox .boxRK { 
width : 240px;
float : right;
} 

#doublebox .boxLG,.boxRK {
margin-top : 5px;
margin-right : 10px;
}

/*******************************/
/* Niet even groot LK en RG    */
/*******************************/

#doublebox .boxLK { 
width : 240px;
float : left;
} 

#doublebox .boxRG { 
background-color:#EEEEEE;
width : 565px;
float : left;
padding: 0px 10px 0px 10px;
} 

#doublebox .boxLK,.boxRG {
margin-top : 5px;
margin-right : 10px;
}

#doublebox .boxLG p, .boxRK p , .boxLK p, .boxRG p
{ 
  font-size: 12px; 
  font-family: Verdana,Arial, sans-serif; 
}

#doublebox .boxLG img, .boxRK img , .boxLK img, .boxRG img 
{ 
  margin-top : 5px;
  padding : 3px;
  border : 1px solid #888f3d;
} 

#doublebox .boxLG h3,  .boxRK h3, .boxLK h3,  .boxRG h3
{ 
background-repeat : no-repeat;
padding-top : 5px;
font-family : Times, "Times New Roman", serif;
font-weight : lighter;
color : #003651;
font-size : 1.5em;
padding-bottom : 5px;
} 

#doublebox .boxLG h4, .boxRK h4 , .boxLK h4, .boxRG h4
{ 
padding-right : 10px;
padding-top : 15px;
font-family : Times, "Times New Roman", serif;
color : #333;
font-weight : lighter;
font-weight : bolder;
} 

/*******************************/
/* Wel even groot LM en RM    */
/*******************************/

#doublebox .boxLM {
  float : left;
  border-right: 2px  dotted #E2E2E0;
  }
  
#doublebox .boxRM {
  float : right;
  border-left: 2px dotted #E2E2E0;
  }
  
#doublebox .boxLM , .boxRM 
{
  width : 400px;
  margin: 5px 0px 5px 0px;
  padding : 10px 0px 10px 15px;
  border-top: 2px solid #E2E2E0;
}
 
#doublebox .boxLM .hoofding ,.boxRM .hoofding
{ background: #FFCE00 ;
  width: 380px;
  height: 30px;
  padding: 2px 5px 2px 5px;
  color:#003651;
  font: 14px Verdana, Arial, sans-serif; font-weight: bold;
  text-align: center;
}

#doublebox .boxLM  .boodschap,  .boxRM .boodschap
{ width: 380px;
  padding: 5px 5px 4px 6px;
  background-color:#EEEEEE;
}

#doublebox .boxLM  .boodschap p,#doublebox .boxRM  .boodschap p
{ color:#000066;
  font: 11px Verdana, Arial, sans-serif; 
  text-align:justify; 
}

#doublebox .boxLM  .boodschap a,#doublebox .boxRM  .boodschap a
{ color:#900000;
  font: 11px Verdana, Arial, sans-serif; 
  text-align:left;
  text-decoration:none;
}
#doublebox .boxLM  .boodschap h2,#doublebox .boxRM  .boodschap h2
{ color:#550077;
  font: 12px Verdana, Arial, sans-serif; 
  text-align:left;
}

img.floatTL { 
padding : 3px;
border : 1px solid #888f3d;
float : left;
margin-right : 7px;
margin-bottom : 3px;
margin-top : 2px;
margin-left : 10px;
} 

img.floatTR { 
padding : 3px;
border : 1px solid #888f3d;
float : right;
margin-left : 7px;
margin-bottom : 3px;
margin-top : 2px;
margin-right : 10px;
} 


/*******************************/
/* De datum lijn */
/*******************************/
#doubleline { 
width : 880px;
margin-left : 10px;
margin-bottom: 15px;
padding: 4px 8px 0px 8px;
} 

/*******************************/
/* Niet even groot LG en RK    */
/*******************************/

#doubleline .boxL {
  float : left;
  text-align:left;
  padding: 2px 0px 2px 10px;
  margin-left : 16px;
  }
  
#doubleline .boxR {
  float : right;
  text-align:right;
  padding: 2px 10px 2px 0px;
  margin-right : 16px;
  }
  
#doubleline .boxL ,.boxR
{
  width : 370px;
  background: #FFCE00;
  height: 16px;
  color:#003651;
  font: 11px Verdana, Arial, sans-serif; 
}
 
/*******************************/
/* Image popup                 */
/*******************************/
#imgbox 
{
    vertical-align : middle;
    position: absolute;
    border: 1px solid #999;
    background : #FFCC00; 
    filter: Alpha(Opacity=100);
    visibility : hidden;
    width : 500px;
	height : 375px;
    z-index : 50;
    overflow : hidden;
    text-align : center;
}
