@font-face {
font-family: 'CalligrapherRegular';
src: url('../font/calligra-webfont.eot');
src: url('../font/calligra-webfont.eot?#iefix') format('embedded-opentype'),
url('../font/calligra-webfont.woff') format('woff'),
url('../font/calligra-webfont.ttf') format('truetype'),
url('../font/calligra-webfont.svg#CalligrapherRegular') format('svg');
font-weight: normal;
font-style: normal;
}

html *{
margin:0;               
padding:0;
border:none;
}  
body{    
color:#fff;  
margin:0;    
}
/* begin site*/
/*.jarallax-keep-img {
position: relative;
z-index: 0;
}
.jarallax-keep-img > .jarallax-img {
position: relative;
display: block;
max-width: 100%;
height: auto;
z-index: -100;
}*/
.jarallax {
position: relative;
z-index: 0;
 min-height: 600px;
}
.jarallax > .jarallax-img {
position: absolute;
object-fit: cover;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.jarallax1 {
position: relative;
z-index: 0;
 min-height: 450px;
}
.jarallax1 > .jarallax-img {
position: absolute;
object-fit: cover;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.jarallax2 {
position: relative;
z-index: 0;
 min-height: 350px;
}
.jarallax2 > .jarallax-img {
position: absolute;
object-fit: cover;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.opacity_55{
opacity:0.55;
}
.opacity_65{
opacity:0.65;
}
.opacity_45{
opacity:0.45;
}
.containeropening{
display:flex;
flex-flow: row wrap;
align-items:flex-end;
width:100%;
min-height:75vh;
margin:auto;
} 
.toplogoopening{
position:absolute;
top:40px;
left:0;
width:100%;
height:auto;
margin:0 auto 0 auto;
padding:20px 0 5px 0;
background: -webkit-linear-gradient(left,rgba(0,102,51,0.6)),rgba(0,102,51,0)); 
background: -o-linear-gradient(right,rgba(0,102,51,0.6),rgba(0,102,51,0));    
background: -moz-linear-gradient(right,rgba(0,102,51,0.6),rgba(0,102,51,0));        
background: linear-gradient(to right,rgba(0,102,51,0.6),rgba(0,102,51,0));  
}
.logoopening{
width:100%;
max-width:750px;
}
.colorhl{
display: flex;
align-items: center; /*zorgt voor juiste schaling picture bij chrome */
/*align-self:flex-start;*/
width:100%;
height:35px;
margin:auto;
}
.piccolorhl{
width:100%;
height:35px;
margin:0;
}
.undercontainer{
display: flex;
flex-flow:row wrap;
justify-content:center;
align-items: center;
width:100%;
min-height:100px;
margin: auto;
background: -webkit-linear-gradient(left,rgba(139,0,0,1),rgba(128,128,0,1),rgba(0,100,0,1)); 
background: -o-linear-gradient(right,rgba(139,0,0,1),rgba(128,128,0,1),rgba(0,100,0,1));   
background: -moz-linear-gradient(right,rgba(139,0,0,1),rgba(128,128,0,1),rgba(0,100,0,1));            
background: linear-gradient(to right,rgba(139,0,0,1),rgba(128,128,0,1),rgba(0,100,0,1));  
}
.undercontainertext{
font-family:Lato,Arial;
font-size:2.5rem;
font-weight:bold;
color: #fff;
text-align:center;
text-shadow:2px 2px 3px #000;

-webkit-animation: bounceInLeft 3s; /* Safari and Chrome */
-moz-animation: bounceInLeft 3s; /* Firefox */
-ms-animation: bounceInLeft 3s; /* Internet Explorer */
-o-animation: bounceInLeft 3s; /* Opera */
animation: bounceInLeft 3s;
}
@-webkit-keyframes bounceInLeft {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  100% {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInLeft {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  100% {
    -webkit-transform: none;
    transform: none;
  }
}
.pageopening{
display: flex;
flex-direction: column;
width:100%;
max-width:160rem;
min-height:100vh;   
margin:auto;
}
.mainopening{
width:100%;
margin:0 auto 0 auto;
padding:0;
}
.openingtop{
width:100%;
/*max-width:1440px;*/
min-height:400px;
margin:auto;
padding: 0;
opacity:0.65;
}
.openingbottom{
width:100%;
/*max-width:1440px;*/
min-height:400px;
margin:auto;
padding:0;
opacity:0.65;
}
.opening{
display:flex;
flex-flow:row wrap;
justify-content:space-around;
align-items:center;
width:100%;
max-width:1280px;
min-height:600px;
margin:auto;
padding:0;
}
.openingbox{
display:flex;
flex-direction:column;
aling-items:center;
width:100%;
max-width:300px;
min-height:350px;
font-family:Lato,Arial;
font-size:1.3rem;
font-weight:normal;
text-align:center;
color:#fff;
margin:10px auto 10px auto;/*even lange boxen*/
/*margin:10px auto auto auto;boxen vormen zich naar inhoud*/
padding:15px;
background: -webkit-linear-gradient(rgba(0,102,51,0.7)),rgba(0,102,51,0.7)); 
background: -o-linear-gradient(rgba(0,102,51,0.7),rgba(0,102,51,0.7));    
background: -moz-linear-gradient(rgba(0,102,51,0.7),rgba(0,102,51,0.7));        
background: linear-gradient(rgba(0,102,51,0.7),rgba(0,102,51,0.7));  
}
h2.titleopening{ 
font-family:Lato, Arial;
font-size:1.2em;
font-weight:bold;
color:#fff;
margin:0 0 15px 0;
}
.openinglinks{
margin: auto 0 0 0;
}
.openingbox a.leesmeer, .openingbox a:link.leesmeer, .openingbox a:visited.leesmeer, .openingbox a:hover.leesmeer, .openingbox a:active.leesmeer{
display:inline-block;
justify-content:center;
width:auto;
font-family:Lato,Arial;
font-size:0.8rem;      
font-weight:bold;  
color:#fff;
text-transform: uppercase;
margin:10px 0 0 0;
padding:5px 35px 5px 35px;
text-decoration:none;
outline-style:none;
background-color: #990000;
 -webkit-border-radius:50px;
-moz-border-radius:50px;
border-radius:50px; 
}
.openingbox a:hover.leesmeer{
color:#000;
margin:10px 0 0 0;
padding:5px 35px 5px 35px;
background-color: #669900;
}
.openingbox a.leesmeer:after{
content:'>';
position:absolute;
margin:0 0 0 10px;
}
.openingbox a:hover.leesmeer:after{
content:'>>';
position:absolute;
margin:0 0 0 10px;
}
.mainvideo{
position:relative;
width:100%;
margin:0 auto 0 auto;
padding: 0;
}
.midden{
width:100%;
height:auto;
position:relative;
margin: auto;
padding:0;
}
.video{
width:100%;
position:relative;
padding:0;
margin:auto;
}
iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
.container1opening{
display:flex;
flex-flow: row wrap;
align-items:flex-end;
width:100%;
min-height:100vh;
margin:auto;
} 
.containerunder{
width:100%;
min-height:600px;
margin:auto auto 0 auto;
padding:0;
} 
.bottomlogoopening{
display:flex;
flex-direction:row;
justify-content:flex-start;
align-items:center;
width:100%;
height:auto;
margin:0 auto 0 auto;
padding:20px 0 5px 0;
background: -webkit-linear-gradient(left,rgba(0,102,51,0.6)),rgba(0,102,51,0)); 
background: -o-linear-gradient(right,rgba(0,102,51,0.6),rgba(0,102,51,0));    
background: -moz-linear-gradient(right,rgba(0,102,51,0.6),rgba(0,102,51,0));        
background: linear-gradient(to right,rgba(0,102,51,0.6),rgba(0,102,51,0));  
}
.logoopening{
width:100%;
max-width:750px;
}
.footeropening{
display:flex;
flex-flow:row wrap;
justify-content:space-around;
align-items:center;
width:100%;
min-height:600px;
margin:auto auto 0 auto;
padding:0 0 50px 0;
background: -webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.6)); 
background: -o-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.6));    
background: -moz-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.6));        
background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.6));
}
.footernavopening{ 
width:100%;
height:auto;
margin:auto auto 0 auto;
}
.footernavopening ul{ 
display:flex;
flex-flow:row wrap;
justify-content:space-around;
align-items:center;
width:100%;
height:auto;
margin: auto auto 0 auto;   
padding:0 ;
list-style-type:none;
}
.footernavopening ul li{
width:auto;
height:auto;
margin:0 0 5px 0;
padding:0;  
}   
.footernavopening ul li a, .footernavopening ul li a:link, .footernavopening ul li a:visited, .footernavopening ul li a:active{
font-family:Lato,Arial;
font-size:1rem;
font-weight:bold;
font-style:normal;
color:#fff;
margin:0;
padding:0 5px 0 5px;
text-decoration:none;  
outline-style:none; 
border-left:4px double #fff;
}
.footernavopening ul li a:hover,
.footernavopening ul li a.current, .footernavopening ul li a:link.current, .footernavopening ul li a:visited.current, .footernavopening ul li a:active.current{  
color:#ff0000;  
margin:0;
padding:0 5px 0 5px;
text-decoration:none;  
outline-style:none;  
border-left:4px double #ff0000;
}
span, .span{
display:none;
}
a:hover span{
display:flex;
flex:row;
justify-content:center;
position:absolute;
bottom:40px;
left:0;
z-index:40;
width:125px;
height:auto;
font-size:12px;
color:#fff;
padding:5px;
border:1px solid #fff;
background: -webkit-linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)); 
background: -o-linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6));    
background: -moz-linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6));        
background: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6));
}
a:hover .span{
display:flex;
flex:row;
justify-content:center;
position:absolute;
bottom:40px;
right:0;
z-index:40;
width:200px;
height:auto;
font-size:12px;
color:#fff;
padding:5px;
border:1px solid #fff;
background: -webkit-linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)); 
background: -o-linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6));    
background: -moz-linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6));        
background: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6));
}
.footerunder{
/*position:relative;*/
position:fixed;
left:0;
bottom:0;
width:100%;
height:35px;
}
.adrbottom{
position:fixed;
bottom:0;
left:0;
z-index:20;
width:12.5%;
height:35px;
margin:auto auto 0 0;
background-color:#006401;
}
a.imgadrbottom{
display:flex;
flex:row;
justify-content:center;
align-items:center;
width:20px;
height:20px;
margin:5px auto auto auto;
}
.telbottom{
position:fixed;
bottom:0;
left:12.5%;
z-index:20;
width:12.5%;
height:35px;
margin:auto 0 0 auto;
background-color:#006401;
}
a.imgtelbottom{
display:flex;
flex:row;
justify-content:center;
align-items:center;
width:20px;
height:20px;
margin:5px auto auto auto;
}
.hwlbottom{
position:fixed;
bottom:0;
left:25%;
z-index:20;
width:50%;
height:35px;
margin:auto 0 0 auto;
background-color:#7f8000;
}
.imghwlbottom{
display:flex;
flex:row;
justify-content:center;
width:76px;
height:35px;
margin:0 auto;
}
.sitebottom{
position:fixed;
bottom:0;
right:0;
z-index:20;
width:12.5%;
height:35px;
margin:auto 0 0 auto;
background-color:#8b0003;
}
a.imgsitebottom{
display:flex;
flex:row;
justify-content:center;
width:20px;
height:20px;
margin:5px auto auto auto;
}
.embottom{
position:fixed;
bottom:0;
right:12.5%;
z-index:20;
width:12.5%;
height:35px;
margin:auto 0 0 auto;
background-color:#8b0003;
}
a.imgembottom{
display:flex;
flex:row;
justify-content:center;
width:20px;
height:20px;
margin:5px auto auto auto;
}
.telmobiel{
display:none;
}
.teldesktop{
display:inline-block;
}
.adres{
margin:0;
padding:0;       
list-style-type:none; 
}
.adrescenter{
font-family:Lato,Arial;
font-size:1rem;
margin:0;   
padding:0;                                     
}
.kopadres{
font-family:Lato,CalligrapherRegular, Arial;
font-size:1.3em;
font-weight:bold;
color:#000;
margin:0;
}
h4.tel{
display:none;
}

/* begin algemeen gedeelte */
 a, a:link, a:visited, a:active{  
font-family:Lato,Arial;
font-size:1em;      
font-weight:bold;         
color:#000; 
text-decoration:underline;
outline-style:none;
}          
 a:hover{
color:#ff0000;
text-decoration:none;
outline-style:none;
}     
h2,h3,h4,h5,h6{
font-family:Lato,Arial;
font-weight:bold; 
}
h3{ 
display:inline;
font-size:14px;
font-weight:bold;
letter-spacing: normal;
}    
ul.list{
list-style-image:url(../images/listitem.png);
margin-left: 40px;
}
ul,ol{
list-style-type:none;
margin:10px 0 10px 20px;
}
.hiddencontainer{
display:none;
} 
.klik{
font-family:Lato,Arial;
font-size:0.9rem;
font-weight:bold;
font-style:italic;
text-align:center;
color:#000;
padding:0;
margin:0 0 5px 0;
}
img.centered{
display: block;
margin:0 auto 5px auto;
padding: 5px;
}
img.alignright{
display:inline;
margin: 5px 5px 0 5px;
padding: 0;
box-shadow:2px 2px 5px #000;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
img.alignleft{
display:inline;
margin: 5px 10px 0 0;
padding: 0;
box-shadow:2px 2px 5px #000;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
.alignright{
float:right;
}
.alignleft{
float:left;
}
html, body{
height:100%;
}  
@media only screen and (min-width: 645px) and (max-width: 800px){
.openingbox{
width:100%;
max-width:250px;
min-height:300px;
font-size:1rem;  
}
.undercontainertext{
font-size:2rem;
}
.footeropening{
width:100%;
}
}
@media only screen and (min-width: 240px) and (max-width: 640px){
html{          
font-size:100%;
}
/*.container,.containerunder,.openingtop,.openingbottom{
background-attachment: scroll;
}*/
.undercontainertext{
font-size:1.5rem;
}
.openingbox{
width:100%;
max-width:250px;
min-height:300px;
font-size:1rem;  
}
h2.titleopening{ 
margin:0 0 5px 0;
}
.footernavopening ul{ 
display:block;
flex-flow:column wrap;
justify-content:flex-start;
width:25%;
}
.telmobiel{
display:inline-block;
}
.teldesktop{
display:none;
}
h4.tel{
display:block;
font-style:italic;
font-size:0.8rem;
color:#000;
font-weight:normal;
}
.toptwo{
margin:10px 0 0 0;
}
.down{
display:block;
}
.colorhl{
height:25px;
}
.caption{
font-size:1.5em;
margin:-30px 0 0 0;
padding:0 0 0 15px;
}
.imgbox{
justify-content:center;
}
}
@media only screen and (min-width: 230px) and (max-width: 320px){
.undercontainertext{
font-size:1rem;
}
}
