body {
      background-color: #f0f0f0;
      display: flex;
      flex-direction: column;
      margin: 0;
      font-family: Arial, Courier;
      font-size: 80%;
      color: #050d67;
    }

/* OPMAAK HEADER*/

div.kader {	background: #050d67; 
			 padding: 20px;
			 margin: 10px;
			 text-align: center;
			 }

div.kader2 { float: right;

			}
main {
      display: flex;
	  margin: 10px;
	  max-width: 100%;
	  }
	  
/* OPMAAK MENU */	

nav.sidebar {
    width: 25%; /*200px /* De breedte van het menu instellen */
    background: #f0f0f0;
    padding: 20px;
    box-sizing: border-box; /* Zorgt ervoor dat padding en border deel uitmaken van de breedte */
	/*margin: 20px;*/
	}

.sidebar ul {
	list-style: none; /* Bulletpoints verwijderen */
    padding: 0;
	}

.sidebar ul li {
    margin-bottom: 10px; /* Ruimte tussen menu-items */
	font-weight: bold;
	color: #000000;
	}

.sidebar ul li a {
    text-decoration: none; /* Onderstreping van links verwijderen */
    color: #000000;
    }

a:hover {
	background: #d4d4d4;
	}

.sidebar ul li li  {
    margin-bottom: 5px; /* Ruimte tussen menu-items */
	margin-top: 5px;
	text-decoration: none; /* Onderstreping van links verwijderen */
    color: #000000;
   	list-style-type: circle; /* rondje aanduiding submenu */
	list-style-position: inside;
	font-weight: normal;
	}
				 
/* OPMAAK CONTENT*/

div.content { 
	background-color: #ffffff;
	padding-right: 20px;
	width: 75%;
	}		

/* OPMAAK TEKST */

H1 { color: #ffffff; 
	 font-size: 160%;
	 text-align: center; 
     letter-spacing: 0.2em;
	}

H2 { color: #ffffff; 
	 font-size: 120%;
	 text-align: center;
	 margin: 20px 0 0 20px;
	 letter-spacing: 0.1em;
	}		

/* hoofdstuk aanduiding */
H3 { color: #050d67; 
	 font-size: 140%;
	 text-align: left; 
	 letter-spacing: 0.1em;
	 margin: 5px;
	 padding: 5px;
	}

/* Alinea aanduiding */	
H4 { color: #038042; 
	 font-size: 120%;
	 text-align: left;
	 margin: 5px;
	 font-weight: bold;
	 padding: 5px;
	}

H5 { color: #050d67; 
	 font-size: 110%;
	 text-align: left; 
	 font-weight: bold;
	 margin: 5px;
	 padding: 5px;
	}

p { color: #050d67; 
	font-size: 100%;
	text-align: left;
	line-height: 1.3em;
	margin: 5px;
	width: 100%;
	padding: 5px;
   }



a { color: #050d67;}

/* OPMAAK ONDERBALK*/

a.naarboven { color: #ffffff; 
			  text-decoration: none;
			  font-weight: bold;
			  text-align: center;
			   }	
a.kader { color: #ffffff; 
	 font-size: 160%;
	 text-align: center; 
     letter-spacing: 0.2em;
	 text-decoration: none;
	}
p.voettekst { font-size: 90%;
			  color: #ffffff;
			  clear: both;
			  text-align: center;
			  }   

/* OPMAAK PROBLEMEN.HTML */
a.problemen { color: #050d67; 
	 font-size: 100%;
	 font-weight: bold;
	 text-align: left; 
     letter-spacing: 0.1em;
	 text-decoration: none;
	 /*margin: 5px;*/
	 /*padding: 5px;*/
	}	

div.problemen {
	display: none;
	width: 100%;
	border: none;
	background-color: #f0f0f0;
    color: #050d67;
	padding: 5px;
    margin: 5px;
	}

p.problemen	{
	color: #050d67;
	padding: 0px;
    }

div.zwemcomfort {
	margin-left: 5px;
	padding: 5px;
}	

div.installaties { 
	margin: 5px;
	float: left;
}

div.installaties p {
margin: 0;
padding: 0;
	}

/* TABEL VOORENNADELEN */			

table.voorennadelen { background-color: #ffffff; 
					padding: 5px;
					font-size: 100%;
					margin: 5px; 
					width: 100%;
					table-layout: fixed;
					}
							
table.voorennadelen th { border:none;
						 color: #038042;
						 text-align: left;
						  }

table.voorennadelen td { text-align: left;
						color: #050d67;
						vertical-align: top;
                    	border: solid silver 1px;
      					padding: 0px;
						}	

ul.lijstintabel { padding: 5px 20px 5px 20px;
				}	
li.vnd { list-style-type: none;
				}

/* TABEL OORZAAKGEVOLG */

table.oorzaakgevolg { background-color: #ffffff; 
					padding: 5px;
					font-size: 100%;
					margin: 5px; 
					width: 100%;
					table-layout: fixed;
					}

table.oorzaakgevolg th { border:none;
						 color: #038042;
						 text-align: left;
						  }		
						  
table.oorzaakgevolg td { text-align: left;
						color: #050d67;
						vertical-align: top;
                    	border: solid silver 1px;
      					padding: 0px;
						}							  

ul.oorzaakgevolg { padding: 5px;
					margin: 5px;
				   color: #050d67;
				   list-style-type: none;
				}	
			

/*TABEL KOSTEN*/

table.kosten { background-color: #ffffff; 
					padding: 5px;
					font-size: 100%;
					margin: 5px; 
					width: 100%;
					}

table.kosten th { border:none;
						 color: #038042;
						 text-align: left;
						 width: 75%;
						  }		
						  
table.kosten td { text-align: left;
						color: #050d67;
						vertical-align: top;
                    	border: solid silver 1px;
      					padding: 0px;
						width: 75%;
						}							 
table.kosten td.euro { text-align: right;
						/*color: #050d67;
						vertical-align: top;
                    	border: solid silver 1px;
      					padding: 0px;*/
						}		
table.kosten th.euro { text-align: right;
						/*color: #050d67;
						vertical-align: top;
                    	border: solid silver 1px;
      					padding: 0px;*/
						}		

ul.kosten { /*padding: 5px;*/
			margin: 5px;
			color: #050d67;
			list-style-type: circle;
			}	
/* 13-NIEUWZWEMBAD.HTML */

ol.nieuwzwembad { margin: 0px;
			color: #050d67;
			font-size: 100%;
			text-align: left;
			line-height: 1.3em;
			}	

ol.nieuwzwembad li { margin-top: 10px;
				}

img.home { margin: 5px; 
			float: left;
		       }		
img.nieuwzwembad { margin: 5px;}

img.linksintekst { float: left;
					margin-right: 5px;
					}

img.rechtsintekst { float: right;
					margin-left: 5px;
					}

div.benodigdhedenfoto { float: right;
				margin-left: 5px;
}	

div.benodidheden { float: left;
	margin: 5px;
}

img.oplossing {border-width: medium;
				border-color: #000000;
				border-style: solid;
				margin: 5px;
}

div.gecentreerd { text-align: center;

}

				/*
li.lijstintabel { padding: 5px;
				}	
/*						
table.voorennadelen tr { text-align: left;
              			vertical-align: top;			
			  			}	*/		

 



			  /*
div.gallery  {max-width: 980px;
			 }					 
*/




/*--------------------------------------------------------------------------------*/	
/* zorgt ervoor dat er 2 elementen naast elkaar komen te staan*//*

.container {
    display: flex; /* Flexbox gebruiken om elementen naast elkaar te plaatsen *//*
    width: 100%;
}

/*--------------------------------------------------------------------------------*/	
/* MENU OPMAAK*//*
.sidebar {
    width: 200px /* De breedte van het menu instellen *//*
    background-color: #f0f0f0;
    padding: 20px;
    box-sizing: border-box; /* Zorgt ervoor dat padding en border deel uitmaken van de breedte *//*
	margin: 20px;
}

.sidebar ul {
    list-style: none; /* Bulletpoints verwijderen *//*
    padding: 0;
}

.sidebar ul li {
    margin-bottom: 10px; /* Ruimte tussen menu-items *//*
}

.sidebar ul li a {
    text-decoration: none; /* Onderstreping van links verwijderen *//*
    color: #333;
    font-weight: bold;
}

.sidebar ul li li  {
    margin-bottom: 5px; /* Ruimte tussen menu-items *//*
	text-decoration: none; /* Onderstreping van links verwijderen *//*
    color: #333;
   	list-style-type: circle; /* rondje aanduiding submenu *//*
	list-style-position: inside;
}

/*--------------------------------------------------------------------------------*/
/*CONTENT OPMAAK*/
/*
.content {
    width: 75%; /* De breedte van de hoofdinhoud instellen 
    padding: 20px;
    box-sizing: border-box; /* Zorgt ervoor dat padding en border deel uitmaken van de breedte 
	background-color: #ffffff; 
	margin: 20px;
}
*/

/*--------------------------------------------------------------------------------*/

/*HOOFD MENU OPMAAK	 

.hoofdmenu {   margin: 0px;
               padding: 0px;
               border: 1px solid black;
               background-color: #006600; 
               text-align: center;
}

.hoofdmenu ul li {  display: inline; 
                    padding: 0px 40px 0 0px;
										margin: 0;
										}

.hoofdmenu ul li a, a:link, a:visited, a:active {  color: #FFF;
                                                   text-decoration: none;
                                                   font-weight: bold;
													 }

.hoofdmenu ul li a:hover { 	color: #FFF;
							border-bottom: 3px solid #FFF;
							}
							
a, a:link, a:visited, a:active a:hover{  color: #006600; 
                                  text-decoration: underline;
                                  font-weight: normal;
													 				}
*/																	

			
/*KALENDER MENU OPMAAK 
#kalendermenu { text-align: center; 
				height: 20px;
				}

#kalendermenu a { 	text-align: center;
					font-weight: bold;
					color: #006600;
					width: auto;
					margin: 5px 5px;
					height: 18px;
					}					
					
/*--------------------------------------------------------------------------------*/	
				
/*TABEL PRIJZEN OPMAAK			
table.prijzen { background-color: #ffffff; 
				border: solid silver 2px;
				border-collapse: collapse;
				color: #006600;
				padding: 13px;
				font-size: 100%;
				margin: 1.2em 15% 1.2em 15%; 
				}
							
.prijzen thead { border: solid silver 2px;
			 			 	 }

table.prijzen td { 	text-align: center;
					vertical-align: middle;
                    border: solid silver 1px;
      				padding: 5px;
					}	
						
.prijzen tr { text-align: center;
              vertical-align: middle;			
			  }			
						
/*TABEL FOTO WEERGAVE bovenwoning
table.galery { border: none; 
			   background-color: #99ccff; 
			   margin: 1.2em 20px 1.2em 20px;
			   }
							 
/*table.galery td { border: 1px solid black; 
					 }	
									
table.galery img { width: 100px;
				   height: 75px;
				   vertical-align: middle; 
				   padding: 1px; 
				   margin: 1px; 
				   }
									 
table.galery img.big { 	border-color: #000000; 
						width: 320px; 
						height: 240px; 
						}
											 
/*TABEL FOTO WEERGAVE benedenwoning
table.galery2 { border: none; 
						   background-color: #99ccff; 
							 margin: 1.2em 20px 1.2em 20px;
							 }
							 
/*table.galery2 td { border: 1px solid black; 
						 		  }	
									
table.galery2 img {	width: 100px;
					height: 75px;
					vertical-align: middle; 
					padding: 1px; 
					margin: 1px; 
					}
 									 
table.galery2 img.big2 { border-color: #000000; 
						 				   width: 320px; 
											 height: 240px; 
											 }											 
									
/* OPMAAK TABEL CONTACT.HTML 		

table.contact { font-size: 100%;
								color: #006600; 
								margin: 0% 0% 0% 0%;
								width: 250px;
								clear: both;
							}	
*/	 
/*--------------------------------------------------------------------------------*/	
					
/*OPMAAK AFBEELDINGEN*/		
/*												
img.home { margin: 5px; 
           }		
					 
/*OPMAAK TEKST*/				
/*									 
#pdfprint {color: #ffffff;
					 font-size: 60%;
					 font-weight: normal;
					  }
*/							
/* OPMAAK FORMULIER*/									 

/*niet nodig
em { font-style: normal;
	   font-size: 100%;
	 }
 

#emailform {clear: both;
					 }
					 
table.formulier { font-family: arial, courier; 
			 					  font-size: 100%; 
			 						color: #006600; /*donkergroen
			 						}					 
*/