@charset "utf-8";
body {
	background:url(../IMG/dark_background_01.gif);
	margin: 0;
	padding: 0;
	background-attachment: fixed;
}

/* ~~ deze container omvat alle overige divs en geeft de divs hun breedte op basis van een percentage ~~ */
.container {
	width: 80%;
	max-width: 1260px;/* wellicht is het verstandig dat u een maximumbreedte instelt om te voorkomen dat deze lay-out te breed wordt op een groot beeldscherm. Zo zorgt u ervoor dat de regels goed leesbaar blijven. Deze declaratie werkt niet in Internet Explorer 6. */
	min-width: 780px;
	margin: 0 auto; /* de lay-out wordt gecentreerd via de combinatie van de automatische waarde voor de zijkanten en de breedte. Als u de breedte van de container instelt op 100%, hebt u dit niet nodig. */
	background-color: #333;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FF0;
}

/* ~~ voor de koptekst wordt geen breedte ingesteld. De koptekst loopt over de volledige breedte van uw lay-out en bevat een tijdelijke aanduiding voor een afbeelding, die u moet vervangen door uw eigen gekoppelde logo ~~ */
.header {
	height: 160px;
	background-image: url(../IMG/bolero.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

.header1 {
	height: 40px;
	padding-left: 40px;
}
/* ~~ Dit zijn de kolommen voor de lay-out. ~~ 

1) Opvulling wordt alleen boven en/of onder aan de divs geplaatst. De elementen binnen deze divs hebben opvulling aan de zijkanten. Hierdoor hoeft u geen kadermodelberekeningen uit te voeren. Houd er rekening mee dat als u opvulling aan de zijkant of een rand aan de div toevoegt, deze opvulling wordt toegevoegd aan de waarde die u definieert voor de totale breedte. U kunt ook de opvulling voor een element in de div verwijderen en in de div een tweede div invoegen die geen breedte heeft, maar wel de benodigde opvulling voor uw ontwerp bevat.

2) Er is geen marge ingesteld voor de kolommen omdat deze allemaal zwevend zijn. Als u marge moet toevoegen, moet u dit niet doen aan de kant waarnaar de kolom zweeft (bijvoorbeeld een rechtermarge voor een div die is ingesteld op zweven naar rechts). Vaak kunt u hiervoor opvulling gebruiken. Bij divs waarvoor u deze regel niet kunt toepassen, moet u een declaratie ‘display:inline’ toevoegen aan de regel van de div om een fout op te lossen waarbij in sommige versies van Internet Explorer de marge wordt verdubbeld.

3) Omdat klassen meerdere keren kunnen worden gebruikt in een document en meerdere klassen kunnen worden toegepast op een element, zijn aan de kolommen klassenamen toegewezen in plaats van id's. U kunt bijvoorbeeld zo nodig twee zijbalk-divs stapelen. Desgewenst kunt u deze eenvoudig wijzigen in id’s, zolang u maar ervoor zorgt dat u ze één keer per document gebruikt.

4) Indien gewenst kunt u de navigatie aan rechterkant plaatsen in plaats van aan de linkerkant. Hiervoor hoeft u alleen de kolommen in tegenovergestelde richting te laten zweven (allemaal naar rechts in plaats van naar links), waarna ze in omgekeerde volgorde worden weergegeven. U hoeft de divs niet te verplaatsen in de HTML-broncode.

*/
.sidebar1 {
	float: left;
	width: 15%;
	padding-bottom: 10px;
}
.content {
	padding: 10px 0;
	width: 80%;
	float: right;
	clear: none;
	margin-top: 0em;
}
h1 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:36px;
	color:#FF0;
	font-weight:bold;
	text-align: center;

}
h2 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:24px;
	color:#FF0;
	font-weight:bold;
	text-align: center;
}
h3 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:18px;
	color:#FF0;
	font-weight:bold;
	text-align: center;
}
p {
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;
	color:#FF0;
	font-weight:bold;
	letter-spacing: 0.05em;
	text-align: left;
}
a { color:#9FF; font-size:14px;
}
a: hover {color:#FFF; font-size:16px;
}
/* ~~ De voettekst ~~ */
.footer {
	padding: 10px 0;
	position: relative;/* hiermee kan de eigenschap hasLayout voor IE6 op de juiste wijze worden gewist */
	clear: both; /* met deze eigenschap voor wissen kan de container bepalen waar de zwevende kolommen eindigen en ze insluiten */
}

/* ~ diverse klassen voor zweven/wissen ~~ */
.fltrt {  /* met deze klasse kunt u een element aan de rechterkant van uw pagina laten zweven. Het zwevende element moet voorafgaan aan het element waarnaast het op de pagina staat. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* met deze klasse kunt u een element aan de linkerkant van uw pagina laten zweven. Het zwevende element moet voorafgaan aan het element waarnaast het op de pagina staat. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* deze klasse kunt u gebruiken voor een <br /> of een lege div als het laatste element dat volgt op de laatste zwevende div (binnen de container) wanneer de voettekst uit de container is verwijderd of er buiten is geplaatst */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
li {
	font-size: 14px;
	font-weight: bold;
	color: #FF0;
}
td {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: #FF0;
}