.hidden {
  width: 0;
  height: 0;
  overflow: hidden;
}

.loader {
  position: fixed;
  left: 50%;
  top: 50%;
  margin-top: -1.25em;
  margin-left: -1.25em;
  border: 0.15em solid #2a2a2a; /* Light grey */
  border-top: 0.15em solid #c58d43; /* Blue */
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation: spin 0.4s linear infinite;
  animation: spin 0.4s linear infinite;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@font-face {
  font-family: "via";
  src: url("../fonts/via.v1.eot?4zwv4f");
  src: url("../fonts/via.v1.eot?4zwv4f#iefix") format("embedded-opentype"),
    url("../fonts/via.v1.ttf?4zwv4f") format("truetype"),
    url("../fonts/via.v1.woff?4zwv4f") format("woff"),
    url("../fonts/via.v1.svg?4zwv4f#via") format("svg");
  font-weight: normal;
  font-style: normal;
}

i {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "via" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.via-arrowback:before {
  content: "\e901";
}
.via-arrowdown:before {
  content: "\e902";
}
.via-arrowforward:before {
  content: "\e903";
}
.via-close:before {
  content: "\e904";
}

.via-eten:before {
  content: "\e908";
  font-size: 0.85em;
}
.via-facebook:before {
  content: "\e909";
}
.via-fiets:before {
  content: "\e90a";
  font-size: 0.77em;
}
.via-fiets2:before {
  content: "\e90b";
}
.via-hamburger:before {
  content: "\e90c";
}

.via-instagram:before {
  content: "\e90e";
  font-size: 0.95em;
}

.via-loop:before {
  content: "\e910";
  font-size: 0.7em;
}
.via-loop2:before {
  content: "\e911";
  font-size: 0.7em;
}
.via-mail:before {
  content: "\e912";
  font-size: 1.04em;
}
.via-marker:before {
  content: "\e913";
}
.via-play:before {
  content: "\e914";
}
.via-rewind:before {
  content: "\e915";
}
.via-slapen:before {
  content: "\e916";
  font-size: 0.85em;
}
.via-ster:before {
  content: "\e917";
}
.via-tel:before {
  content: "\e918";
  font-size: 1.3em;
  margin-right: 1em;
}
.via-triangle:before {
  content: "\e919";
}
.via-twitter:before {
  content: "\e91a";
  font-size: 0.9em;
}
.via-via:before {
  content: "\e91b";
}
.via-viabelgica:before {
  content: "\e91c";
}

.via-doen {
  content: "\e907";
}

@font-face {
  font-family: "viavia";
  src: url("../fonts/viavia.v1.eot?p7qnxd");
  src: url("../fonts/viavia.v1.eot?p7qnxd#iefix") format("embedded-opentype"),
    url("../fonts/viavia.v1.ttf?p7qnxd") format("truetype"),
    url("../fonts/viavia.v1.woff?p7qnxd") format("woff"),
    url("../fonts/viavia.v1.svg?p7qnxd#viavia") format("svg");
  font-weight: normal;
  font-style: normal;
}

del {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "viavia" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  text-decoration: none;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.v-via:before {
  content: "\e907";
}
.v-ar:before {
  content: "\e900";
}
.v-eten:before {
  content: "\e901";
}
.v-fietsen:before {
  content: "\e902";
}
.v-kinderen:before {
  content: "\e903";
}
.v-lopen:before {
  content: "\e904";
}
.v-luisteren:before {
  content: "\e905";
}
.v-slapen:before {
  content: "\e906";
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0px;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: 400;
  font-style: inherit;
  font-family: inherit;
  vertical-align: baseline;
  list-style: none;
}

body {
  font-family: "Ubuntu", sans-serif, Arial, Helvetica;
  font-size: 1em;
  line-height: 1.6em;
  color: #000;
  font-weight: 400;
  background-color: #fff;
  overflow-y: scroll; /* has to be scroll, not auto */
  overflow-x: hidden;

  -webkit-overflow-scrolling: touch;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

input,
textarea {
  font-family: "Ubuntu", sans-serif, Arial, Helvetica;
  font-weight: 400;
  font-size: 1em;
  height: 2em;
  line-height: 2em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #000;
}
input[type="text"]:focus,
textarea:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: none;
}

::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #8f8f8f;
  opacity: 1;
}
::-moz-placeholder {
  /* Firefox 19+ */
  color: #8f8f8f;
  opacity: 1;
}
:-ms-input-placeholder {
  /* IE 10+ */
  color: #8f8f8f;
  opacity: 1;
}
:-moz-placeholder {
  /* Firefox 18- */
  color: #8f8f8f;
  opacity: 1;
}

textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
.input-checkbox {
  -webkit-appearance: none;
  border-radius: 0;
}

a {
  color: #000;
  text-decoration: none;
}
p a {
  color: #000;
  text-decoration: underline;
}
.contact p a {
  text-decoration: none;
}

i,
cite,
em,
var,
dfn {
  font-style: normal;
}
b,
strong {
  font-weight: 500;
  font-family: "Ubuntu", sans-serif, Arial, Helvetica;
}

p {
  position: relative;
  width: 100%;
  display: block;
  float: left;
  margin-bottom: 1em;
  font-size: 1em;
  line-height: 1.8em;
}
p:last-child {
  margin-bottom: 0;
}

ul,
li {
  position: relative;
  display: inline-block;
}

article ul {
  position: relative;
  float: left;
  margin-bottom: 1em;
  width: 100%;
}
article li {
  position: relative;
  float: left;
  clear: both;
  padding-left: 1.5em;
  display: list-item;
  margin-bottom: 0.4em;
  font-size:1.1em;
  font-weight: 500;
}
article li:before {
  content: "";
  font-size: 0.6em;
  position: absolute;
  left: 0;
  top: 0.9em;
  width: 1em;
  height: 1em;
  background-color: #e3a72b;
}

article a {
  color: #000;
}
blockquote {
  position: absolute;
  right: -2.6em;
  float: left;
  padding: 0;
  margin: 0;
  display: block;
  font-size: 1.4em;
  line-height: 1.3em;
  width: 6.6em;
  color: #c6c6c6;
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
  -webkit-transform-origin: top right;
  -ms-transform-origin: top right;
  transform-origin: top right;
}

img {
  position: relative;
  float: left;
  width: 100%;
  display: block;
}

section,
header,
main,
footer,
nav,
article {
  position: relative;
  float: left;
  width: 100%;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
main {
  margin-bottom: 5em;
}
article {
  position: relative;
  float: left;
  width: 100%;
  margin: 0;
  padding: 2em;
}



article img {
  margin-bottom: 1em;
  height: auto !important;
}

/* blocks*/

.container {
  position: relative; float: left; width: 100%; display: block;
  transition: -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1);
  -webkit-transition: -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1);
  -o-transition: transform 0s cubic-bezier(0.77, 0, 0.175, 1);
  transition: transform 0s cubic-bezier(0.77, 0, 0.175, 1);
  transition: transform 0s cubic-bezier(0.77, 0, 0.175, 1),
    -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1);
  opacity: 0;
  overflow: hidden;
}
.animate .container {
  opacity: 1;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.animate .loader {
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.b {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.b25 {
  width: 25%;
}

.b75 {
  width: 75%;
}
.b70 {
  width: 70%;
}
.b50 {
  width: 50%;
}
.b40 {
  width: 40%;
}
.b45 {
  width: 45%;
}
.b30 {
  width: 30%;
}
.b33 {
  width: 33.33%;
}
.b35 {
  width: 35%;
}
.b66 {
  width: 66.66%;
}
.b100 {
  width: 100%;
}

.viceversa {
  float: right;
}

.videowrapper,
.videoWrapper,
.vimeoWrapper {
  position: relative;
  float: left;
  width: 100%;
  padding-bottom: 56.25%;
  margin-bottom: 2em;
  height: 0;
}
.videowrapper iframe,
.videoWrapper iframe,
.vimeoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.videoWrapperheader {
  position: relative;
  float: left;
  width: 50%;
  margin-left: 25%;

  padding-bottom: 50%;
  margin-bottom: 3em;
  height: 0;
}
.videoWrapperheader iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.360wrapper {
  position: relative;
  float: left;
  width: 100%;
  padding-bottom: 56.25%;
  margin-bottom: 2em;
  height: 0;
}
.360wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.middle {
  left: 50%;
  top: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}
.vmiddle {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.acenter {
  text-align: center;
}
.z {
  z-index: 10;
}
.ontop {
  position: absolute;
  top: 0;
  left: 0;
}

/* basics */

h1,
h2,
h3,
h4,
h5,
h6 {
  position: relative;
  float: left;
  width: 100%;
  font-family: "Ubuntu", sans-serif, Arial, Helvetica;
  font-weight: 500;
  line-height: 1.4em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
h1 {
  font-size: 2em;
  line-height: 1.1em;
  margin-bottom: 1em;
  padding: 0 10%;
}
h2 {
  font-size: 1.4em;
  margin-bottom: 2em;
  margin-top: -1em;
}
h3 {
  font-size: 1.15em;
  margin-bottom: 0.8em;
  margin-top: 0.4em;

}
h4 {
  font-size: 1.6em;
  line-height: 1.3em;
  margin-bottom: 0.8em;
  margin-top: 0.3em;

} /* use cases*/

/* elements*/


/*

.hamburger {
  position: absolute;
  display: block;
  right: 0;
  transition:margin 0.3s ease;
  margin-right: 2.3em;
  width: 2em;
  top:0;
  margin-top:2.4em;
  font-size: 1.2em;
  cursor: pointer;
  height: 2em;
  padding:  0.1em 0.8em;
}

.hamburger:before {
  content: "";
  position: absolute;
  right: 0;
  width:1.7em;
  height: 0.2em;
  background: #000;
  box-shadow:
    0 0.7em 0 0 #000,
    0 1.4em 0 0 #000;
}
*/


.intro {
  height: 38em;
  background-color: #000;
  position: fixed;
  top: 4.3em;
  left: 0;
  width: 100%;
}

.filters .intro {
  position: absolute;
}
.intro2 {
  position: relative;
  float: left;
  height: 9em;
  background-color: #e3a72b;
  left: 0;
  width: 100%;
}

.intro2 h4 {
  position: absolute;
  bottom: 0.3em;
  width: 100%;
  left: 0;
  text-align: center;
  font-weight: 400;
  color: #fff;
  font-size: 1.5em;
}

.detail .intro {
  background: url(../img/example.jpg) no-repeat center center;
  background-size: cover;
}

.filters .intro {
  background-color: #4bbfbd;
}
.filters .intro::before {
  position: absolute;
  width: 40em;
  height: 40em;
  content: "";
  right: 0;
  bottom: 0;
  background-image: url(../img/home/shape1.png);
  background-position: right bottom;
  background-size: 100%;
  background-repeat: no-repeat;
}
.nummerzoeken .totaalvlak::before {
  position: absolute;
  width: 40em;
  height: 40em;
  content: "";
  right: 0;
  bottom: 0;
  background-image: url(../img/home/shape1.png);
  background-position: right bottom;
  background-size: 100%;
  background-repeat: no-repeat;
}
.nummerzoeken .totaalvlak::after {
  position: absolute;
  width: 20em;
  height: 80em;
  content: "";
  left: 0;
  top: 0;
  z-index: 1;
  background-image: url(../img/home/shape3.png);
  background-position: left top;
  background-size: 100%;
  background-repeat: no-repeat;
}
.ster {
  position: absolute;
  width: 1em;
  height: 1em;
  font-size: 1.4em;
  bottom: 5em;
  right: 1.5em;
  color: #fff;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.ster i {
  color: #fff;
  position: relative;
  float: left;
}
.sheet {
  margin-top: 25em;
  background-color: #fff;
  margin-bottom: 4em;
}

.filters .sheet2 {
  margin-top: 4em;
}

.nummer {
  position: absolute;
  width: 12em;
  text-align: center;
  height: 1em;
  font-weight: 700;
  font-size: 1.8em;
  bottom: 6.65em;
  left: 50%;
  margin-left: -6em;
  color: #fff;
  text-shadow: 2px 2px 20px #000;
  text-align: center;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.intro h4 {
  position: absolute;
  width: 100%;
  height: auto;
  font-weight: 700;
  padding: 0 1.5em;
  font-size: 1.8em;
  bottom: 3.6em;
  left: 0%;
  margin-left: 0;
  color: #fff;
  text-align: center;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.intro h4 i {
  margin-left: 1em;
  font-size: 0.8em;
  line-height: 3em;
}

.nummer i {
  display: inline-block;
  position: relative;
  float: none;
}
.nummer div {
  display: inline-block;
  position: relative;
  float: none;
  width: 7em;
  padding: 0 1em;
}

.km {
  display: inline-block;
  font-size: 0.7em;
  width: auto;
  height: 2em;
  line-height: 2em;
  text-align: center;
  font-weight: 700;
}
.duur {
  display: inline-block;
  font-size: 0.7em;
  width: auto;
  height: 2em;
  line-height: 2em;
  text-align: center;
  font-weight: 700;
}



.logo3 {
  position: absolute;
  display: block;
  width: 4em;
  cursor: pointer;
  height: 4em;
  left: 50%;
  text-align: center;
  top: 0em;
  margin-left: -2em;
  background-color: #000;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  background-image: url(../img/via_logo.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.back {
  position: relative;
  float: left;
  cursor: pointer;
  width: 5em;
  height: 4em;
  top: 0;
  text-align: center;
  color: #fff;
  display: none;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  cursor: pointer;
}
.back::after {
  font-family: "via";
  content: "\e901";
  line-height: 3.4em;
  font-size: 1.2em;
  width: 100%;
  text-align: center;
}


.sticky header .back {
  color: #000 !important;
}

.licht .intro .nummer,
.licht .intro .ster i,
.licht header .back,
.licht header .km,
.licht header .duur {
  color: #000;
}

.sticky .intro .ster {
  opacity: 0;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
}

/*
.videoWrapper{border: 1px solid #9C9C9C; transform: translateZ(0); overflow: hidden; height: 12em; position: relative; }
.videoWrapper:after{position: absolute; width: 100%; height: 100%; background-color: #fff; content: ""; pointer-events:none;}
.videoWrapper:before{position: absolute; font-family: "via"; content: "\e914"; color: #9C9C9C; z-index: 2; font-size: 4em; left:50%; top:50%; margin-left: -0.6em; margin-top: -1em; width: 1.2em; text-align: center; height:2em;  line-height: 2em; pointer-events:none;}
*/
.inleiding {
  overflow: hidden;
  padding-bottom: 1em;
  margin-bottom: 2em;
  max-height: auto;
  -webkit-transition: max-height 0.5s ease-out;
  -o-transition: max-height 0.5s ease-out;
  transition: max-height 0.5s ease-out;
}
/*
.inleiding::after{
  position: absolute; content: ""; width: 100%; height: 8em; left:0; bottom: 0; opacity: 1; transition:opacity 0.5s ease;
  background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.88) 71%, rgba(255,255,255,1) 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(71%, rgba(255,255,255,0.88)), color-stop(100%, rgba(255,255,255,1)));
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.88) 71%, rgba(255,255,255,1) 100%);
  background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.88) 71%, rgba(255,255,255,1) 100%);
  background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.88) 71%, rgba(255,255,255,1) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.88) 71%, rgba(255,255,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0 );
 }
 */
.down {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  font-size: 0.7em;
  height: 3em;
  cursor: pointer;
  line-height: 4em;
  font-family: "via";
  content: "\e902";
  color: #000;
  z-index: 5;
  text-align: center;
  opacity: 1;
  -webkit-transition: opacity 0.5s ease;
  -o-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
}
.down:after {
  font-family: "via";
  content: "\e902";
  color: #000;
}
.inleidingopen .inleiding {
  max-height: auto;
  -webkit-transition: max-height 1.4s ease;
  -o-transition: max-height 1.4s ease;
  transition: max-height 1.4s ease;
}
.inleidingopen .inleiding::after {
  opacity: 0;
}
.inleidingopen .down {
  opacity: 0;
}

article ul {
  margin-bottom: 1.4em;
}

.detail h2 {
  color: #e3a72b;
}

.detail h3 {
  color: #e3a72b;
}

.landings.detail h2 a{
  background-color: #e3a72b;
  padding: 0.5em 2em; color: #fff; font-weight: 700;
}

.events {
}
.events a {
  position: relative;
  float: left;
  width: 100%;
  margin-bottom: 2em;
}
.events div {
  position: absolute;
  box-sizing: content-box;
  left: 0;
  top: 0;
  min-height: 3em;
  line-height: 1em;
  padding: 1.1em 1.2em;
  font-weight: 700;
  color: #fff;
  width: 2em;
  z-index: 2;
  background-color: #e3a72b;
}


.events span {
  position: relative;
  font-size: 1em;
  font-weight: 700;
  float: left;
  width: 100%;
  padding: 1em 1em 1em 5.8em;
  line-height: 1.2em;
  min-height: 5.2em;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #f0dfc3;
}

.events a span h3{position: relative; float: left; width: 100%; text-align: left; font-size: 1.2em; margin: -0.2em 0 0 0; 
 text-overflow: ellipsis;
  overflow: hidden; 
  line-height: 1.4em;
  height: 1.4em; 
  white-space: nowrap;}
.events a span h4{position: relative; float: left; width: 80%; font-weight: 400; text-align: left; font-size: 1em; margin:-0.1em 0 0 0; 
   text-overflow: ellipsis;
   white-space: nowrap;
  overflow: hidden; 
  line-height: 1.4em;
  height: 1.4em;
  }
.events a.bigevent, .events a.bigevent span {min-height: 11em;}
.events a.bigevent span h4{position: relative; float: left; width: 100%; font-weight: 400; text-align: left; font-size: 1em; margin:0em 0 0 0; 
   text-overflow: none;
  overflow: visible; 
  white-space:normal;
  height: auto;
  }
.events a.bigevent span h3{font-size: 1.4em;margin-bottom: 0.1em;}
.events a span.eventplaatsnaam{position: absolute; width: auto; right: 0; bottom: 0; line-height: 1em; font-size: 0.8em; font-weight: 400; min-height: 1em; overflow: visible; background: none;}
.events div.datetill{
  display: none;
  position: absolute;
  left: 0;
  top: 5em;
  min-height: 3em;
  line-height: 1em;
  padding: 2em 1.2em 1em;
  font-weight: 700;
  color: #fff;
  width: 2em;
  z-index: 2;
  background-color: #e3a72b;
}
.events a.bigevent div.datetill{display: block;}

.events a.bigevent div.datetill::after{position: absolute; content: ""; height: 1.6em; width: 2px; background-color: #fff; left: 50%; top:-0.3em; margin-left: -1px;}

#event1 div {
  background-color: #e3a72b;
}
#event2 div {
  background-color: #18a6b8;
}
#event3 div {
  background-color: #e33e42;
}

article .btn {
  position: relative;
  float: left;
  width: 100%;
  padding: 0 2em;
  margin-bottom: 2em;
  height: 2.8em;
  line-height: 2.6em;
  clear: both;
  text-align: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.1em;
  font-weight: 700;
  background-color: #e3a72b;
  color: #fff;
  border-radius: 1.7em;
}
article .btn::after {
  position: absolute;
  right: 1.6em;
  top: 0;
  height: 100%;
  font-family: "via";
  font-size: 0.84em;
  line-height: 3.2em;
  content: "\e903";
}

/*ACCORDION */

.accordion {
  position: relative;
  float: left;
  width: 100%;
  margin-bottom: 1.5em;
  -webkit-user-select: none; /* Safari */ /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
.accordion dt,
.accordion dd {
  position: relative;
  float: left;
  padding: 0.3em 2em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  border-bottom: 0;
}

.accordion dd {
  border-top: 0;
  font-size: 1em;
  margin-bottom: 0.5em;
  padding: 0.5em 1.7em;
}
.accordion dt span,
.accordion dd span {
  display: block;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.1em;
  line-height: 1.4em;
  color: #e3a72b;
  font-weight: 700;
  margin-left: -1.4em;
  padding-left: 1.05em;
}
.accordion dt span::before {
  content: "\e919";
  font-family: "via";

  position: absolute;
  left: 0em;
  padding: 0;
  font-size: 0.7em;

  font-weight: 100;
  border-radius: 2px;
  width: 1em;
  height: 1.4em;
  line-height: 1.4em;
  text-align: center;

  margin-top: 0.25em;
}

.accordion dd:last-of-type {
  position: relative;
}
.accordion dt.inspring,
.accordion dd.inspring {
  padding: 0.3em 2em 0.3em 3.6em;
}
.accordion dt.inspring span::before {
  left: 1.6em;
}
.accordion dt.active2 span::before {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-transform-origin: 38% 58%;
  -ms-transform-origin: 38% 58%;
  transform-origin: 38% 58%;
}

.accordion h4 {
  text-align: left;
  font-size: 1.1em;
}
.mapi {
  position: relative;
  width: 100%;
  height: 18em;
  padding: 0;
  display: block;
  float: left;
  overflow: hidden;
}
#map2 {
  width: 100%;
  height: 22em;
  top: -2em;
}

.digitalis {
  margin-top: 1em;
  border: 1px solid #9c9c9c;
  margin-bottom: 2em;
}
.digitalis a {
  position: relative;
  float: left;
  background-image: url(../img/digitalis.jpg);
  background-size: 14em auto;
  margin-bottom: 0;
  line-height: 1.3em;
  padding: 1.6em 0 1.8em;
  background-position: left;
  background-repeat: no-repeat;
}
.digitalis div {
  position: relative;
  float: left;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 10em;
  padding-right: 3em;
}
.digitalis span {
  position: relative;
  float: left;
  font-weight: 700;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 10em;
  padding-right: 2em;
}

.digitalis a::after {
  position: absolute;
  right: 1.6em;
  top: 50%;
  margin-top: -1.5em;
  height: 2em;
  font-family: "via";
  font-size: 0.84em;
  line-height: 3.2em;
  content: "\e903";
}

.digitalis .videoWrapper {
  margin: 0;
}

.floatright {
  float: right;
}
.floatright a {
  float: right;
}
.contact {
  padding-top: 1.2em;
  margin-top: 1em;
}
.contact:before {
  padding: 0;
  position: absolute;
  top: 0;
  content: "";
  left: 0;
  width: 100%;
  height: 1px;
  border-top: 1px solid #9c9c9c;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  padding: 0 2em 0;
  margin-left: -2em;
}

.wegbutton a {
  font-weight: 500;
  margin-top: 1.6em;
}
.wegbutton a i {
  font-size: 0.8em;
  margin-left: 0.6em;
}

.website {
  padding: 2em 0;
  background-color: #e3a72b;
}
.website a {
  font-weight: 500;
  color: #fff;
  text-align: center;
  position: relative;
  float: left;
  width: 100%;
}

.prev {
  position: relative;
  float: left;
  width: 100%;
  line-height: 2.8em;
  background-color: #000;
  border-right: 1px solid #fff;
  font-weight: 500;
  text-align: center;
  color: #fff;
  font-size: 1.4em;
}
.prev i {
  position: absolute;
  left: 2em;
  font-size: 0.6em;
  font-weight: 400;
  line-height: 4.8em;
}
.next {
  position: relative;
  float: left;
  width: 100%;
  line-height: 2.8em;
  background-color: #000;
  border-left: 1px solid #fff;
  font-weight: 500;
  text-align: center;
  color: #fff;
  font-size: 1.4em;
}
.next i {
  position: absolute;
  right: 2em;
  font-size: 0.6em;
  font-weight: 400;
  line-height: 4.8em;
}

.slideshow {
  margin: 1em 0 1em;
}

.slidernext {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 1.5em;
  cursor: pointer;
  color: #fff;
  z-index: 2;
}
.sliderprev {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 1.5em;
  cursor: pointer;
  color: #fff;
  z-index: 2;
}

.home .logo {
  margin-top: 2em;
  left: 0em;
  margin-left: 2em;
  -webkit-transition: margin 0.2s ease;
  -o-transition: margin 0.2s ease;
  transition: margin 0.2s ease;
}
.home.sticky .logo {
  margin-top: 0em;
  left: 0em;
  margin-left: 0;
}
.home .back {
  display: none;
}


.topper .block {
  position: relative;
  float: left;
  height: 50vh;
  min-height: 350px;
}
.topper .block span {
  font-weight: 500;
  color: #fff;
  font-size: 1.5em;
  line-height: 1.3em;
  position: absolute;
  bottom: 16%;
  left: 50%;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.one {
  width: 100%;
  background-color: #4bbfbd;
  background-image: url(../img/home/shape1.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left bottom;
}
.two {
  width: 50%;
  background-color: #ef6033;
  background-image: url(../img/home/shape2.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left top;
}
.tree {
  width: 50%;
  background-color: #ad831f;
  background-image: url(../img/home/shape3.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left top;
}
.topper .block.one span {
  font-size: 1.8em;
}
.one .icon {
  position: absolute;
  top: 45%;
  left: 50%;
  width: 17em;
  height: 8.5em;
  background-image: url(../img/home/vind.png);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left bottom;
}
.two .icon {
  position: absolute;
  top: 45%;
  left: 50%;
  width: 7em;
  height: 7em;
  background-image: url(../img/home/route.png);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left bottom;
}
.tree .icon {
  position: absolute;
  top: 45%;
  left: 50%;
  width: 4.5em;
  height: 7em;
  background-image: url(../img/home/nummer.png);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left bottom;
}

small {
  font-size: 1em;
  font-weight: 300;
}

.home .events {
  padding: 1.3em 2em 2em;
}

.allevents {
  padding-top: 2em;
  background-color: #fff;
}

.home h3 {
  text-align: center;
}

.actueel {
  padding: 2em 2em 3.5em;
  background-color: #ef6033;
}
.actueel .social {
  text-align: center;
  margin-top: 0.6em;
  position: relative;
  float: left;
}
.actueel .social a {
  text-align: center;
  position: relative;
  display: inline-block;
  font-size: 2.3em;
  margin: 0 0.4em;
  color: #fff;
}

.download {
  padding: 2.8em 2em 3.8em;
  background-color: #71CDC2;
}
.download h4 {
  margin-bottom: 1.3em;
  margin-top: 0;
}

.appstores {
  text-align: center;
}
.appstores a {
  width: 8em;
  margin: 0 1em;
  position: relative;
  display: inline-block;
}

.bottommenu {
  padding: 4.5em 2em 3.5em;
  background-color: #37555e;
}
.bottommenu a {
  color: #fff;
  font-weight: 500;
  text-align: center;
  position: relative;
  float: left;
  width: 100%;
  font-size: 1.2em;
  margin: 0 0 1em;
}

footer {
  background-color: #000;
  color: #fff;
  padding: 1em 2em;
}
footer a {
  color: #e3a72b;
}

.footleft {
  position: relative;
  float: left;
}
.footright {
  position: relative;
  float: right;
  text-align: right;
}

.aboutcontainer {
  width: 50%;
  display: block;
  overflow: hidden;
}
.topperabout {
  position: relative;
  float: left;
  height: 100vh;
  min-height: 700px;
  background: url(../img/landscape.jpg) no-repeat center center;
  background-size: cover;
}

.topperabout article {
  position: absolute;
  width: 84%;
  left: 8%;
  bottom: 3%;
  z-index: 5;
}
.home h1 {
  text-align: left;
  width: 100%;
  padding: 0;
}
.topperabout h1 {
  color: #fff;
}
.topperabout p {
  color: #fff;
  font-size: 1.15em;
}

.moredown {
  position: relative;
  float: left;
  color: #fff;
  font-size: 0.8em;
  margin-top: 2em;
  cursor: pointer;
}

body.home {
  background-color: #fff;
}

.bottomabout article {
  position: relative;
  width: 100%;
  float: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 3em 8%;
}
.bottomabout h2 {
  text-align: left;
  width: 100%;
  padding: 0;
  text-align: left;
  margin: 1em 0 1em;
  font-size: 1.4em;
}
.home .bottomabout h1 {
  font-size: 2em;
  text-align: left;
}
.bottomabout p {
  color: #000;
}

.navtop {
  position: fixed;
  top: 0;
  left: 100%;
  background-color: #000;
  height: 100%;
  min-height: 600px;
  padding: 3.2em 4em;
  width: 27em;
  z-index: 99;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: -webkit-transform 0.4s ease;
  transition: -webkit-transform 0.4s ease;
  -o-transition: transform 0.4s ease;
  transition: transform 0.4s ease;
  transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.navtop span {
  position: relative;
  float: left;
  width: 100%;
  margin-bottom: 3em;
}
.navtop span a {
  font-size: 1.4em;
  font-weight: 500;
  color: #fff;
  position: relative;
  float: left;
  width: auto;
  clear: both;
  line-height: 2.2em;
}
.navtop .socialsmall {
  position: relative;
  float: left;
  width: 100%;
}
.navtop .socialsmall a {
  position: relative;
  float: left;
  font-size: 2em;
  color: #fff;
  margin-right: 1em;
}
.navtop .closenav {
  color: #fff;
  position: absolute;
  right: 1.8em;
  top: 1.8em;
  cursor: pointer;
  font-size: 1.8em;
}

.navtop .socialsmall a:hover,
nav span a:hover,
.navtop .closenav:hover {
  color: #4bbfbd;
}

.home .actueel h3 {
}
/*
.containerOut{-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0); -webkit-transition:-webkit-transform 0.4s ease; transition:-webkit-transform 0.4s ease; -o-transition:transform 0.4s ease; transition:transform 0.4s ease; transition:transform 0.4s ease, -webkit-transform 0.4s ease; position: relative; float: left; width: 100%;}
.navopen .containerOut{-webkit-transform: translateX(-27em);-ms-transform: translateX(-27em);transform: translateX(-27em); -webkit-transition:-webkit-transform 0.4s ease; transition:-webkit-transform 0.4s ease; -o-transition:transform 0.4s ease; transition:transform 0.4s ease; transition:transform 0.4s ease, -webkit-transform 0.4s ease;}
.navopen .hamburger{opacity: 0; -webkit-transform:translateY(-150%); -ms-transform:translateY(-150%); transform:translateY(-150%); -webkit-transition:opacity 0.3s ease, -webkit-transform 0s ease 0.3s; transition:opacity 0.3s ease, -webkit-transform 0s ease 0.3s; -o-transition:opacity 0.3s ease, transform 0s ease 0.3s; transition:opacity 0.3s ease, transform 0s ease 0.3s; transition:opacity 0.3s ease, transform 0s ease 0.3s, -webkit-transform 0s ease 0.3s;}
.navopen .navtop{-webkit-transform: translateX(-27em);-ms-transform: translateX(-27em);transform: translateX(-27em); -webkit-transition:-webkit-transform 0.4s ease; transition:-webkit-transform 0.4s ease; -o-transition:transform 0.4s ease; transition:transform 0.4s ease; transition:transform 0.4s ease, -webkit-transform 0.4s ease;}
*/


.fitlers .containerIn .sheet {
  pointer-events: auto;
}

.fitlers .containerIn .sheet * {
  pointer-events: auto;
}
.filters h3 {
  text-align: center;
  margin-top: -0.5em;
  margin-bottom: 1em;
  font-weight: 400;
}
.limburgmap {
  position: relative;
  float: left;
  width: 100%;
  pointer-events: auto;
}
.limburgmap svg {
  position: relative;
  float: left;
  pointer-events: auto;
}
.limburgmap img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.limburgmap .after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-image: url(../img/map2/overlay.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left top;
}

#map1 {
  cursor: pointer;
}
#map1:hover {
  cursor: pointer;
  opacity: 1;
}
.overlay {
  cursor: pointer;
}

.vlak {
  opacity: 0;
  -webkit-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
}
.vlak:hover {
  opacity: 0.2;
}
.extrabtn {
  background-color: #000;
  cursor: pointer;
  position: relative;
  float: left;
  width: 100%;
  line-height: 4em;
  color: #fff;
  font-size: 0.9em;
  display: none;
  pointer-events: auto;
}
.extrabtn h4 {
  margin: 1em 0 1em;
  font-size: 1.3em;
  font-weight: 500;
}
.extrabtn h4 span {
  font-weight: 500;
}
.extrabtn h4 i {
  margin-left: 1em;
  font-size: 0.4em;
  line-height: 3em;
}

.route .extrabtn {
  background-color: #258a8b;
}
.on1 .extrabtn,
.on2 .extrabtn,
.on3 .extrabtn,
.on4 .extrabtn,
.filteron .extrabtn,
.filteron .extrabtn,
.filteron .extrabtn {
  display: block;
}

.on2 .extrabtn {
  background-color: #33b6c9;
}
.on3 .extrabtn {
  background-color: #e8633f;
}
.on4 .extrabtn {
  background-color: #b6427f;
}
.on1 .extrabtn {
  background-color: #2C8547;
}
.on2 #vlak1 {
  opacity: 1;
}
.on3 #vlak2 {
  opacity: 1;
}
.on4 #vlak3 {
  opacity: 1;
}
.on1 #vlak4 {
  opacity: 1;
}
.select {
  max-height: 4.4em;
  overflow: hidden;
  border: 1px solid #c3c3c3;
  margin-bottom: 2em;
  border-radius: 3px;
  pointer-events: auto;
  -webkit-transition: max-height 0.5s ease;
  -o-transition: max-height 0.5s ease;
  transition: max-height 0.5s ease;
}
.select span {
  position: relative;
  float: left;
  width: 100%;
  max-height: 3.2em;
  font-size: 1.4em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  padding: 1em;
}
.select span b {
  font-weight: 400;
  width: 100%;
  text-align: center;
  position: relative;
  float: left;
}
.select span i {
  position: absolute;
  right: 2em;
  line-height: 2em;
  font-size: 0.5em;
}
.selecton .select {
  max-height: 45em;
  -webkit-transition: max-height 0.5s ease;
  -o-transition: max-height 0.5s ease;
  transition: max-height 0.5s ease;
}
.filtergroup {
}
.filtergroup div {
  position: relative;
  float: left;
  width: 33.333%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 1em;
  color: #9c9c9c;
  cursor: pointer;
  pointer-events: auto;
}
.filtergroup div i {
  position: relative;
  float: left;
  width: 100%;
  text-align: center;
  font-size: 3.6em;
  line-height: 1.8em;
}
.filtergroup div span {
  text-align: center;
  width: 100%;
  position: relative;
  float: left;
  overflow: hidden;
  line-height: 1.2em;
  font-weight: 500;
  min-height: 1.2em;
  margin-top: 0.6em;
}

.filtergroup div span em {
  font-weight: 500;
}

@-webkit-keyframes moveAcross {
  0% {
    top: -120%;
  }
  3% {
    top: 0%;
  }
  50% {
    top: 0%;
  }
  53% {
    top: 120%;
  }

  100% {
    top: 120%;
  }
}

@keyframes moveAcross {
  0% {
    top: -120%;
  }
  3% {
    top: 0%;
  }
  50% {
    top: 0%;
  }
  53% {
    top: 120%;
  }

  100% {
    top: 120%;
  }
}
/*

.filtergroup div span em:first-child{position:absolute; top:-120%; -webkit-animation: moveAcross 10s ease infinite; animation: moveAcross 10s ease infinite; width: 100%; text-align: center; left:0;}
.filtergroup div span em:last-child{position:absolute; top:120%; -webkit-animation: moveAcross 10s ease 5s infinite; animation: moveAcross 10s ease 5s infinite; width: 100%; text-align: center; left:0;}

*/
.filtergroup div span {
  overflow: visible;
}
.filtergroup div span em {
  position: relative;
  float: left;
  width: 100%;
  clear: both;
}

.filtergroup div span.icon {
  height: 6em;
}
.filtergroup .group1 {
  padding-bottom: 2.6em;
}
.filtergroup .group2 div:first-child {
  margin-left: 16.66666%;
}
.filtergroup .group2 {
  margin-top: -2em;
  padding-bottom: 2em;
}
.on2 .select {
  border-color: #33b6c9;
}
.on3 .select {
  border-color: #e8633f;
}
.on4 .select {
  border-color: #b6427f;
}
.on1 .select {
  border-color: #2C8547;
}
article .radioboxes{box-sizing:border-box; padding: 1em 1em; margin-bottom: 0;}
article .radioboxes li{padding-left: 2.4em; padding-bottom: 1em; cursor: pointer; width: 50%; list-style: none; user-select: none; position: relative; float: left; display: block; box-sizing:border-box; clear: none;}
article .radioboxes li::before{content: ""; font-size: 1em; position: absolute; left: 1px; pointer-events:none; top: 0; width: 1em; height: 1em;background-color:#fff;  border:5px solid #fff; outline: 2px solid #000;}
article .radioboxes li:nth-child(2)::before{ outline: 2px solid #33b6c9;}
article .radioboxes li:nth-child(3)::before{ outline: 2px solid #e8633f;}
article .radioboxes li:nth-child(4)::before{ outline: 2px solid #b6427f;}
article .radioboxes li:nth-child(1)::before{ outline: 2px solid #2C8547;}



.on2 article .radioboxes li:nth-child(2)::before{ background-color:  #33b6c9;}
.on3 article .radioboxes li:nth-child(3)::before{ background-color:  #e8633f;}
.on4 article .radioboxes li:nth-child(4)::before{ background-color:  #b6427f;}
.on1 article .radioboxes li:nth-child(1)::before{ background-color:  #2C8547;}


.filtergroup div.actief,
.filtergroup div.eerstekeeractief {
  color: #000;
}

.on2.filters .intro {
  background-color: #33b6c9;
}
.on3.filters .intro {
  background-color: #e8633f;
}
.on4.filters .intro {
  background-color: #b6427f;
}
.on1.filters .intro {
  background-color: #2C8547;
}

.filtergroup .icon section {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
  opacity: 0.5;
}
.filtergroup .actief .icon section,
.filtergroup .eerstekeeractief .icon section {
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
  -webkit-filter: grayscale(0%);
  opacity: 1;
}
.via-cultuur {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../img/themas/4.png);
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
}
.via-voedsel {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../img/themas/2.png);
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
}
.via-landschap {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../img/themas/1.png);
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.via-design {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../img/themas/6.png);
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.via-innovatie {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../img/themas/5.png);
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.via-archeologie {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../img/themas/3.png);
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.intro2.on2 {
  background-color: #e33e42 !important;
}
.intro2.on3 {
  background-color: #2fbe86 !important;
}
.intro2.on4 {
  background-color: #0f98cd !important;
}

.line {
  margin-bottom: 0.4em;
  height: 1px;
  display: block;
  border-bottom: 1px solid #e4e4e4;
}
.reset {
  position: absolute;
  display: block;
  right: 0;
  -webkit-transition: margin 0.3s ease;
  -o-transition: margin 0.3s ease;
  transition: margin 0.3s ease;
  margin-right: 0em;
  width: 1.6em;
  color: #fff;
  top: 0;
  margin-top: 0em;
  font-size: 1.4em;
  cursor: pointer;
  height: 2.8em;
  line-height: 2.8em;
  padding: 0.1em 0.8em;

  background-size: auto 100%;
  background-repeat: no-repeat;
}
.sticky .reset {
  color: #000;
}

.activefilters {
  text-align: center;
}
.activefilters span {
  display: inline-block;
  text-align: center;
  font-size: 1.8em;
  margin-top: 0.8em;
}
.activefilters span i {
  position: relative;
  float: left;
  margin: 0 0.3em;
}

.overview .sheet {
  margin-top: 2em;
  background-color: #fff;
}
.overview .sheet a img {
  margin-bottom: 0;
}
.overview .sheet a {
  margin-bottom: 3em;
  position: relative;
  float: left;
  width: 100%;
}
.overview .sheet a .blad {
  position: relative;
  float: left;
  width: 20em;
  margin-top: -3em;
  margin-left: -10em;
  color: #fff;
  height: auto;
  left: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 1.5em 2em;
  background-color: #e3a72b;
}
.overview .sheet a .blad h2 {
  font-size: 1.8em;
  position: relative;
  float: left;
  margin: 0 0 0 0;
  line-height: 1.2em;
}
.overview .sheet a .blad h4 {
  font-size: 1.2em;
  position: relative;
  float: left;
  margin: 0.8em 0 0.5em 0;
  line-height: 1.2em;
  font-weight: 400;
}
.overview .sheet a .blad h4 i,
.overview .sheet a .blad h4 del {
  position: relative;
  display: inline-block;
  margin: 0 0.4em;
}
.overview .sheet3 {
  margin-top: 25em;
}

.nummerzoeken {
  background-color: #ad831f;
}
.nummerzoeken .totaalvlak {
  min-height: 20em;
  height: 100vh;
}
.nummerzoeken .totaalvlak form {
  position: absolute;
  width: auto;
  height: auto;
  top: 50%;
  z-index: 10;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.nummerzoeken .totaalvlak form h3 {
  font-size: 2em;
  text-align: center;
  color: #fff;
}

.nummerzoeken .totaalvlak form input[type="number"] {
  width: 7.3em;
  display: inline-block;
  line-height: 2em;
  font-size: 2em;
  text-align: center;
  font-weight: 500;
  border: 0;
  border-radius: 3px;
  margin-bottom: 0.5em;
}
.nummerzoeken .totaalvlak form input[type="submit"] {
  width: 14.6em;
  display: inline-block;
  line-height: 3em;
  height: 3em;
  font-size: 1em;
  text-align: center;
  font-weight: 500;
  border: 0;
  border-radius: 3px;
  background-color: #000;
  color: #fff;
}
input[type="number"] {
  -moz-appearance: textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.route .intro,
.route .intro2 {
  background-color: #ef6033;
}
.route .filtergroup {
  margin-top: 4em;
  margin-bottom: 2em;
}
.route .filtergroup div.actief {
  color: #ef6033;
}
.route .controls a {
  height: 3em;
}
.route .controls a span {
  position: absolute;
  float: none;
  left: 0;
  top: 0;
  width: 100%;
  line-height: 1.2em;
  height: 1.2em;
  text-align: center;
  font-size: 2em;
}
.route .controls a span del {
  line-height: inherit;
  margin: 0;
  position: relative;
  display: inline-block;
  font-size: 0.6em;
}
.route .dashes {
  clear: both;
  display: block;
  margin: 1em auto;
  width: 1px;
  height: 40px;
  border-left: 1px dashed #000;
}
.route .startend {
  display: block;
  margin: 1em auto;
  width: 7em;
  border: 1px solid #000;
}

.kalender .events div {
  color: #fff;
  padding: 1.1em 1.2em;
}

.kalender.detail .events div {
   padding: 0.8em 1.2em;
}

.kalender.detail .events #datum2{display: none;}
.kalender.detail .bigevent .events #datum1{margin-left: -2.8em; padding-right: 1.8em;}
.kalender.detail .bigevent .events #datum2{margin-left: 2.2em; padding-left: 1.8em; display: block;}

.kalender.detail .bigevent .events #datum2::after{position: absolute; content: ""; width: 1.6em;
height: 2px;
background-color: #fff;
left: -0.6em;
top: 50%;
margin-left: -1px;}
.kalender.detail h3.subtitel{ text-align:center; margin-top:-1em; margin-bottom:3em; color:#049A01; }
.kalender.detail h2, .kalender.detail h2 a{position: relative; float: left; width: 100%;}
.kalender .events div.datetill{padding: 2em 1.2em 1em;}


.kalender header .events {
  position: absolute;
  left: 50%;
  top: 4.3em;
  margin-left: -2.2em;
  font-size: 0.91em;
  -webkit-transition: -webkit-transform 0.3s ease 0s;
  transition: -webkit-transform 0.3s ease 0s;
  -o-transition: transform 0.3s ease 0s;
  transition: transform 0.3s ease 0s;
  transition: transform 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
}
.kalender.sticky header .events {
  -webkit-transform: translateY(-4.35em);
  -ms-transform: translateY(-4.35em);
  transform: translateY(-4.35em);
  -webkit-transition: -webkit-transform 0.3s ease 0s;
  transition: -webkit-transform 0.3s ease 0s;
  -o-transition: transform 0.3s ease 0s;
  transition: transform 0.3s ease 0s;
  transition: transform 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
}

.kalender h2 a {
  font-weight: 500;
  color: #e3a72b;
}
.kalender h2 a i {
  font-size: 0.7em;
}
.kalender .sheet,
.landings .sheet {
  margin-top: 2em;
}
.kalender .extra {
  margin-bottom: -2em;
}

.appinfo .dwnl {
  text-align: center;
  margin: 1em 0 1em;
}
.appinfo .dwnl a {
  position: relative;
  float: none;
  display: inline-block;
  margin: 0 0.5em;
}
.appinfo .dwnl a.ios {
  width: 10em;
  height: 3em;
  clear: none;
  background: url(../img/ios.png) no-repeat center center;
  background-size: cover;
}
.appinfo .dwnl a.android {
  width: 10em;
  height: 3em;
  background: url(../img/android.png) no-repeat center center;
  background-size: cover;
}
.appinfo h5 {
  font-weight: 500;
  font-size: 1.2em;
  margin: 0 0 0.8em;
}
.appinfo .downloadpdf a {
  position: relative;
  display: inline-block;
  padding: 0 2em;
  background-color: #000;
  border-radius: 1.5em;
  font-size: 1.15em;
  color: #fff;
  font-weight: 500;
  line-height: 2.9em;
}
.appinfo .downloadpdf {
  margin-bottom: 3em;
}

.topperabout::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(../img/home/bg.png);
  z-index: 1;
  background-size: 120% auto;
  background-repeat: no-repeat;
  background-position: left bottom;
}

.kalender h4 {
  margin-bottom: 1.8em;
}

.interessesicons {
  text-align: center;
  height: 4em;
  margin: 2em 0;
}
.interessesicons .icon {
  width: 4em;
  height: 4em;
  margin: 0 0.2em;
  position: relative;
  display: inline-block;
}

.controls {
  overflow: hidden;
}
.home .allevents .toonalles {
  text-align: center;
  margin-top: 0.4em;
  margin-bottom: 1em;
}
.toonalles i {
  font-size: 0.5em;
  margin-left: 1em;
}

.blokken a {
  width: 50%;
  position: relative;
  float: left;
}

.afbeelding_links {
  width: 48%;
  margin-right: 2%;
  position: relative;
  float: left;
}
.afbeelding_rechts {
  width: 48%;
  margin-left: 2%;
  position: relative;
  float: left;
}
.blokken a .afbeelding_links {
  width: 96%;
  margin-right: 4%;
  position: relative;
  float: left;
}
.blokken a .afbeelding_rechts {
  width: 96%;
  margin-left: 4%;
  position: relative;
  float: left;
}
.functie {
  position: relative;
  float: left;
  width: 100%;
  margin: 0;
  text-align: center;
}

.landings .back {
  color: #000;
}

.app .downloadpdf {
  display: none;
}

.ontdekkenVideoBox,
.ontdekken360Box {
  margin-bottom: 2em;
}

.topperabout a{color: #fff;}


.festivia{display: block; height: 100vh; min-height: 46em; overflow: hidden; }
.wp-logged-in .festivia{display: block;}


.festivia .bgfestivia{position: absolute; top: 0; left:0; width: 100%; height: 100%; 
background-image: url(../img/festivia/bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
 }

.festivia .fcontainer{position: absolute; width: 100%; height: 100%; top:0; left: 0;}
.festivia .flogo{position:absolute; width: 22em; top:7em; left: 50%; margin-left: -13em; transform:translateX(-50%); }
.festivia .fbutton{width: 13em; position:absolute;  top:19.5em; left: 50%; margin-left: -18em; transform:translateX(-50%);}
.festivia .fdate{width: 24em;position:absolute;  top:7em; left: 50%; margin-left: 15em; transform:translateX(-50%);}
.festivia .fdown{position: absolute; width: 3em; height: 3em; border-right: 3px solid #000; border-bottom: 3px solid #000; bottom:3em; cursor: pointer; left: 50%; margin-left: 0em; transform:translateX(-50%) rotate(45deg);}
.festivia .farticle{width: 32em; position:absolute;  top:17.5em; left: 50%; margin-left: 11.6em; transform:translateX(-50%);}
.festivia .farticle article p{font-weight: 500; font-family: "Ubuntu", sans-serif, Arial, Helvetica; font-size: 1.1em; line-height: 1.3em;}
.festivia .farticle article p a{font-weight: 500; font-family: "Ubuntu", sans-serif, Arial, Helvetica; font-size: 1.1em; line-height: 1.3em; color: #E5623F;}
.festivia .fkip1{width: 32em;position:absolute;  top:22.5em; left: 50%; margin-left: 32em; transform:translateX(-50%);}
.festivia .fkip2{width: 28em;position:absolute;  top:31.5em; left: 50%; margin-left: -17em; transform:translateX(-50%);}
.festivia .fkip3{width: 30em;position:absolute;  top:28.5em; left: 50%; margin-left: -35em; transform:translateX(-50%);}


/*.testing{ display: none;}
.wp-logged-in .testing{display: block;}*/

.railcontainer{background-color: #D8D8D8; padding: 2em 0; overflow: hidden;}
.railslider{width: calc(100% + 4em); background-color: #D8D8D8;}
.railslider .via-arrowforward{color: #fff; font-size: 1.6em;}
.railslider .slick-list{background:none;}
.railslider a{margin: 0 0 0 2em; position: relative; float: left;}
.railslider .railtitles{position: absolute; bottom: 0em; left: 0em; padding: 1.4em;}
.railslider .railtitles h3{position: relative; float: left; margin: 0; text-align: left; font-weight: 500;  width: auto; font-size: 1em; }
.railslider .railtitles h3 span{
    background-color: #000;
    color: #fff;
    padding: 0.2em 0.4em;
    font-size: 1.2em;
    text-align: left;
    display: inline;
    line-height: 1.4em;
    font-weight: 500;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    -o-box-decoration-break: clone;
    -ms-box-decoration-break: clone;
    white-space: pre-line;
}

.railslider .railtitles h4{position: relative; float: left; display: none;  color: #fff; margin: 0; text-align: left; text-align: left;  margin-top: 0.4em; font-size: 1.1em;}
.railslider .railtitles h4 span{
    text-align: left;
    background-color: #000;
    padding: 0.2em 0.4em;
    display: inline;
    line-height: 1.4em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    -o-box-decoration-break: clone;
    -ms-box-decoration-break: clone;  
    white-space: pre-line;
}

.railslider .slick-prev{display: none!important;}
.railslider .next-arrow{position: absolute;right: 0;margin-right: 4.5em; padding: 0.5em;margin-top: -1em;top: 50%; cursor: pointer;}


.home .blogoverview{background-color: #e4e4e4;}
.blogoverview{padding: 2em 0;text-align: center;}
.blogoverview .blogitems{padding: 1em 1em 0; }
.blogoverview .blogitems a{width: 50%; box-sizing:border-box; padding: 0 1em; position: relative; float: left; margin-bottom: 2em;}
.blogoverview .blogitems a .blogitemtitel, .blogoverview .blogitems a .imgcontainer{position: relative; float: left; width: 100%;}
.blogoverview .blogitems a .imgcontainer label{position: absolute; bottom: 0; right: 0; padding: 0 0.6em; font-size: 0.9em; line-height: 1.4em; background-color: #000; color: #fff;}
.blogoverview .blogitems a .blogitemtitel h2{text-align: left; margin: 0; font-size: 1.1em; padding-top: 0.8em; color: #000;}

.blogbig.blogoverview{padding-top: 5.5em;}
.blogbig.blogoverview .headtitle{position: relative; float: left; width: 100%; text-align: center;font-size: 1.4em; margin-top: 1.3em;}

.blogbig.blogoverview .blogitems a{width: 25%;}


.filterpassive .blogbig.blogoverview .blogitems a:first-child{width: 100%!important;}
.filterpassive .blogbig.blogoverview .blogitems a:first-child .blogitemtitel{position: absolute; bottom: 3em; left:3em; width: calc(60% - 6em);text-align: left; }
.filterpassive .blogbig.blogoverview .blogitems a:first-child .blogitemtitel h2{
  position: relative; float: none; text-align: left; 
  text-align: left; color: #fff;  
  font-size: 2em; 
  background-color: #000;
  padding: 0.2em 0.4em;
  display: inline;
  line-height: 1.4em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  -o-box-decoration-break: clone;
  -ms-box-decoration-break: clone;    
  white-space: pre-line;
}

.filterpassive .blogbig.blogoverview .blogitems a:first-child img{max-height: 30em;object-fit: cover;}

.filterpassive .blogbig.blogoverview .blogitems a:first-child label{font-size: 1.3em;}




.width2{position: relative; width: 80em; float: none; margin: 0 auto;}
.singleblogoverview{background-color: #fff;}
.singleblogoverview header .back{color: #000;}
.singleblogoverview .singleblog{background-color: #fff;padding-top: 4em;}

.singleblog article{padding: 0; margin-top: 2em;}
.singleblog h1{text-align: left; max-width: 10em; position: relative; float: left; font-size: 4em; text-align: left; padding: 0; margin: 0 0 0.6em;}
.singleblogoverview .b{padding: 0 0em;}
.singleblog .headerthumb{margin: 2em 0 3em;}
.singleblogoverview label{position: absolute; left: 0; transform: rotate(90deg); transform-origin: bottom left; top:5.6em; text-transform: lowercase; font-size: 1.3em; padding: 0 0.6em;  line-height: 1.6em; background-color: #000; color: #fff;}

.singleblog article h2{position: relative; float: left; width: 100%; text-align: left; margin-top:0.2em ; margin-bottom: 0.5em;}
.singleblog article a{text-decoration: underline; font-weight: inherit;}
.singleblog .introblok, .singleblog .tekst-foto, .singleblog .foto-tekst, .singleblog .tekst-open, .singleblog .tekst-quote, .singleblog .tekst-buttonblok, .singleblog .fotoslideshow, .singleblog .embeddedvideo{margin-bottom: 4em;}
.singleblog .tekst-foto .b50:first-child, .singleblog .tekst-open .b50:first-child, .singleblog .tekst-quote .b50:first-child, .singleblog .tekst-buttonblok .b50:first-child{padding-right: 4em;}
.singleblog .foto-tekst .b50:last-child{padding-left: 4em;}


.singleblog article p{margin-bottom: 1.4em;}
.singleblog .introblok, .singleblog .embeddedvideo{padding: 0 10em; }
.singleblog .embeddedvideo .videoWrapper{margin-bottom: 0;}
.singleblog .introblok p{font-weight: 500; font-size: 1.15em; line-height: 1.8em;}

.singleblog .tekst-quote blockquote{
  position: relative;
right: auto;
float: left;
padding: 0;
margin: 0;
display: block;
font-size: 1em;
line-height: 1.4em;
width: auto;
max-width: 22em;
color:#0259AA;
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);

}

.singleblog .tekst-quote blockquote span{font-weight: 500; font-size: 2.1em;line-height: 1.4em;}
.singleblog .tekst-quote blockquote div{font-weight: 500; font-size: 1em;line-height: 1.4em; margin-top: 2em;}

.singleblog .tekst-buttonblok .btnblok{position: relative; float: left; max-width: 20em; padding: 0.8em 1.3em 1em; line-height: 1.8em; background-color: #942B2B; color: #fff; text-decoration: none;}
.singleblog .tekst-buttonblok .btnblok::after{position: absolute; right: 1em; bottom: 1em;  color: #fff; font-family: "via"; content: "\e903"}
.singleblog .tekst-buttonblok .btnblok span{position: relative; float: left; width: 100%; font-weight: 500; font-size: 1.1em; text-decoration: none;}
.singleblog .tekst-buttonblok .btnblok div{position: relative; float: left; width: calc(100% - 3em); font-weight: 400; font-size: 1.1em; text-decoration: none;}

.singleblogoverview .leesook{background-color: #E4E4E4; padding: 3em 0;}
.singleblogoverview .leesook .b50:first-child{padding-right: 2em;}
.singleblogoverview .leesook .b50:last-child{padding-left: 2em;}

.singleblogoverview .leesook .buttongroup{margin-bottom: 4em; margin-top:5em; }
.singleblogoverview .leesook a .imgcontainer {
    position: relative;
    float: left;
    width: 100%;}
.singleblogoverview .leesook a .blogitemtitel{position: relative; float: left; width: 100%;}
.singleblogoverview .leesook a label{position: absolute; bottom: 0!important; top:auto!important; left:auto!important; right: 0!important; padding: 0 0.6em!important; font-size: 0.9em!important; line-height: 1.4em!important; background-color: #000; color: #fff; transform:none!important; width: auto!important; height: auto;}
.singleblogoverview .leesook a h2{text-align: left; margin: 0; font-size: 1.5em; line-height: 1.1em; font-weight:500; padding-top: 0.8em; color: #000;}

.singleblogoverview .leesook .leesookbtncontainer{padding: 0 10em;}
.singleblogoverview .leesook h3{position: relative; float:  left; width: 100%; text-align: center; font-size: 1.8em; font-weight: 500; margin-bottom: 1.6em;}
.singleblogoverview .leesook .toonalles{left:50%; transform:translateX(-50%); position: absolute; bottom: 0; width: auto; margin-bottom: 0; }

.detail .gezichtenoverview .sheet{margin-top: 0;}
.detail .nomargintop .sheet{margin-top: 0;}
.detail .gezichtenoverview {max-width: 80em!important; width: auto!important; }

.detail .gezichtenoverview ul, .detail .gezichtenoverview li{position: relative; float: left; width: 100%;  list-style: none; display: block; clear: none; margin-bottom: 0;}
.detail .gezichtenoverview li{width: 25%; padding: 1em 1em 1em;}
.detail .gezichtenoverview li:before{display: none;}
.detail .gezichtenoverview {text-align: center;}
.detail .gezichtenoverview li h4, .detail .gezichtenoverview li p{position: relative; float: left; width: 100%; margin: 0; padding: 0; line-height: 1.4em; text-align: left; font-size: 1.2em; margin-bottom: 0.2em;}
.detail .gezichtenoverview li p{font-size: 1em;}
.detail .gezichtenoverview h2{font-size: 1.8em; margin-top: 1em;}
.detail .gezichtenoverview h5{font-size: 1.4em; margin-top: 0em; margin-bottom: 2em; color: #e3a72b; max-width: 36em; display: inline-block; float: none;  }

.over .gezichtenoverview .sheet{margin-top: 0;}
.over .nomargintop .sheet{margin-top: 0;}
.over .gezichtenoverview {max-width: 80em!important; width: auto!important; }

.over .gezichtenoverview ul, .detail .gezichtenoverview li{position: relative; float: left; width: 100%;  list-style: none; display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: stretch; clear: none; margin-bottom: 0;}
.over .gezichtenoverview li{width: 25%; padding: 1em 1em 1em;}
.over .gezichtenoverview li:before{display: none;}
.over .gezichtenoverview {text-align: center;}
.over .gezichtenoverview li h4, .detail .gezichtenoverview li p{position: relative; float: left; width: 100%; margin: 0; padding: 0; line-height: 1.4em; font-size: 1.2em; margin-bottom: 0.2em;}
.over .gezichtenoverview li p{font-size: 1em;}
.over .gezichtenoverview h5{font-size: 1.2em; line-height:1.4em; ;margin-top: 0em; margin-bottom: 2em; color: #e3a72b; max-width: 36em; display: inline-block; float: none;  }


.landings{background-color: #fff; }


.landings .containerOut{width: 100%!important; max-width: 50em;}

.detail .colorblack{color: #000;}

.mailchimp{margin-top: 3em; box-sizing:border-box; padding: 0 3em;}
.mailchimp #mc_embed_signup, .mailchimp #mc_embed_signup form,  .mailchimp #mc_embed_signup div {position: relative; float: left; width: 100%; display: block;}
.mailchimp #mc_embed_signup h2{ font-size: 1.3em; margin-bottom: 1.2em; margin-top: 0;}
.mailchimp #mc_embed_signup p{box-sizing:border-box; padding: 0 3em; text-align: center;}
.mailchimp #mc_embed_signup .mc-field-group{ margin-bottom: 2em;}
.mailchimp #mc_embed_signup .mc-field-group input.email{position: relative; float: left;width: 100%; box-sizing:border-box; padding: 0 1.6em; background-color: #fff; color: #000; font-size: 1em;  font-family: "Ubuntu", sans-serif, Arial, Helvetica; font-weight: 700; border: 0; line-height: 2.6em; height: 2.6em; display: block;}
.mailchimp #mc_embed_signup #mc-embedded-subscribe{position: absolute; right: 0; top:0; display: block; border:0; height: 2.6em; line-height: 2.6em; font-family: "Ubuntu", sans-serif, Arial, Helvetica; font-weight: 700; background-color: #000; color: #fff; padding: 0 2em;}
.filter {margin: 1.6em 0; box-sizing:border-box; padding: 0 1.4em;}
.filter li{display: inline-block; margin: 0 0.6em 1em; }
.filter li a{line-height: 1.5em; font-size: 1em; background-color:#F4AF38; color: #000; padding: 0 0.9em 0.1em; cursor: pointer;}
.no-touch .filter li a:hover{color: #fff; background-color: #000; }
.filter li.active a{color:#fff; background-color: #000; }

/* Landingsdetail */

.widthmega{position: relative; float: none; display: block;margin: 0 auto; width: 100%; max-width: 80em;}
.widthbig{position: relative; float: none; display: block;margin: 0 auto; width: 100%; max-width: 50em;}
.widthsmall{position: relative; float: none; display: block;margin: 0 auto; width: 100%; max-width: 30em;}

.landing-detail{background-color: #fff;}

.landing-detail h1{ color: #e3a72b; margin-top: 0; margin-bottom: 1em;}

.headerimg{position: relative; float: left; width: 100%; display: block; height:auto; margin-bottom: 5em;}
.headerimg img{position: relative; float: left; width: 100%; height: auto; display: block; }

.blocktext{background-color: #fff; margin-bottom: 4em;}

.blocktext .inner h1:last-child{margin-bottom: 0;}

.blockopsomming ul{margin-bottom: 5em;}
.blockopsomming ul li{border-bottom: 1px solid #333; font-size: 1.6em; position: relative; float:  left; width: 100%; text-align: center; line-height: 1.2em; padding: 0.3em 0.2em 0.4em;font-family: "Ubuntu", sans-serif, Arial, Helvetica; font-weight: 500;}
.blockopsomming ul li:last-child{border: 0;}
.blockopsomming ul li::before{display:none}

.blockinschrijven{background-color: #FFEFD5; margin-bottom: 5em;}
.blockinschrijven .inner{padding-top: 4em; padding-bottom:4em;}
.blockinschrijven .btngroup{margin: 2em 0 0; text-align: center;}
.blockinschrijven .btngroup .btn{background-color: #EC653A; width: auto; float: none; display: inline-block;padding: 0 5em;}
.blockinschrijven h2, .blockinschrijven h3, .blockinschrijven h4{color:#000;}

.blockfototekst .btngroup .btn, .blocktekstfoto .btngroup .btn {width: auto; width: auto;float: none;display: inline-block;padding: 0 5em;}

.blockfotofoto{margin-bottom: 5em;}
.blockfotofoto .b50 img{height: 37vw; object-fit:cover;}
.blockfotofoto h2{text-align: left;}

.blocktekstfoto{}
.blocktekstfoto .b50{margin-bottom: 5em;}
.blocktekstfoto .b50:first-child{padding-right: 1em;}
.blocktekstfoto h2{text-align: inherit;}

.blockfototekst{}
.blockfototekst .b50{margin-bottom: 5em;}
.blockfototekst .b50:last-child{padding-left: 1em;}
.blockfototekst h2{text-align: inherit;}

.blockinfo{background-color: #00a3bb; text-align: center; color: #fff; margin-bottom: 5em;}
.blockinfo .inner{padding: 3em 3em 3em;}
.blockinfo .btngroup{margin: 2em 0 0; text-align: center;}
.blockinfo .btngroup .btn{background-color: #EC653A; width: auto; float: none; display: inline-block;padding: 0 5em;}
.blockinfo p{margin-bottom: 1em;}
.blockinfo h2, .blockinfo h3, .blockinfo h4{color: #fff;}
.blockinfo a{color: #fff;}
.blockinfo h3{margin-bottom: 0;}
.blockinfo .firstpart{margin-bottom: 1em; text-align: center;}
.blockinfo .secondpart{text-align: left;}
.blockinfo ul{position: relative; float: left; width: 100%; margin-bottom: 1em;}
.blockinfo ul li{ padding-left: 1em; width: 100%; box-sizing:border-box;}
.blockinfo ul li::before{position: absolute; left: 0; top: 0; content: "•";}

.blockfoto{margin-bottom: 5em; overflow: hidden;}


.topperlaw::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(../img/law3_.jpg);
  z-index: 1;
  background-size: cover;

  background-repeat: no-repeat;
  background-position: center center;
}

.topperlaw h1{margin-bottom: 0.5em;}
.topperlaw h1, .topperlaw p{color: #000;}
.topperlaw .btn{margin: 1em 0 2em; width: auto; padding: 0 5em;}

.iframecontainer iframe{position: relative; float: left; width: 100%;}
/*
.topperabout{display: none;}
.topperlaw{display: block;}


.logged .topperabout{display: none;}
.logged .topperlaw{display: block;}
*/


.headerimg .imgdesktop{display: block;}
.headerimg .imgmobile{display: none;}

.detail.route h1, .detail.route h2{text-align:center}

.plekdetail .sheet article{padding: 2em 1.5em;}
.routedetail .sheet article{padding: 2em 1.5em;}
.kalender.detail .sheet article{padding:2em 1.5em;}
.detail .singleblogoverview article{padding: 2em 1.5em;}

article ul li a{float: none; display: inline-block; width: auto; text-decoration: underline;}


/* Media queries */

@media screen and (min-width: 600px) {
  .detail article .events a,
  .detail .digitalis {
    margin-left: -215px;
    width: 430px;
    left: 50%;
    float: left;
    clear: both;
  }
  .extra {
    padding: 2.5em 0 0.5em;
    
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    padding: 2em 2em 0;
    margin-left: -2em;
    margin-bottom: 1em;
   
  }
  h1 {
    font-size: 2.3em;
  }
  .nummer {
    font-size: 2.2em;
    bottom: 6.9em;
  }
  .home .events a {
    clear: both;
    margin-left: -215px;
    width: 430px;
    left: 50%;
  }
}

@media screen and (min-width: 700px) {
  body {
    background-color: #e4e4e4;
  }

  .navtop .closenav {
    font-size: 2.2em;
  }

  .intro2 {
    height: 10em;
  }
  .filters .containerOut,
  .overview .containerOut,
  .detail .containerOut , .over .containerOut {
    width: 650px;
    margin: 0 auto;
    float: none;
  }


}
@media screen and (min-width: 900px) {
  
  .navtop .closenav {
    font-size: 2.5em;
  }
  .intro2 {
    height: 11em;
  }
  .appcontainer {
    float: right;
    width: 50%;
  }
  .navtop {
    width: 28em;
  }
  .home .events a {
    clear: both;
    margin-left: 0;
    width: 100%;
    left: 0;
  }
  .home h1 {
    font-size: 2.4em;
  }
}

@media screen and (min-width: 1025px) {
  .appcontainer {
    float: right;
    width: 40%;
  }
  .aboutcontainer {
    width: 60%;
    display: block;
  }
  .home h1 {
    font-size: 2.6em;
  }

}

@media screen and (min-width: 1450px) {
 
  .home h1 {
    font-size: 2.8em;
  }
}
@media screen and (min-width: 1800px) {
  .home h1 {
    font-size: 3em;
  }
}
@media screen and (min-width: 1800px) {

  .home h1 {
    font-size: 3.2em;
  }
}

@media screen and (min-width: 2800px) {
  
}

@media screen and (max-width: 1300px) {
  .topperabout::after {
    background-size: 150% auto;
  }
  .topperlaw::after {
    background-image: url(../img/law3_.jpg);
    z-index: 1;
    background-size: cover!important;
  }
  .festivia .fcontainer{top:3em;}
  .width2{float: left; width: 100%; margin: 0;}
}

@media screen and (max-width: 1100px) {
  .topperabout::after {
    background-size: 250% auto;
  }
  .festivia .fcontainer{top:0;}
   .festivia .flogo{margin-left: 0; width: 19em; top:9.3em;}
   .festivia .fdate{margin-left: 0; width: 19em; top:2.3em;}
   .festivia .farticle{margin-left: 0; width: 23em; top:17.9em;}
   .festivia .fbutton{width: 10em; top:21em; margin-left: 15em;}
   .festivia .fkip2{display: none;}
   .festivia .fkip3{margin-left: -26em;}
   .festivia .fkip1{margin-left: 24em; top:28em;}
 
   .singleblog h1{font-size: 3.2em;}
   .singleblog .introblok, .singleblog .embeddedvideo{padding: 0 5em; }
    .detail .gezichtenoverview li h4, .detail .gezichtenoverview li p{ font-size: 1.1em; }
}

@media screen and (max-width: 1000px) {
  .two .icon {
    width: 6.6em;
    height: 6.6em;
  }
  .tree .icon {
    width: 4em;
    height: 7em;
  }
  .blogbig.blogoverview .blogitems a{width: 33.333%;}
  .singleblogoverview .leesook .leesookbtncontainer{padding: 0 7em;}

  .selecton .select { max-height: 50em; }
}

@media screen and (max-width: 900px) {
  /*.aboutcontainer{width: 100%; display: block; height: 100vh; z-index: 99;}
  .bottomabout{display: none;}*/
  .topperabout::after {
    background-size: 250% auto;
  }
  .festivia .fkip1{margin-left: 14em; top:32em; width: 20em;}
  .festivia .fkip3{width: 24em;}
   


  .aboutcontainer .bottomabout {
    display: none;
  }
  .aboutcontainer {
    width: 100%;
  }
  .aboutcontainer .topperabout {
    min-height: 100vw;
    height: auto;
  }

  .topperabout::after {
    background-size: 130% auto;
  }
  .topper .block {
    position: relative;
    float: left;
    height: auto;
    min-height: 60vw;
  }

  .one .icon {
    top: 40%;
    width: 40vw;
    height: 20vw;
  }
  .two .icon {
    top: 40%;
    width: 15vw;
    height: 15vw;
  }
  .tree .icon {
    top: 40%;
    width: 9.5vw;
    height: 16vw;
  }
  .singleblog h1{font-size: 2.8em;}
  .singleblog .introblok, .singleblog .embeddedvideo{padding: 0 3em; }
  .singleblog .introblok, .singleblog .tekst-foto, .singleblog .foto-tekst, .singleblog .tekst-open, .singleblog .tekst-quote, .singleblog .tekst-buttonblok, .singleblog .fotoslideshow, .singleblog .embeddedvideo{margin-bottom: 3em;}
.singleblog .tekst-foto .b50:first-child, .singleblog .tekst-open .b50:first-child, .singleblog .tekst-quote .b50:first-child, .singleblog .tekst-buttonblok .b50:first-child{padding-right: 3em;}
.singleblog .foto-tekst .b50:last-child{padding-left: 3em;}
.singleblogoverview .leesook .leesookbtncontainer{padding: 0 4em;}
.detail .gezichtenoverview li{width: 33.333%;}
.gezichtenoverview article {padding: 1em;}
  .blocktekstfoto .b50{padding:0!important;}
  .blockfototekst .b50{padding:0!important;}
}

@media screen and (max-width: 800px) {

  .festivia .fcontainer{top:6em!important;}
  .festivia .fdown{width: 2em; height: 2em;}
 
  .singleblogoverview .leesook .leesookbtncontainer{padding: 0 1em;}
  .singleblogoverview .leesook .b50:first-child{padding-right: 1em;}
  .singleblogoverview .leesook .b50:last-child{padding-left: 1em;}
  .selecton .select { max-height: 100vw; }
  .blockfotofoto .b50 img{height:auto; object-fit:cover;}
  .blockfotofoto .b50{width: 100%}
  .blocktekstfoto .b50, .blockfototekst .b50{width: 100%; float: left; }
  .blocktekstfoto .b50 .inner, .blockfototekst .b50 .inner{}
  .blockfototekst .b50:first-child{margin-bottom: 4em;}
  .blockfototekst + .blockinschrijven{margin-top: 0em;}
  .headerimg .imgdesktop{display: none;}
  .headerimg .imgmobile{display: block;}
  .over .gezichtenoverview li{width: 33%;}

}

@media screen and (max-width: 700px) {

  .kalender .sheet,
  .landings .sheet {
    margin-top: 3em;
  }
  .aboutcontainer .topperabout p,
  .aboutcontainer .topperabout .moredown {
    display: none;
  }
  .topperabout::after {
    background-size: 100% auto;
  }
  .blogbig.blogoverview .blogitems a{width: 50%;}
  .singleblog h1{font-size: 2.4em;}
  .singleblog .introblok, .singleblog .tekst-foto, .singleblog .foto-tekst, .singleblog .tekst-open, .singleblog .tekst-quote, .singleblog .tekst-buttonblok, .singleblog .fotoslideshow, .singleblog .embeddedvideo{margin-bottom: 2em;}
  .singleblog .tekst-foto .b50:first-child, .singleblog .tekst-open .b50:first-child, .singleblog .tekst-quote .b50:first-child, .singleblog .tekst-buttonblok .b50:first-child{padding-right: 0em; }
  .singleblog .tekst-foto .b50:last-child, .singleblog .tekst-open .b50:last-child, .singleblog .tekst-quote .b50:last-child, .singleblog .tekst-buttonblok .b50:last-child{padding-top:2em;}
  .singleblog .foto-tekst .b50:last-child{padding-left: 0em;}
  .singleblog .foto-tekst .b50:first-child{padding-bottom: 2em;}
  .singleblog .tekst-foto .b50, .singleblog .tekst-open .b50, .singleblog .tekst-quote .b50, .singleblog .tekst-buttonblok .b50, .singleblog .foto-tekst .b50{width: 100%;}
  .singleblog .tekst-open .b50:last-child{display: none;}
  .singleblog .tekst-quote blockquote{left: 50%; transform:translateX(-50%);}
  .detail .gezichtenoverview li{width: 50%;}
  .over .gezichtenoverview li{width: 50%;}
  .blockfoto img{width: 150%; left: -25%;}

}

@media screen and (max-width: 620px) {

  .singleblog .tekst-quote blockquote span{font-size: 2.4em;}
  .singleblog .introblok, .singleblog .embeddedvideo{padding: 0 0em; }
  .topperlaw h1{display: none;}
  .nummer{bottom: 8.5em;}
}

@media screen and (max-width: 500px) {
 
  .overview .sheet a .blad {
    font-size: 0.9em;
  }
  .intro h4 {
    bottom: 4.7em;
  }
   .festivia{min-height: 54em;}
   .festivia .fkip3{display: none;}
   .festivia .fkip1{width: 16em; top:38em; margin-left: 9em;}
   .festivia .fbutton{top:42em; margin-left: -5em;}
   .festivia .fdown{display: none;}
    

  .singleblog h1{font-size: 2.2em;}
}

@media screen and (max-width: 460px) {
  .digitalis {
    font-size: 0.9em;
  }
    .festivia .fcontainer{top:7em!important;}
    .singleblog .tekst-quote blockquote span{font-size: 2em;}

      article .radioboxes li{width: 100%;}
      .selecton .select { max-height: 130vw; }
}

@media screen and (max-width: 420px) {
  .digitalis div,
  .digitalis span {
    padding-left: 9em;
  }
  .digitalis {
    font-size: 0.8em;
  }
  .overview .sheet a .blad {
    font-size: 0.8em;
  }
  .videoWrapperheader {
    width: 66%;
    padding-bottom: 66%;
    margin-left: 17%;
  }
      .blogbig.blogoverview .blogitems a{width: 100%;}
   
    .singleblog h1{font-size: 2em;}
     .singleblog .tekst-quote blockquote span{font-size: 1.6em;}
       .singleblogoverview .leesook .leesookbtncontainer{padding: 0 1em;}
  .singleblogoverview .leesook .b50:first-child{padding-right: 0em; width: 100%;}
  .singleblogoverview .leesook .b50:last-child{padding-left: 0em; width: 100%;}
  .detail .gezichtenoverview li h4, .detail .gezichtenoverview li p{ font-size: 1em; }
  .selecton .select { max-height: 140vw; }

}

@media screen and (max-width: 350px) {
  body {
    font-size: 14px;
  }
}

@media screen and (max-height: 750px) {
  .block .icon {
    font-size: 0.8em;
  }
}
@media screen and (max-height: 670px) {
  .block .icon {
    font-size: 0.7em;
  }
  .festivia .fcontainer{font-size: 0.9em}
}
@media screen and (min-height: 800px) {
  .festivia .fcontainer{top:3%;}
}
@media screen and (min-height: 1000px) {
  .festivia .fcontainer{top:6%;}
}

@media (max-aspect-ratio: 3/2 ) and (min-height: 700px) {
  .topperabout {
      position: relative;
      float: left;
      height: 66.666vw;
  }
  .topper .block{height: 33.333vw;}
}
/* App */
body.app {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body.app header {
  display: none;
}

body.app .topper .block.one {
  padding-top: env(safe-area-inset-top);
}

body.app:after {
  height: env(safe-area-inset-bottom);
  content: "";
  clear: both;
  display: block;
}

/* Voor panorama's fullscreen op iOS */
iframe.inline-fullscreen {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  box-sizing: border-box;
  background-color: #000;
}