<style>
* {
  box-sizing: border-box;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  background-color: #000080;
}
h1,h2,h3,h4,h5,h6{
  display:block;
  margin:0;
  padding:0;
  color: white;
}
h1 {
  font-family:Arial;
  font-size:35px;
  font-style:normal;
  font-weight:bold;
  line-height:125%;
  letter-spacing:normal;
  text-align:center;			
}
h2 {
  font-family:Arial;
  font-size:24px;
  font-style:normal;
  font-weight:bold;
  line-height:125%;
  letter-spacing:normal;
  text-align:center;
  padding:20px;
}
h3{
  font-family:Arial;
  font-size:20px;
  font-style:normal;
  line-height:125%;
  letter-spacing:normal;
  text-align:center;			
}
h4{
  color:white;
  font-family:Arial;
  font-size:18px;
  font-style:normal;
  text-decoration: none;
  line-height:125%;
  letter-spacing:normal;
  text-align:left;
}
h5 {
  color: #ff0000;
}
h6{
  color:#000080;
  font-family:Arial;
  font-size:10px;
  font-style:normal;
  font-weight:bold;
  color: #000080;
  line-height:125%;
  letter-spacing:normal;
  text-align:left;
}
hr {
  color: navy
}
a {
  color: white;
}
a:link {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
  color: yellow;
}
p {
  color:white;
  font-family:Arial;
  font-size:18px;
  font-style:normal;
  text-align:justify;
  text-decoration:none;
  line-height:125%;
  letter-spacing:normal;
  text-align:left;
}
td {
  color:white;
  font-family:Arial;
  font-size:20px;
  font-style:normal;
  line-height:125%;
  letter-spacing:normal;
  text-align:left;			
}
img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
table, td, th {
  border: 1px solid #000080;
}

table {
  border-collapse: collapse;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
/* Maak drie vakken voor de header en het midden vak */
.grid-container {
  display: grid;
  grid-template-columns: 15% auto 15%;
  grid-gap: 0px;
  background-color: #f1f1f1;
  padding: 0px;
}

.grid-container > div {
  background-color: #000080;
  text-align: center;
  padding: 5px 0;
  font-size: 30px;

}/* Style the footer */
.grid-container > div {
  background-color: #000080;
  border: 1px solid #000080;
  text-align: center;
  font-size: 30px;
}
/* Style het menu */
.sidenav {
  height: auto;
  width: 80%;
  float: right;
  z-index: 1;
  background-color: #000080;
  overflow-x: hidden;
  padding: 10px;
}

.sidenav a {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  font-size: 20px;
  color: #818181;
  display: block;
}

.sidenav a:hover {
  color: #f1f1f1;
}
/* Style the footer */
footer {
  float: center;
  padding: 20px;
  width: 80%;
  height: 50px;
  background-color: #000080;
}
/* Responsive layout - makes the drie columns/boxes stack on top of each other instead of next to each other, on small screens */
@media (max-width: 600px) {
    width: 100%;
    height: auto;
}

}	@media only screen and (max-width: 480px){
		body{
			width:100% !important;
			min-width:100% !important;
		}

}	@media only screen and (max-width: 480px){
		h1{
			font-size:17px !important;
			line-height:125% !important;
		}

}	@media only screen and (max-width: 480px){
		h3,td,p,a{
			font-size:10px !important;
			line-height:125% !important;
		}
</style>
