﻿/* zakboek modelpagina css */
/* deze is basic maar werkt */

html {
	font-family: arial;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body {
	margin: 8px;
	font-family: arial, helvetica, sans-serif;
	font-size: 14px;
	line-height: 1.3;
	color: #000000;
	background-color: #fff;
}
/* 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 */

.koptekst {
	width: 100%;
	background-color: #E2E4FE;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	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;
}
.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;
}
.referenties {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.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;
}
.container-fluid {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
}
/* letter 16px default, kan ook 18px zijn */

.container-fluid-12 {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.container-fluid-14 {
	padding-right: 0px;
	padding-left: 0px;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.container-fluid-16 {
	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;
}
.table {
	width: 100%;
	max-width: 100%;
	margin-bottom: 20px;
	border: 0px solid #000000;
	border-collapse: collapse;
}
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
	padding: 4px;
	line-height: 1.43;
	vertical-align: top;
	text-align: left;
	border: 1px solid #000000;
	background-color: #FFFFDD;
}
.table > thead > tr > th {
	background-color: #800000;
	color: #FFFFFF;
}
.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;
}
.table-flex-2 {
	max-width: 100%;
	vertical-align: top;
	text-align: left;
	border: 0px solid #000000;
	border-collapse: collapse;
}
.table-flex-2 > tbody > tr > td, .table-flex-2 > tbody > tr > th, .table-flex-2 > tfoot > tr > td, .table-flex-2 > tfoot > tr > th, .table-flex-2 > thead > tr > td, .table-flex-2 > thead > tr > th {
	padding: 4px;
	line-height: 1.43;
	vertical-align: top;
	text-align: left;
	border: 0px solid #000000;
	background-color: #FFFFDD;
}
.left {
  box-sizing: border-box;
  padding: 0px;
  float: left;
  width: 50%; /* The width is 20%, by default */
}
.main {
  box-sizing: border-box;
  padding: 0px;
  float: left;
  width: 50%; /* The width is 60%, by default */
}
.right {
  box-sizing: border-box;
  padding: 0px;
  float: left;
  width: 50%; /* The width is 20%, 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 800px or smaller */

