/*------------------ basisopmaak --------------------*/
body {
	background-color: rgb(173, 216, 230);
	font-family: Arial, Helvetica, sans-serif;
  background-image: url('images/denpasar2.avif');
  background-size: 512px;
}

/*------------------ vlakken --------------------*/
* {
  box-sizing: border-box;
}

#wrapper {
	width: 1000px;
  max-width: 100%;
  margin: 5% auto
	/*background-color: Yellow;*/
}
	
header {
	height: 120px;
  background-color: rgb(25, 25, 112);
	color: white;
	text-align: center;
	padding: 5px;
  border-radius: 10px;
  max-width: 100%;
}
	
nav {
	height: 60px;
	background-color: rgb(167, 199, 231);
	padding: 5px;
  border-radius: 10px;
  text-align: center;
  max-width: 100%;
}


.menu {   
  float: left;
  width: 140px;
  border-radius: 10px;
  border: 4px solid rgb(25, 25, 112);
  background-color: rgb(240, 255, 255);
  text-align: center;
  max-width: 100%;
}

/* Right column */
.rightcolumn {
  float: none;
  width: 100%;
  background-color: rgb(115, 147, 179);
  border-radius: 10px;
  padding-left: 140px;
  max-width: 100%;
  /*padding-left: 20px;*/
}

/* Clear floats after the columns */
.row::after {
  content: "";
  display: table;
  clear: both;
  max-width: 100%;
}

article {
	/*background-color: Orange;*/
	padding: 10px;
  max-width: 100%;
}


footer {
	height: 50px;
	background-color: rgb(25, 25, 112);
	color: white;
	text-align: center;
	padding: 5px;
  border-radius: 10px;
  max-width: 100%;
}

/*------------------ menu --------------------*/
.menu a {
  display: block; /* Make the links appear below each other */
  width: 100%;
  padding: 12px; /* Add some padding */
  text-decoration: none; /* Remove underline from links */
  background-color: rgb(240, 255, 255); 
  color: black; /* Black text color */
  max-width: 100%;
}

.menu a:hover {
  background-color: rgb(167, 199, 231); /* Dark grey background on mouse-over */
  max-width: 100%;
}

.menu a.active {
  background-color: rgb(25, 25, 112); /* Add a color to the "active/current" link */
  color: white;
  max-width: 100%;
}

img {
  border-radius: 10px;
  border: 4px solid rgb(25, 25, 112);
  background-color: rgb(240, 255, 255);
  max-width: 500px;
  max-height: 250px;
  margin-left: auto;
  margin-right: auto;
  width: 400px;
  max-width: 100%;
}

.column {
  float: left;
  width: 50%;
  padding: 5px;
  max-width: 100%;
}

/* Clear floats after image containers */
.row::after {
  content: "";
  clear: both;
  display: table;
  max-width: 100%;
}

iframe {
width: 800px;
height: 600px;
border-radius: 10px;
border: 4px solid rgb(25, 25, 112);
max-width: 100%;
}

table, th, td {
border-radius: 10px;
border: 4px solid rgb(25, 25, 112);
border-collapse: collapse;
text-align: center;
margin-left: auto;
margin-right: auto;
max-width: 100%;
}

ol {
width: 800px;
text-align: center;
max-width: 100%;
}