/* CSS Document  Beeldaantwoord.nl
Webwol Design: http://www.webwol.nl
*/

/*voor pagina einde printen*/



.nieuwe-pagina{
  page-break-before: always; /* Forceer een pagina-einde vóór dit element */
  padding-top: 2em;
}

/* dit is om bij alle paddings en margins van 0 uit te gaan, zodat je daar later geen problemen mee krijgt*/
* {
 padding: 0px; 
 margin: 0px;
 } 

/*#################### HTML tags ###############*/
body {
	background-color: #D7D8FE;
	font-family: "Century Gothic", "Geneva", "Comic Sans MS", "sans-serif";
	
	font-size: 0.9em;
	font-style: normal;
	line-height: 1.5em;  
	color: #0000CC;
	
}

/* deze h1 wordt alleen gebruikt in de header het is dus geen gewone kop
   maar het is semantisch gezien wel de belangrijkste kop, ook al is hij kleiner dan de andere*/
h1 { 
	font-size: 0.9em;
	font-weight: bold;
	line-height: 1.3em;
	color: #0000cc;
}

 /* de paginatitel*/
 h2 {
	font-size: 2.5em;
	font-weight: bold;
	line-height: 1.3em;
	color: #0000cc;
	margin: 0em 0em 0.5em 0em;
	text-transform: uppercase;
}

/* de kopjes van de paragrafen*/
h3 {
	font-size: 1.07em;
	font-weight: bold;
	line-height: 1.3em;
	color: #fe57aa;
	margin: 0.2em 0em 0.2em 0em; 
}
h4 {
	font-size: 2.5em;
	font-weight: bold;
	line-height: 1.3em;
	color: #0000cc;
	margin: 0em 0em 0.5em 0em;
	text-transform: uppercase;
}
/* de paragrafen zelf*/
p{
	padding: 0em 0em 0.9em 0em;
}

li{
	margin-left: 2em;
}

/*tegen de stippellijnen bij links (o.a. in firefox)*/
a img {
border : none;
}

a {
outline: none;
}


/*#################Classes/* ######################*/
.foto-links{
	float: left;
	margin: 1em 3% 1em 0%;
}

.foto-rechts{
	float: right;
	margin: 1em 0% 1em 3%;
}

.ondertekening{
	color: #fe57aa;
	font-size: 1em;
	font-style: italic;
	padding: 0em 0em 1em 0em;
	
}

.gemaakt-door{
	font-size: 0.8em;
	text-align: right;
	
}

.voetnoot{
	font-size: 0.7em;
	
	font-style: italic;
	
}

/*.huidige-pagina{
	
	color: red;
}*/
/* ####### Hier komen de div's voor de semantische opbouw van de site ########*/
 
/*er is voor iedere pagina een andere div#hoofdraamwerk omdat er steeds een andere background-image is*/
div#hoofdraamwerk-home{
	background-image: url(images/zij-illustratie-home.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	z-index: 2;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

div#hoofdraamwerk-voorwie{
	background-image: url(images/zij-illustratie-voorwie.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
	
}

div#hoofdraamwerk-beelddenken{
	background-image: url(images/zij-illustratie-beelddenken.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

div#hoofdraamwerk-voorstellen{
	background-image: url(images/zij-illustratie-voorstellen.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

div#hoofdraamwerk-werkwijze{
	background-image: url(images/zij-illustratie-werkwijze.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

div#hoofdraamwerk-davis{
	background-image: url(images/zij-illustratie-davis.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

div#hoofdraamwerk-contact{
	background-image: url(images/zij-illustratie-contact.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

div#hoofdraamwerk-links{
	background-image: url(images/zij-illustratie-links.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

div#hoofdraamwerk-referenties{
	background-image: url(images/zij-illustratie-referenties.jpg);
	background-repeat: repeat-y;
	width: 100%;
	min-height: 500px;
	max-width: 1100px;
	margin: 0 auto; /*centreren*/
}

	
/*----------------------------------------------------------------------*/
div#header{
	width: 100%;
	height: 139px; /*de hoogte van het logoplaatje met de top-padding daarvan*/
	background-image: url(images/achtergrond-logo.jpg);
	background-repeat: repeat-y;
	background-position: right;
	padding: 10px 0em 4.5em 0em;
	
}	

div#logo{
	float: right;
	padding: 8px 15px 0px 0px;
	border: 0px;
	text-decoration: none;
}


div#logo h1{ /* descendent selector voor tekst onder het logo */
	clear: right;
	text-align: left;
	padding: 0px 0px 0px 7px;
}

div#tekstgedeelte {
	clear: both;
	margin: 1em 40px 3em 250px; /*om de tekst weg te duwen van de kant-illustratie */
	/*padding: 0% 7% 0% 8%; /*om de 'marge' toch nog afhankelijk te maken van de browsergrootte*/
	/*padding: 0px 29px 0px 55px;*/	
}

div#navigatie{
	float: left;
	color: #0000CC;
	font-size: 1em; 
	line-height: 1.2em;
	font-weight: bold;
	margin: 13px 0px 0px 250px; /*om het menu weg te duwen van de kant-illustratie */
	/*padding: 0% 7% 0% 8%; /*om de 'marge' toch nog afhankelijk te maken van de browsergrootte*/
	/*padding: 0px 0px 0px 55px;*/
	display: inline; /* dit is enkel voor de IE doubled float-margin bug
						zie: http://www.positioniseverything.net/explorer/doubled-margin.html */
						

}

div#navigatie ul{ /* descendent selector voor de navigatie*/
	list-style-type: none;		
}

div#navigatie a{
	color: #0000cc;
	font-weight: bold;
	text-decoration: none;
}

div#navigatie a:hover{
	color: #fe57aa;
	font-weight: normal;
	
}

div#navigatie .huidige-pagina{
	color: #fe57aa;
	
}

div#footer{
	font-size: 0.8em;
	line-height: 1.1em;
	color: black;
	border: 1px solid black;
	padding: 1em 1em 1em 1em;
	margin: 0.5em 1% 0.2em 1%;
	max-width: 1060px;
	margin: 0 auto; /*centreren*/
}

div#linktabel table{
	border: 0px;
}

div#linktabel th{
	text-align: left;
	font-size: 1.05em;
	padding-right: 1em;
	padding-bottom: 0.2em;
	padding-left: 0.1em;
	padding-top: 0.4em;
	vertical-align: top;
	
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-bottom-color: white;
	border-left-style: none;
}

div#linktabel td{
	text-align: left;
	/*border: 0px;*/
	padding-bottom: 0.2em;
	padding-left: 0.1em;
	padding-right: 0.1em;
	padding-top: 0.4em;
	
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-bottom-color: white;
	border-left-style: none;
}

div#linktabel a{
	text-decoration: none;
}	
textarea, input{
	font-family: "Arial";
	font-size: 0.9em;
	font-style: normal;
	line-height: 1.5em;  
}