/* ======================================================
      Vriendenkring 'De Rooie Hoek'
      Basic Style Sheet, Versie 2.0 - 16-01-2008
      Copyright 2006-2008 Joost Haneveer
====================================================== */


/* ------------------------------------------------------
   Standaard HTML definities
------------------------------------------------------ */

/* Verwijderen borders van images met een link */ 
a img{border:none;}

/* Standaard lettertype (font-size-adjust bestaat niet volgens validator was 0.51 */
body, h1, h2, h3, h4, h5, h6, td, input{font: 11px verdana, tahoma, Geneva, Arial, Helvetica, sans-serif; color: #000; font-size-adjust:.51;}

/* Headers : h1 wordt gebruikt voor de koppen in het content-gedeelte
h2 wordt gebruikt voor de overige koppen binnen de content */
h1, h2{margin-bottom:5px;font-size:18px;color:#CC0000;line-height:1em;}

/* Standaard paragraaf instelling */
p{padding: 0px 0px 9px 0px;line-height:17px;margin:0px}

/* Link kleuren */
a:link{color:#000000;text-decoration: underline;}
a:visited{color:#000000;}
a:hover{color:#CC0000;text-decoration: underline;}
a:active{color:#CC0000;}

/* Geordende en ongeordende lijst elementen */
li{margin-bottom:0px}
ul,ol{margin-left:25px}

/* ------------------------------------------------------
   Instellingen/positionering achtergrond e.d.
------------------------------------------------------ */
body 
{ 
	text-align: center;
	margin-top: 5px;
	margin-bottom: 0px;
	background-color: #ECECEC;
	background-image:  url(../../images/framework/grijs_back.jpg);
	background-repeat: repeat-x;
	background-position: top left;
}

#container
{
	margin: 0px auto;
	width: 790px; /*768*/
	text-align: left;
	}

/* ------------------------------------------------------
   Pagina kop
------------------------------------------------------ */

#header
{
	height: 120px;
	background-color: white;
	background-image: url(../../images/framework/bg_header.jpg);
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
}

/* ------------------------------------------------------
   Navigatie (Tabs)
------------------------------------------------------ */

/* Box waarin alle tabs zitten */
#tabsbox
{
	margin-top: -27px;
	margin-left: 15px; 
	width: 735px;
	height: 31px;
}

/* Tab zelf - general settings */
#tabsbox div
{
	width: 105px;
	height: 31px;
	overflow: hidden;
	float: left;
	text-align: center;
	list-style-type: none;
}

/* Tabs Lettertype */
#tabsbox div a
{
	color: #fff;
	line-height: 31px;
	text-decoration:none;
}

/* Background image voor de tabs */
#tab1{background-image: url(../../images/framework/tab_hover_1.gif)}
#tab2{background-image: url(../../images/framework/tab_hover_1.gif)}
#tab3{background-image: url(../../images/framework/tab_hover_1.gif)}
#tab4{background-image: url(../../images/framework/tab_hover_1.gif)}
#tab5{background-image: url(../../images/framework/tab_hover_1.gif)}
#tab6{background-image: url(../../images/framework/tab_hover_1.gif)}

/* Het background image van de actieve tab veranderen  */
.tabpage1 div #tab1{background-image: url(../../images/framework/tab_actief_1.gif)}
.tabpage2 div #tab2{background-image: url(../../images/framework/tab_actief_1.gif)}
.tabpage3 div #tab3{background-image: url(../../images/framework/tab_actief_1.gif)}
.tabpage4 div #tab4{background-image: url(../../images/framework/tab_actief_1.gif)}
.tabpage5 div #tab5{background-image: url(../../images/framework/tab_actief_1.gif)}
.tabpage6 div #tab6{background-image: url(../../images/framework/tab_actief_1.gif)}

/* Actieve tab lettertype stijl - afhankelijk van het kleurenschema dat wordt gebruikt */
.tabpage1 #tab1 a {font-weight: bold;} 
.tabpage2 #tab2 a {font-weight: bold;} 
.tabpage3 #tab3 a {font-weight: bold;} 
.tabpage4 #tab4 a {font-weight: bold;} 
.tabpage5 #tab5 a {font-weight: bold;}
.tabpage6 #tab6 a {font-weight: bold;}

/* Stijl van de tab links*/
#tabsbox div a{display:block;}

/*De scheiding tussen de header/tabs en de rest van de pagina */
#headerbottom
{	
	background-image: url(../../images/framework/balk_1.gif);
	background-repeat:repeat-x;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	margin-top: -5px;
	height:12px;
	width:788px; /*766*/
}

/* ---------------------------------------------------------
3 koloms stijl (content- links, rechts en center box gebied)
--------------------------------------------------------- */

/* Standaard settings voor de 3-koloms opmaak */
#contentlinks,#contentrechts
{
   text-align:center;
   float:left;
   width:138px;
   margin-bottom:2px; 
}

#contentmidden
{
	text-align:justify;
	border: 1px solid #838383;
	background: #fff;
	float:left;
	width:480px; /*468*/
	padding:15px; /*10*/
	margin:0px;
}

/* Voegt marges toe binnen het contentgebied */
#contentmidden .hr{margin: 8px 0px 8px 0px;width:469px;}

#contentmidden ul.menu li{background: none;padding:2px 9px}

/* Class gebruikt voor het uitlijnen van een tekstbox binnen tekst */
#contentmidden div.left{float:left;margin: 0px 9px 0px 0px}
#contentmidden div.right{float:right;margin: 0px 0px 0px 9px}

/* caption tekst */
#contentmidden div.right div{font-size:10px}
	
/* ------------------------------------------------------
Gekleurde achtergrond contentgebied
------------------------------------------------------ */

#contents {
	background:#CC0000;
   	border-left:1px solid #000;
   	border-right:1px solid #000;
	padding-top: 3px; 
	width:auto;
}
/* ------------------------------------------------------
Menu boxen - classes gebruikt om menuboxen te genereren
------------------------------------------------------ */

/* Creer een menubox header */
.sidecolumn h3{
	font-weight:bold;
	background-color:#FFFFFF;
	border-top:1px solid #838383;
	border-left: 1px solid #838383;
	border-right: 1px solid #838383;
	margin:0px 3px;
	text-align:left;
	padding: 9px 9px 3px 6px;
	line-height:13px;
}


/* Creer een menubox - gebruikt tesamen met h3 header*/
.sidecolumn .box {
	background-color:#FFFFFF;
	border-bottom:1px solid #838383;
	border-left: 1px solid #838383;
	border-right: 1px solid #838383;
	margin:0px 3px 3px 3px;
	text-align:left;
	padding-bottom:5px;
	overflow:hidden;
}

/* opmaak voor de hr-tag in een menu-box */
.sidecolumn .box .hr{margin:0px 5px}

/* ------------------------------------------------------
 Pagina Footer
------------------------------------------------------ */
/*  Onder aan de pagina */
#footer {
	background-color:#FFFFFF;
	border-top:1px solid #000000;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	padding-top:9px;
	text-align:center;
	width:auto;
}


/* ------------------------------------------------------
Layout voor overzichten van links
------------------------------------------------------ */

/* menu container */
ul.arrow{
	list-style-type: none;
	margin: 0px 5px 0px -35px;
}

/* menu item stijl-  */
ul.arrow li{
	
	background-repeat: repeat-x;
	padding: 3px 3px;
}

/* creer stippellijn */
ul.arrow li.line{
	background-image:url(../../images/framework/dot.gif);
}

/* Submenu container */
ul.arrow li div ul{
	margin:3px 0px 0px 0px;
	list-style: none;
}

/* verwijderen onderlijning van menu item */
ul.arrow a {text-decoration:none;}

/* class voor gebruikt voor het actieve menu item*/
ul.arrow .active {font-weight:bold;}

/* Link kleuren voor menu items */
ul.arrow a:link{color:#000;}
ul.arrow a:visited{color:#000;}
ul.arrow a:hover{color:#CC0000;text-decoration: underline;}
ul.arrow a:active{color:#CC0000;}

/* arrow voor de menu items */
ul.arrow li div{
	background-image: url(../../images/framework/bullet_pijl.gif);
	background-position: 0px 5px;
	background-repeat: no-repeat;
	padding-left: 9px;
	margin-left:0px;
	line-height:14px;
}

/* ------------------------------------------------------
Diversen
------------------------------------------------------ */
/* Extra ruimte tussen onderwerpen/afbreken */ 
.breaker{overflow:hidden;height:1px;clear:both}

/* verwijder marges */
.nomargin{margin:0px;}

/* invoegen van een stippellijn/afbreken */
.hr{background-image:url(../../images/framework/dot.gif);height:1px;overflow:hidden;clear:both;margin:0px;padding:0px;}

/* Class gebruikt voor uitlijnen tekst rond images */
img.left, div.left{float:left;margin: 0px 9px 0px 0px}
img.right, div.right{float:right;margin: 0px 0px 0px 9px}

/* Knoppen met een standaardformaat van 75 bij 23 pixels, */
/* alleen geschikt voor niet te brede opschriften:        */
input.button {
	width:       75px;
	height:      23px;
	margin:      0px 0 10px 0;
}

/* De paginanavigering van het gastenboek in ht midden van de pagina weergeven */
.guestbookpaging 
{
	text-align: center;
}


/* ------------------------------------------------------
   Gekleurde box
------------------------------------------------------ */

/* Standaard settings voor de colorbox */
.colorbox{width:100%;overflow:hidden;}

/* kleurinstelling */
.colorbox{background:#FF6666;}

/* opmaak colorbox hoeken */
.colorbox .topleft, .colorbox .topright, .colorbox .bottomleft, .colorbox .bottomright{
width:9px;
height:9px;
line-height:9px;
overflow:hidden;

}

/* invoegen colorbox hoeken */
.colorbox .topleft{float:left;background-image:url(../../images/framework/colorbox_linksboven.gif);}
.colorbox .topright{float:right;background-image:url(../../images/framework/colorbox_rechtsboven.gif);}
.colorbox .bottomleft{float:left;background-image:url(../../images/framework/colorbox_linksonder.gif);}
.colorbox .bottomright{float:right;background-image:url(../../images/framework/colorbox_rechtsonder.gif);}

/* passend maken van de tekst binnen de colorbox */
.colorbox .content {margin: 0px 9px;}

/* div die de hoeken bevat */
.colorbox .corners{
	overflow:hidden;
	height:9px;
}

/* opmaak van de hr-tag voor een colorbox */
#contentmidden .colorbox .content .hr{width:auto;margin:5px 0px;padding:0px}

/* ------------------------------------------------------
   commissietabel
------------------------------------------------------ */

.comtabel{
	color:#CC0000;
	font-size:14px;
}

ul.historie {margin-left:180px;text-align:left}
