/* stylesheet Stoutenburg home */

/* eerste vier elementen niet wijzigen, is basis-layout */

body {
	background-color:  #FCF0DA; 
	background-image: url(../images/band.gif);
	background-repeat: repeat-x;
	padding: 0px;
	margin: 0px 
	}

#layout {margin: 0 auto;   
	 width: 800px;
	 background-color: #FCF0DA;
	 background-image: url(../images/body-home.gif);
	background-repeat: repeat-y;
	 }

#header0 {margin: 0 auto;   
	 width: 800px;
	 background-color: #FCF0DA;
	 background-image: url(../images/kop-home1.gif);
	background-repeat: no-repeat;
	height: 31px;
	} 
	
#header1 {margin: 0 auto;   
	 width: 800px;
	 background-color: #FCF0DA;
	 background-image: url(../images/kop-home1a.gif);
	background-repeat: no-repeat;
	height: 112px;
	} 
	
#header2 {margin: 0 auto;   
	 width: 800px;
	 background-color: #FCF0DA;
	 background-image: url(../images/kop-home1b.gif);
	background-repeat: no-repeat;
	height: 32px;
	} 

/* hieronder kun je lettertype, fontcolor en -size wijzigen. 
Padding left en right zo laten, top en bottom kun je wel wijzigen, geven marges boven en onderaan de tekst weer. */

#content { 
		color: #000000;
		font-family: arial, helvetica, sans-serif;
		font-size: 13px;
		text-align: left;
		padding-left: 20px;
		padding-right: 30px;
		padding-top: 15px;
		padding-bottom: 15px;
		}

/* hieronder de definities voor de links.
De backgroundcolor bij hover (mouse-over) heb ik laten corresponderen met de menubalk, die zou ik zo laten.
De rest gaat over de tekstkleur van de links, nu allemaal roodtinten, maar daar kun je elke gewenste kleur van maken. */

	#content a {
		text-decoration: none;
		color: #800000; }

	#content a:link { color: #A52A2A } 
	#content a:active { color: #CD3333 }
	#content a:visited { color: #CD3333 }
	#content a:hover {background-color: #A52A2A;
				color: #FFEFD5; }

/* De definities voor de verwijzingen bovenaan de pagina's */ 
				
	#verwijzing { 
		color: #CD7054;
		font-family: arial, helvetica, sans-serif;
		font-size: 10px;
		text-align: right;
		}

	#verwijzing a {
		text-decoration: underline;
		color: #CD4F39; }
	
	#verwijzing a:link { color: #CD4F39 } 
	#verwijzing a:active { color: #CD4F39 }
	#verwijzing a:visited { color: #CD4F39 }
	#verwijzing a:hover {background-color: #FDF1DB;
				color: #CD4F39; }


/* Definities voor kopteksten */
				
h1 { font-family: "Times New Roman";
		font-size: 30px; 
		text-align: left;
		color: #A52A2A;}
h2 { font-family: "Times New Roman";
	 color: #663333; 
	 font-size: 20px; 
		text-align: left;
		} 
h3 { font-family: "Times New Roman";
	 color: #B22525;
	 font-size: 17px;
	 }
h4 { font-family: "Times New Roman";
		font-size: 30px; 
		text-align: center;
		color: #A52A2A;}
h5 { font-family: "Times New Roman";
	 color: #663333;
	 font-size: 15px;
	 }

	 #foto {
	  color: #663333;
		font-size: 12px;
		font-style: italic;
		text-align: center;
	}

	#credits {
	  color: #ff0000;
		font-size: 13px;
		font-style: italic;
		}
		
/* Definities voor de groene nieuwsbalk.
Is een standaardmenu waarin ik alleen de kleuren heb aangepast. 
Als je wat wilt wijzigen zou ik alleen font-family en color doen. */

#nieuws { 
margin-left: 0;
padding-left: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
color: #800000;
}

#nieuws a
{
display: block;
padding: 3px;
background-color: #B8D878;
}

#nieuws a:link, #navlist a:visited
{
color: #800000;
text-decoration: none;
}

#nieuws a:hover
{
background-color: #95B15E;
color: #eee;
}


/* kopmenu 1, dit is het menu met de links naar de talen. Ook een standaardmenu waarvan ik niet alle definities snap, 
maar na wat gepuzzel wel het menu naar wens aangepast kreeg. Afgezien van font-family, color en font-weight zou ik hier niks
meer aan wijzigen. */

#navcontainer
{
margin: 0 auto;
padding: 0 0 0 18em;
font-family: arial, sans serif;
font-size: 11px;
text-align: center;
}

#navcontainer:after
{
content: ".";
display: block;
line-height: 1px;
font-size: 1px;
clear: both;
}

ul#navlist
{
list-style: none;
padding: 0;
margin: 0 auto;
width: 100%;
font-size: 1em;
}

ul#navlist li
{
display: block;
float: left;
width: 60px;
margin: 0;
padding: 0;
}

ul#navlist li a
{
display: block;
width: 100%;
padding: 6px;
border-width: 1px;
border-color: #ffe #F3E2C3 #F3E2C3 #fff;
border-style: solid;
color: #777;
text-decoration: none;
font-weight: bold;
background: #FCF0DA;
}

#navcontainer>ul#navlist li a { width: auto; }

ul#navlist li#active a, ul#navlist li a:visited
{
background: #FCF0DA;
color: #777;
}

ul#navlist li a:hover, ul#navlist li#active a:hover
{
color: #C8603E;
background: transparent;
border-color: #F3E2C3 #fff #fff #ccc;
}

/* kopmenu 2, standaardmenu naar Home, Communiteit etc.
Zelfde als hierboven, alleen font-definities wijzigen. */

#navcontainer2
{
margin: 0 auto;
padding: 0 0 0 14em;
font-family: arial, sans serif;
font-size: 12px;
text-align: center;
}

#navcontainer2:after
{
content: ".";
display: block;
line-height: 1px;
font-size: 1px;
clear: both;
}

ul#navlist2
{
list-style: none;
padding: 0;
margin: 0 auto;
width: 100%;
font-size: 1em;
}

ul#navlist2 li
{
display: block;
float: left;
width: 85px;
margin: 0;
padding: 0;
}

ul#navlist2 li a
{
display: block;
width: 100%;
padding: 6px;
border-width: 1px;
border-color: #ffe #F3E2C3 #F3E2C3 #fff;
border-style: solid;
color: #333333;
text-decoration: none;
font-weight: bold;
background: #FCF0DA;
}

#navcontainer2>ul#navlist2 li a { width: auto; }

ul#navlist2 li#active a, ul#navlist li a:visited
{
background: #FCF0DA;
color: #777;
}

ul#navlist2 li a:hover, ul#navlist2 li#active a:hover
{
color: #C8603E;
background: transparent;
border-color: #F3E2C3 #fff #fff #ccc;
}

/* De definities voor de menu's in de menubalk staan in de afzonderlijke menu-pagina's */