/* folders gecentreerd met css content max-width 960 px */

html {
	font-family: arial;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body {
	font-family: arial, helvetica, sans-serif;
	font-size: 16px;
	line-height: 1.3;
}

/* deze regels veranderen de links */
/* kleuren origineel: #337ab7 en #23527c (vervangen door blauw #0000FF) */
a {
	background-color: transparent;
}
a {
	color: #337ab7;
	text-decoration: none;
}
a:active, a:hover {
	outline: 0;
}
a:hover {
	color: #0000FF;
	text-decoration: underline;
}
/* einde instellingen links */

/* instelling centreren pagina */
.content {
  max-width: 960px;
  margin: auto;
  padding: 0px;
}
.koptekst {
	width: 100%;
	background-color: #E2E4FE;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 1;
	color: #000000;
}
.koptekstopmerkingen {
	width: 100%;
	background-color: #E2E4FE;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 1;
	color: #000080;
}
.voettekst {
	width: 100%;
	background-color: #E2E4FE;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 1;
	color: #000080;
}
.container-fluid {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
}
.container-fluid-18 {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
}
.alfabet {
	width: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 1.4;
	color: #000080;
}
.alfabet-kop {
	width: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.4;
}
.afbeeldingen {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.tabel {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.table-flex {
	max-width: 100%;
	border: 0px solid #000000;
	border-collapse: collapse;
}
.table-flex > tbody > tr > td, .table-flex > tbody > tr > th, .table-flex > tfoot > tr > td, .table-flex > tfoot > tr > th, .table-flex > thead > tr > td, .table-flex > thead > tr > th {
	padding: 4px;
	line-height: 1.43;
	vertical-align: top;
	text-align: left;
	border: 1px solid #000000;
	background-color: #FFFFDD;
}
.table-flex > thead > tr > th {
	background-color: #800000;
	color: #FFFFFF;
}
.img-responsive {
	border-width: 0px;
	display: block;
	max-width: 100%;
	height: auto;
}
.img-responsiveright {
	border-width: 0px;
	display: block;
	max-width: 100%;
	height: auto;
	float: right;
}
.img-responsiveleft {
	border-width: 0px;
	display: block;
	max-width: 100%;
	height: auto;
	float: left;
}
.table-blok {
	width: 100%;
	max-width: 100%;
}
.left {
  box-sizing: border-box;
  padding: 0px;
  float: left;
  width: 49%; /* The width is 50%, by default */
}
.main {
  box-sizing: border-box;
  padding: 0px;
  float: left;
  width: 2%; /* The width is 50%, by default */
}
.right {
  box-sizing: border-box;
  padding: 0px;
  float: left;
  width: 49%; /* The width is 50%, by default */
}

/* Use a media query to add a break point at 650px: */
@media screen and (max-width: 650px) {
.left, .main, .right {
  width: 100%; 
}
/* The width is 100%, when the viewport is 650px or smaller */