@charset "utf-8";
/* CSS Document */
.Navigatiebalk    	 { color: #CEB69E }
.Achtergrondkleur    { color: #FAF6F2 }
.Donkerbruin         { color: #56220D }
.Hoverkleur          { color: #F1E7DC }
.Tekstinputachtergrond { color: #fafbfd }
html, body, td, th {  font-family:  "Century Gothic", "Copperplate Gothic Light", 'Copperplate Gothic', "Bell MT", Calibri, Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 28px; color: #56220D;} 
body  {	background-color: #FAF6F2; color: #56220D; font-size: 1em; }
input[type=text], input[type=file], input[type=number], input[type=password], textarea { background-color: #fafbfd; }
input:hover    {  background-color: #F1E7DC;  }
textarea:hover {  background-color: #F1E7DC;  }
input[type=submit]  { border: 1px solid #F1E7DC; border-bottom: 3px solid #F1E7DC; border-left: 4px solid #F1E7DC; border-radius: 25px;  margin: 6px 0 6px 0; padding: 5px 20px; font-size: 23px;  display: inline-block; background-color: #56220D; color: #FAF6F2;}

.btn { background-color: #56220D; color: #F1E7DC; cursor:pointer; border-radius: 25px; }
.btn:hover { background-color: #F1E7DC;  color: #56220D; text-decoration: none; font-weight: bold; font-style: normal;}
a { cursor: pointer; color: #56220D; }
a:hover { color:#CEB69E; font-style: normal; }

.wijzigen_vak { margin-top:130px }
.titel_regel {	text-align: center; 	}
.topnav {  overflow: hidden;  background-color: #CEB69E; width: 100%; padding-left: 10px; position: -webkit-sticky; /* Safari */
position: absolute; border-top: 2px solid grey; }
.topnav a  {  float: left; color: white;  text-align: center; text-decoration: none; border-left: 4px solid grey; padding: 8px 8px; font-size: 0.9em; }
.topnav { overflow: hidden; background-color: #CEB69E; width: 100%; position: -webkit-sticky; /* Safari */
position: absolute; border-top: 4px solid #B29D89; }
.topnav a  {  float: left; color: #56220D;  text-align: center; text-decoration: none; border-left: 5px solid #B29D89; padding: 4px 10px 7px 10px; font-size: 1em; } 
.topnav a:last-child { border-right: 5px solid #B29D89; } 
.topnav a:first-child { margin-left: 10px ; } 
.topnav a:hover { background-color: #E3CAAC;  color: #56220D; border-bottom: 3px solid #B29D89; }

.wijzig_melding { padding: 10px 20px; border: 1px solid #096530; background-color:#F1F4ED; font-size: 1em; }
td {	margin: 2px 10px;	}
.info {
	position: absolute;	width: 50%; left: 25%; top: 220px ; background-color: #FAF6F2; color:#56220D; text-align:center; 
	border: 2px solid #56220D; border-top: 15px solid #56220D; border-left:15px solid #56220D; border-top-left-radius: 70px; border-top-right-radius: 70px; border-bottom-left-radius: 70px; font-size: 1em; padding: 15px 25px; cursor: pointer;
}
  
.row::after {  content: "";  clear: both;  display: table; border: none; }
img {  max-width: 100%;  height: auto;  }
* {  box-sizing: border-box; }
/* Voor mobiele telefoons */
[class*="col-"] {  width: 100%; float: left;  padding: 15px; }
@media only screen and (min-width: 600px) {
.wijzigen_vak { width:98%; font-size: 0.6em; color: #56220D; } 
input[type=text], input[type=submit], input[type=password], input[type=file]{ font-size: 0.8em; }
.btn { font-size: 0.7em; } #tabellen{ width: 96% } .info {  width: 96%; left: 2%; top: 150px; }
}
@media only screen and (min-width: 800px) {
.wijzigen_vak { width:98%; font-size: 0.7em; } 
input[type=text], input[type=file], input[type=submit], input[type=password] { font-size: 0.8em; }
.btn { font-size: 0.7em; } #tabellen{ width: 96% } .info {  width: 92%; left: 3%; top: 150px; }
}
@media only screen and (min-width: 1000px) {
.wijzigen_vak { width:95%; font-size: 1em;}  
.btn { font-size: 0.8em; } #tabellen{ width: 94% } .info {  width: 90%; left: 5%; top: 150px; }
}
@media only screen and (min-width: 1300px) {
.wijzigen_vak { width:90%; font-size: 1em;  border: 1px solid #56220D; border-radius: 50px; box-shadow: 5px 10px 18px #F1E7DC; margin-bottom:300px; }  
.btn { font-size: 0.9em; } #tabellen{ width: 90% } .info {  width: 80%; left: 10%; top: 350px; }
}
@media only screen and (min-width: 1600px) {
.wijzigen_vak { width:75%; font-size: 0.9em; border:1px solid #56220D; border-radius: 50px; box-shadow: 5px 10px 18px #F1E7DC; }  
.btn { font-size: 1em; } #tabellen{ width: 86% } .info {  width: 50%; left: 25%; top: 350px; }
}
@media only screen and (min-width: 1800px) {
.wijzigen_vak { width:60%; font-size: 0.8em; border: 1px solid #56220D; border-radius: 50px; box-shadow: 5px 10px 18px #F1E7DC; }  
.btn { font-size: 1em; } #tabellen{ width: 80% }
}
input[type=submit]:hover  { background-color: #F1E7DC;  color: #56220D;  }