/* ------------------------------- */
/*          - Loek Weijts -        */
/*          L E G O - M O T S      */
/*               2016              */
/* ------------------------------- */
/* - full screen slider *./

}
/* CSS reset */
/* Kleuren en typografie */
/* background setup */
/* Algemene styling */
/* =========== */
/* lettertypen */
/* =========== */
/* Legoblokken */
/* Vaste elementen */
/* =========================== */
/* Algemene styling            */
/* =========================== */
/* contentblokken  */
/* Lego-mots - copyright Loek Weijts */
/* 2016 */
/* stijlen voor teaser timer */
/* overige */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

html, body {
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

input {
  border: 1px solid #b0b0b0;
  padding: 3px 5px 4px;
  color: #979797;
  width: 190px; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0;
  /* General Demo Style */ }

body {
  font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
  background: #000;
  font-weight: 400;
  font-size: 15px;
  color: #aa3e03;
  overflow-y: scroll;
  overflow-x: hidden; }

.ie7 body {
  overflow: hidden;
  /* - deel 2 -*/ }

.cb-slideshow, .cb-slideshow:after {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  z-index: -2; }

.cb-slideshow:after {
  content: '';
  z-index: 0; }

.cb-slideshow li span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  color: transparent;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: none;
  opacity: 0;
  z-index: 0;
  -webkit-backface-visibility: hidden;
  -webkit-animation: imageAnimation 36s linear infinite 0s;
  -moz-animation: imageAnimation 36s linear infinite 0s;
  -o-animation: imageAnimation 36s linear infinite 0s;
  -ms-animation: imageAnimation 36s linear infinite 0s;
  animation: imageAnimation 36s linear infinite 0s; }

.cb-slideshow li div {
  z-index: 1000;
  position: absolute;
  bottom: 10px;
  left: 0px;
  width: 100%;
  text-align: right;
  opacity: 0;
  -webkit-animation: titleAnimation 36s linear infinite 0s;
  -moz-animation: titleAnimation 36s linear infinite 0s;
  -o-animation: titleAnimation 36s linear infinite 0s;
  -ms-animation: titleAnimation 36s linear infinite 0s;
  animation: titleAnimation 36s linear infinite 0s; }

.cb-slideshow li div h3 {
  font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
  font-size: 160px;
  padding: 0 30px;
  line-height: 120px;
  color: rgba(169, 3, 41, 0.8); }

.cb-slideshow li:nth-child(1) span {
  background-image: url("../../../../files/1914/7809/8315/slide4.jpg"); }

.cb-slideshow li:nth-child(2) span {
  background-image: url("../../../../files/4914/7810/5362/slide3.jpg");
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
  -o-animation-delay: 6s;
  -ms-animation-delay: 6s;
  animation-delay: 6s; }

.cb-slideshow li:nth-child(3) span {
  background-image: url("../../../../files/6314/7809/8311/slide3.jpg");
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -o-animation-delay: 12s;
  -ms-animation-delay: 12s;
  animation-delay: 12s; }

.cb-slideshow li:nth-child(4) span {
  background-image: url("../../../../files/2814/7809/8647/slide1.jpg");
  -webkit-animation-delay: 18s;
  -moz-animation-delay: 18s;
  -o-animation-delay: 18s;
  -ms-animation-delay: 18s;
  animation-delay: 18s; }

.cb-slideshow li:nth-child(5) span {
  background-image: url("../../../../files/5114/7809/8308/slide5.jpg");
  -webkit-animation-delay: 24s;
  -moz-animation-delay: 24s;
  -o-animation-delay: 24s;
  -ms-animation-delay: 24s;
  animation-delay: 24s; }

.cb-slideshow li:nth-child(6) span {
  background-image: url("../../../../files/2314/7809/8306/slide2.jpg");
  -webkit-animation-delay: 30s;
  -moz-animation-delay: 30s;
  -o-animation-delay: 30s;
  -ms-animation-delay: 30s;
  animation-delay: 30s; }

.cb-slideshow li:nth-child(2) div {
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
  -o-animation-delay: 6s;
  -ms-animation-delay: 6s;
  animation-delay: 6s; }

.cb-slideshow li:nth-child(3) div {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -o-animation-delay: 12s;
  -ms-animation-delay: 12s;
  animation-delay: 12s; }

.cb-slideshow li:nth-child(4) div {
  -webkit-animation-delay: 18s;
  -moz-animation-delay: 18s;
  -o-animation-delay: 18s;
  -ms-animation-delay: 18s;
  animation-delay: 18s; }

.cb-slideshow li:nth-child(5) div {
  -webkit-animation-delay: 24s;
  -moz-animation-delay: 24s;
  -o-animation-delay: 24s;
  -ms-animation-delay: 24s;
  animation-delay: 24s; }

.cb-slideshow li:nth-child(6) div {
  -webkit-animation-delay: 30s;
  -moz-animation-delay: 30s;
  -o-animation-delay: 30s;
  -ms-animation-delay: 30s;
  animation-delay: 30s; }

@-webkit-keyframes imageAnimation {
  0% {
    opacity: 0;
    -webkit-animation-timing-function: ease-in; }

  8% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    -webkit-animation-timing-function: ease-out; }

  17% {
    opacity: 1;
    -webkit-transform: scale(1.1) rotate(0deg); }

  25% {
    opacity: 0;
    -webkit-transform: scale(1.1) rotate(0deg); }

  100% {
    opacity: 0; } }

@-moz-keyframes imageAnimation {
  0% {
    opacity: 0;
    -moz-animation-timing-function: ease-in; }

  8% {
    opacity: 1;
    -moz-transform: scale(1.05);
    -moz-animation-timing-function: ease-out; }

  17% {
    opacity: 1;
    -moz-transform: scale(1.1) rotate(0deg); }

  25% {
    opacity: 0;
    -moz-transform: scale(1.1) rotate(0deg); }

  100% {
    opacity: 0; } }

@-o-keyframes imageAnimation {
  0% {
    opacity: 0;
    -o-animation-timing-function: ease-in; }

  8% {
    opacity: 1;
    -o-transform: scale(1.05);
    -o-animation-timing-function: ease-out; }

  17% {
    opacity: 1;
    -o-transform: scale(1.1) rotate(0deg); }

  25% {
    opacity: 0;
    -o-transform: scale(1.1) rotate(0deg); }

  100% {
    opacity: 0; } }

@-ms-keyframes imageAnimation {
  0% {
    opacity: 0;
    -ms-animation-timing-function: ease-in; }

  8% {
    opacity: 1;
    -ms-transform: scale(1.05);
    -ms-animation-timing-function: ease-out; }

  17% {
    opacity: 1;
    -ms-transform: scale(1.1) rotate(0deg); }

  25% {
    opacity: 0;
    -ms-transform: scale(1.1) rotate(0deg); }

  100% {
    opacity: 0; } }

@keyframes imageAnimation {
  0% {
    opacity: 0;
    animation-timing-function: ease-in; }

  8% {
    opacity: 1;
    transform: scale(1.05);
    animation-timing-function: ease-out; }

  17% {
    opacity: 1;
    transform: scale(1.1) rotate(0deg); }

  25% {
    opacity: 0;
    transform: scale(1.1) rotate(0deg); }

  100% {
    opacity: 0; } }

@-webkit-keyframes titleAnimation {
  0% {
    opacity: 0;
    -webkit-transform: translateX(200px); }

  8% {
    opacity: 1;
    -webkit-transform: translateX(0px); }

  17% {
    opacity: 1;
    -webkit-transform: translateX(0px); }

  19% {
    opacity: 0;
    -webkit-transform: translateX(-400px); }

  25% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@-moz-keyframes titleAnimation {
  0% {
    opacity: 0;
    -moz-transform: translateX(200px); }

  8% {
    opacity: 1;
    -moz-transform: translateX(0px); }

  17% {
    opacity: 1;
    -moz-transform: translateX(0px); }

  19% {
    opacity: 0;
    -moz-transform: translateX(-400px); }

  25% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@-o-keyframes titleAnimation {
  0% {
    opacity: 0;
    -o-transform: translateX(200px); }

  8% {
    opacity: 1;
    -o-transform: translateX(0px); }

  17% {
    opacity: 1;
    -o-transform: translateX(0px); }

  19% {
    opacity: 0;
    -o-transform: translateX(-400px); }

  25% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@-ms-keyframes titleAnimation {
  0% {
    opacity: 0;
    -ms-transform: translateX(200px); }

  8% {
    opacity: 1;
    -ms-transform: translateX(0px); }

  17% {
    opacity: 1;
    -ms-transform: translateX(0px); }

  19% {
    opacity: 0;
    -ms-transform: translateX(-400px); }

  25% {
    opacity: 0; }

  100% {
    opacity: 0; } }

@keyframes titleAnimation {
  /* Show at least something when animations not supported */
  0% {
    opacity: 0;
    transform: translateX(200px); }

  8% {
    opacity: 1;
    transform: translateX(0px); }

  17% {
    opacity: 1;
    transform: translateX(0px); }

  19% {
    opacity: 0;
    transform: translateX(-400px); }

  25% {
    opacity: 0; }

  100% {
    opacity: 0; } }

.no-cssanimations .cb-slideshow li span {
  opacity: 1; }

@media screen and (max-width: 1140px) {
  .cb-slideshow li div h3 {
    font-size: 100px; } }

@media screen and (max-width: 600px) {
  .cb-slideshow li div h3 {
    font-size: 50px; } }

.background {
  background-repeat: no-repeat;
  /* custom background-position */
  background-position: 50% 50%;
  /* ie8- graceful degradation */
  background-position: 50% 50% \9 !important;
  /* fullscreen setup */ }

html, body {
  height: 100%;
  margin: 0; }

.fullscreen, .content-a {
  width: 100%;
  height: 100%;
  overflow: hidden; }

.fullscreen.overflow, .fullscreen.overflow .content-a {
  height: auto;
  min-height: 100%;
  /* content centering styles */ }

.content-a {
  display: table; }

.content-b {
  display: table-cell;
  position: relative;
  vertical-align: middle;
  text-align: center; }

.wit {
  color: #000;
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  margin: 10px 10px;
  display: inline-block;
  background-color: #fff;
  width: 95%;
  padding: 4px 8px;
  position: fixed;
  bottom: 8px; }

.popbox {
  color: #000;
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  margin: 10px;
  display: inline-block;
  background-color: #fff;
  width: 95%;
  padding: 4px 8px;
  display: none;
  position: fixed;
  bottom: 8px;
  z-index: 10; }

.wit > button {
  width: 35px;
  height: 35px;
  background-color: #444;
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer; }

.knopzoom {
  float: right; }

h2 {
  margin: 0px; }

p, h2, h3, h4, h5, h6 {
  font-family: "Open Sans", sans-serif; }

p {
  font-size: 15px;
  line-height: 175%;
  margin-bottom: 20px;
  color: #000; }

.artikel0 ul li {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  line-height: 175%;
  margin-bottom: 20px;
  color: #000;
  list-style-type: circle;
  margin-left: 15px; }

@media screen and (max-width: 650px) {
  h1 {
    font-family: "Open Sans", sans-serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 100%;
    margin-bottom: 8px;
    color: #bd1d1d;
    padding-bottom: 20px; } }

@media screen and (min-width: 650px) {
  h1 {
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    font-size: 50px;
    line-height: 100%;
    color: #bd1d1d;
    padding-bottom: 40px; } }

h2 {
  font-size: 20px;
  padding: 0px;
  line-height: 110%;
  margin-bottom: 10px;
  color: #bd1d1d; }

@media screen and (max-width: 650px) {
  h3 {
    font-weight: 300;
    font-size: 16px;
    line-height: 150%;
    margin-bottom: 12px;
    color: #000; } }

@media screen and (min-width: 650px) {
  h3 {
    font-weight: 300;
    font-size: 17px;
    line-height: 150%;
    margin-bottom: 12px;
    color: #000; } }

h4 {
  font-size: 20px;
  line-height: 50px;
  font-weight: 500;
  color: #fff;
  display: inline-block; }

h4 a {
  color: #fff;
  background-color: #bd1d1d;
  text-decoration: none;
  margin: 0 10px 10px 0;
  padding: 5px 10px 5px 10px; }

h4 a:active {
  color: #fff;
  background-color: #000;
  text-decoration: none;
  margin: 0 10px 10px 0;
  padding: 5px 10px 5px 10px; }

h4 a:hover {
  color: #fff;
  background-color: #000;
  text-decoration: none;
  margin: 0 10px 10px 0;
  padding: 5px 10px 5px 10px; }

h5 {
  font-family: "Open Sans", sans-serif;
  font-weight: 300;
  font-size: 30px;
  line-height: 35px;
  color: #2c71b4;
  margin-bottom: 10px; }

.kopvlak {
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 150%;
  color: #2c71b4; }

h6 {
  font-family: "Open Sans", sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: 45px;
  margin-bottom: 10px; }

.voorkantplaat {
  max-width: 100%; }

hr {
  height: 2px;
  color: #f39505;
  background: #f39505; }

#mots-back {
  position: fixed;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  z-index: -1; }

#mots-back > img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  min-width: 50%;
  min-height: 50%;
  z-index: -1; }

@media screen and (max-width: 750px) {
  ul.simpleTabs {
    margin: 0 !important;
    padding: 0 !important;
    display: none;
    font-family: "Open Sans", sans-serif; } }

@media screen and (min-width: 750px) {
  ul.simpleTabs {
    padding: 0 !important;
    margin-left: 100px;
    margin-right: 100px;
    margin-top: 0px;
    margin-bottom: 4px;
    display: none; }

  ul.simpleTabs {
    display: block; }

  ul.simpleTabs li {
    background: #e17000;
    list-style: none !important;
    float: left;
    font-family: "Open Sans", sans-serif;
    padding: 8px 15px;
    margin: 6px 4px 0 0; }

  ul.simpleTabs li.active {
    background: #ddd;
    padding: 8px 15px;
    margin: 6px 4px 0 0; }

  ul.simpleTabs li a {
    color: #000;
    font-size: 18px;
    color: #000 !important;
    text-decoration: none !important;
    font-family: "Open Sans", sans-serif; }

  ul.simpleTabs li.active a {
    color: #000 !important;
    font-weight: bold; }

  .simpleTabsContent {
    display: none; }

  .tab-title {
    display: none; }

  .simpleTabsContent:first-child {
    display: block; } }

.achtergrond {
  background-color: #fff7b1; }

body {
  background-color: #ded798;
  /* HTML 5 canvas element */ }

canvas {
  background: #c0c0c0;
  width: 100%;
  height: auto;
  /* witruimte */ }

.blancspacer {
  width: 100%;
  height: 10px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 10px;
  margin-bottom: 10px;
  /* artikel marges */ }

@media screen and (min-width: 750px) {
  .centreer {
    margin-left: 100px;
    margin-right: 100px;
    margin-top: 0px;
    margin-bottom: 0px; } }

@media screen and (max-width: 750px) {
  /* uitklappaneel */
    .centreer {
      margin-left: 20px;
      margin-right: 20px;
      margin-top: 0px;
      margin-bottom: 0px; } }

.panel {
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
  background-color: #bbb; }

.panel-heading > .dropdown .dropdown-toggle {
  color: #fff;
  background-color: #bbb; }

.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: #fff;
  background-color: #e17000; }

.panel-default {
  border-color: #e17000; }

.panel-default > .panel-heading {
  color: #bd1d1d;
  background-color: #e17000;
  border-color: #e17000;
  /* container opties */ }

.containermargins, .container-fixed-mots-top, .container-fixed-mots {
  margin: 0 auto;
  max-width: 950px; }

.container-fixed-mots-top {
  margin-top: 60px;
  overflow-x: hidden; }

.container-fixed-mots {
  padding: 0px; }

.themotsfooter {
  color: #fff;
  text-align: left;
  background-color: #e60082;
  height: 80px;
  margin: 0 auto;
  padding: 5px 5px 5px 5px;
  /* video achtergrond vullend */ }

.volvideo {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  background: no-repeat;
  background-size: cover;
  /* vormgever footer */ }

.kleurvlak {
  border: 10px solid #000;
  background: yellow;
  height: 100px;
  width: 100%; }

.headerfoto {
  /* module 2 - basis met beeld rechts en tekst */ }

#module2 {
  margin: 30px 0px 30px 0px;
  min-height: 350px; }

#module2 img {
  width: 300px;
  height: 300px;
  float: right;
  margin: 0px 80px 0px 30px; }

#module2 h1 {
  font-family: "Open Sans", sans-serif;
  color: #bd1d1d;
  font-size: 25px; }

.ccm-toolbar-visible .navbar-fixed-top {
  top: 49px; }

a.enter_rollover {
    display: inline-block;
    width: 60px;
    height: 60px;
    text-decoration: none;
    background: url("../../images/nav/next2.png"); }

a.home_rollover {
  display: inline-block;
  width: 60px;
  height: 60px;
  text-decoration: none;
  background: url("../../images/nav/home2.png"); }

a.home_rollover:hover {
  background-position: -60px 0; }

.home_displace {
  position: absolute;
  left: -5000px; }

a.menu_rollover {
  display: inline-block;
  width: 60px;
  height: 60px;
  text-decoration: none;
  background: url("../../images/nav/hamburger2.png"); }

a.menu_rollover:hover {
  background-position: -60px 0; }

.menu_displace {
  position: absolute;
  left: -5000px; }

a.knopn_rollover {
  display: inline-block;
  width: 60px;
  height: 60px;
  text-decoration: none;
  background: url("../../images/nav/next2.png"); }

a.knopn_rollover:hover {
  background-position: -60px 0; }

.knopn_displace {
  position: absolute;
  left: -5000px; }

a.knopb_rollover {
  display: inline-block;
  width: 60px;
  height: 60px;
  text-decoration: none;
  background: url("../../images/nav/back2.png"); }

a.knopb_rollover:hover {
  background-position: -60px 0; }

.knopb_displace {
  position: absolute;
  left: -5000px; }

.container {
  padding: 0; }

.menuachtergrondkleur {
  background-color: #f18827;
  height: 60px; }

#header {
  background-color: #bd1d1d; }

.homebutton {
  margin: 0px 0px 0px 0px; }

.navigator > .nav > li {
  text-decoration: none;
  background-color: #2c71b4; }

.navigator > .nav > li > a:hover, .navigator > .nav > li > a:focus {
  text-decoration: none;
  background-color: #faa911; }

a {
  color: #faa911;
  text-decoration: none; }

#cpBtn {
  padding: 0px 0px;
  cursor: pointer; }

#cpBtn:hover {
  display: hidden; }

@media screen and (max-width: 600px) {
  #cp {
    font-family: "Open Sans", sans-serif;
    ccolor: #fff;
    font-size: 14px;
    position: absolute;
    background-color: #2c71b4;
    top: 60px;
    left: -1000px;
    width: 500px;
    height: auto;
    opacity: 0;
    cursor: pointer;
    z-index: 500; } }

@media screen and (min-width: 600px) {
  #cp {
    font-family: "Open Sans", sans-serif;
    color: #fff;
    font-size: 14px;
    position: absolute;
    background-color: #2c71b4;
    top: 60px;
    left: -1000px;
    width: 500px;
    height: auto;
    opacity: 0;
    cursor: pointer;
    z-index: 500; } }

#cp:active {
  background-color: #2c71b4; }

#cp:hover {
  background-color: #2c71b4;
  /* .titelmagazine {
	margin: 0px 0px 0px 0px;
	color: #fff;
}




/* #container {
	width: 100%;
	margin: 0px 0px 0px 0px;
	background-color: $basisachtergrond;
}
*/ }

@media screen and (min-width: 500px) {
  .mots_timer_numbers {
    padding: 0px;
    width: 45px;
    text-align: center;
    font-family: Arial;
    font-size: 50px;
    /* options are normal, bold, bolder, lighter */
    font-weight: bold;
    /* options are normal or italic */
    font-style: normal;
    /* change color using the hexadecimal color codes for HTML */
    color: #8fcae7; }

  .mots_title {
    border-style: none;
    padding: 0px 0px 6px 0px;
    width: 45px;
    text-align: center;
    font-family: Arial;
    font-size: 10px;
    /* options are normal, bold, bolder, lighter */
    font-weight: bold;
    /* change color using the hexadecimal color codes for HTML */
    color: #8fcae7; }

  #mots_table {
    width: 100%;
    height: 70px;
    /* change color using the hexadecimal color codes for HTML */
    background-color: #003e76;
    margin: 0px auto;
    /* leave as "relative" to keep timer centered on your page, or change to "absolute" then change the values of the "top" and "left" properties to position the timer */
    position: relative;
    /* change to position the timer */
    top: 0px;
    /* change to position the timer; delete this property and it's value to keep timer centered on page */
    left: 0px; } }

@media screen and (max-width: 500px) {
  /* footer */
    .mots_timer_numbers {
      padding: 0px;
      width: 45px;
      text-align: center;
      font-family: Arial;
      font-size: 20px;
      /* options are normal, bold, bolder, lighter */
      font-weight: bold;
      /* options are normal or italic */
      font-style: normal;
      /* change color using the hexadecimal color codes for HTML */
      color: #8fcae7; }
    .mots_title {
      border-style: none;
      padding: 0px 0px 6px 0px;
      width: 25px;
      text-align: center;
      font-family: Arial;
      font-size: 7px;
      /* options are normal, bold, bolder, lighter */
      font-weight: bold;
      /* change color using the hexadecimal color codes for HTML */
      color: #8fcae7; }
    #mots_table {
      width: 100%;
      height: 70px;
      /* change color using the hexadecimal color codes for HTML */
      background-color: #003e76;
      margin: 0px auto;
      /* leave as "relative" to keep timer centered on your page, or change to "absolute" then change the values of the "top" and "left" properties to position the timer */
      position: relative;
      /* change to position the timer */
      top: 0px;
      /* change to position the timer; delete this property and it's value to keep timer centered on page */
      left: 0px; } }

@media screen and (min-width: 650px) {
  .footer {
    position: absolute;
    bottom: 0;
    /* Set the fixed height of the footer here */
    width: 100%;
    height: 150px; } }

@media screen and (max-width: 650px) {
  /* video achtergrond vullend */
    .footer {
      margin-top: 50px;
      /* Set the fixed height of the footer here */
      width: 100%;
      height: 150px; } }

.volvideo {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  background: no-repeat;
  background-size: cover; }

.hoofdbeeld {
  background: url("../images/frontpage/cover1.jpg.html") no-repeat center center fixed;
  height: 100vh;
  background-size: cover;
  margin-bottom: 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }

.blokjes {
  position: relative;
  max-width: 600px;
  margin: 0 auto 20px; }

.kopvlak {
  margin-top: 10px; }

.divankeilers {
  position: fixed;
  bottom: 0px;
  width: 100%; }

.ankeilers {
  margin-right: auto;
  margin-left: auto; }

.onderkant {
  width: 80%;
  margin: 0 auto; }

@media screen and (min-width: 800px) {
  .vlak1 {
    height: auto;
    background-color: #8fcae7;
    padding: 10px;
    margin-bottom: 15px; }

  .vlak2 {
    height: auto;
    background-color: #e17000;
    padding: 10px;
    margin-bottom: 15px; }

  .vlak3 {
    height: auto;
    background-color: #007bc7;
    padding: 10px;
    margin-bottom: 15px; } }

@media screen and (max-width: 800px) {
  .vlak1 {
    height: auto;
    background-color: #8fcae7;
    padding: 10px;
    margin-bottom: 15px; }

  .vlak2 {
    height: auto;
    background-color: #e17000;
    padding: 10px;
    margin-bottom: 15px; }

  .vlak3 {
    height: auto;
    background-color: #007bc7;
    padding: 10px;
    margin-bottom: 15px; } }

.module0 p {
  column-width: 300px; }

.module0 img {
  width: 100%;
  margin-bottom: 20px; }

@media screen and (max-width: 1000px) {
  .module1 {
    margin-top: 15px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 40px; } }

@media screen and (min-width: 1000px) {
  .module1 {
    margin-top: 15px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 40px; } }

.module1 img {
  width: 320px;
  height: 320px;
  float: left;
  margin-right: 15px; }

.mots-video {
  height: 0;
  padding-top: 25px;
  padding-bottom: 67.5%;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden; }

.mots-video.widescreen {
  padding-bottom: 56.34%; }

.mots-video.vimeo {
  padding-top: 0; }

.mots-video embed, .mots-video iframe, .mots-video object, .mots-video video {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute; }

.lineout {
  display: flex;
  width: 100%;
  height: 20px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 10px;
  margin-bottom: 10px; }

.linein {
  align-self: center;
  width: 100%;
  height: 4px;
  margin-left: 0px;
  margin-right: 0px;
  background-color: #f07d14; }

.volop {
  display: block;
  margin-top: 0px;
  margin-bottom: 0px; }

.artikel1 {
  margin-top: 0px;
  margin-bottom: 0px; }

@media screen and (max-width: 400px) {
  img.plaat-rechts {
    width: 160px;
    height: 160px; } }

@media screen and (max-width: 600px) {
  img.plaat-rechts {
    width: 200px;
    height: 200px; } }

@media screen and (min-width: 950px) {
  .artikel1 {
    width: 950px;
    column-width: 325px;
    column-gap: 0;
    column-rule: none;
    -webkit-margin-bottom-collapse: separate; } }

.artikel3 p > img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%; }

.artikel3 div > div > ul > li {
  font-family: "Open Sans", sans-serif;
  list-style-type: circle;
  font-size: 15px;
  color: black; }

.artikel4 p > img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  height: 100%; }

.artikel5 div > img {
  float: right;
  margin-left: 20px;
  margin-bottom: 10px;
  padding-top: 20px; }

@media screen and (max-width: 600px) {
  .artikel5 div > img {
    width: 150px; } }

.artikel6 div > img {
  float: left;
  margin-right: 20px;
  margin-bottom: 10px; }

@media screen and (max-width: 600px) {
  .artikel6 div > img {
    width: 150px; } }

.volop {
  display: block; }

@media screen and (min-width: 10px) {
  img.volop {
    width: 100%; } }

@media screen and (min-width: 770px) {
  img.volop {
    width: 100%; } }

@media screen and (min-width: 900px) {
  img.volop {
    width: 100%; } }

.artikel9 div > div > img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 15px;
  width: 100%; }

.artikel11 div > div > img {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 0px;
  width: 100%; }

.artikel12 div > div > img {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 0px;
  width: 100%; }

.artikel13 {
  margin-top: 10px;
  margin-bottom: 10px; }

@media screen and (max-width: 700px) {
  .artikel13 div > div > img {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 50%; } }

@media screen and (min-width: 700px) {
  .artikel13 div > div > img {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 100%; } }

.artikel14 {
  margin-top: 10px;
  margin-bottom: 10px; }

@media screen and (max-width: 700px) {
  .artikel14 div > div > img {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 50%; } }

@media screen and (min-width: 700px) {
  .artikel14 div > div > img {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 100%; } }

.artikel15 div > div > img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 15px;
  width: 100%; }

.tekstvlak15 {
  position: absolute;
  bottom: 20px;
  left: 0px;
  margin: 40px;
  width: 80%; }

@media screen and (min-width: 10px) {
  img.volop {
    width: 100%; }

  .fotokop {
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    color: #fff; }

  .kleinefotokop {
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 120%;
    color: #fff; } }

@media screen and (min-width: 950px) {
  img.volop {
    width: 100%; }

  .fotokop {
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    font-size: 40px;
    line-height: 120%;
    color: #fff; }

  .kleinefotokop {
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: #fff; } }

.artikel16 div > div > img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 15px;
  width: 100%; }

.artikel17 div > div > img {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 20px;
  width: 100%; }

.artikel18 div > div > img {
  border: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 20px;
  width: 100%; }

.artikel19 div > div > img {
  border: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 20px;
  width: 100%; }

@media screen and (max-width: 600px) {
  .module2 {
    padding: 0px 10px 0px 10px; } }

@media screen and (min-width: 600px) {
  .module2 {
    padding: 0px 80px 0px 80px; } }

.module2 img {
  width: 320px;
  height: 320px;
  float: left;
  margin-right: 15px; }

.module2 p {
  column-width: 300px; }

.module2 img {
  width: 100%;
  height: 100%; }

.module3 img {
  width: 320px;
  height: 320px;
  float: left;
  margin-right: 15px; }

.module3 p {
  column-width: 300px; }

.module3 img {
  width: 100%;
  height: 100%; }

#module4 {
  background-color: #2c71b4;
  min-height: 400px; }

#h5 {
  font-family: "Open Sans", sans-serif;
  color: white;
  font-style: italic;
  line-height: 29px;
  font-size: 18px;
  width: 400px;
  height: 300px;
  margin: 50px 0px 0px 80px;
  float: left; }

#quote-foto {
  background-color: #ddd;
  width: 300px;
  height: 400px;
  margin: 0px 0px 0px 0px;
  float: right;
  overflow: hidden; }

#quote-teken1 {
  font-family: "Open Sans", sans-serif;
  font-size: 100px;
  font-style: italic;
  position: absolute;
  color: #f5d927;
  margin: 10px 5px 10px 20px; }

#quote-teken2 {
  font-family: "Open Sans", sans-serif;
  font-size: 100px;
  color: #f5d927;
  font-style: italic;
  position: absolute;
  margin: 260px 5px 10px 500px; }