@font-face {
font-family: 'alluraregular';
src: url('../font/allura-regular-webfont.woff2') format('woff2'),
url('../font/allura-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
html *{
margin:0;               
padding:0;
border:none;
}  
 body{     
color:#000;
background-color: #fff;
}
.playertotal{
display:flex;
flex-flow:row wrap;
justify-content:flex-start;
align-items:center;
position:relative;
width:100%;
max-width:350px;
height:auto;
margin:0;
padding:0;
}
.koppodcast{
font-family:Lato,Arial;
font-size:0.9em;
font-weight:bold;
font-style:normal;
margin:10px 0 10px 0;
}
.left{
flex:25%;
}
.imgplayer{
width:100%;
max-width:350px;
}
.right{
flex:70%;
font-family:Lato,Arial;
font-size:0.9em;
font-weight:normal;
font-style:italic;
padding:0 0 0 5px;
}
.player{
display:flex;
/*justify-content:flex-start;
align-items:center;
position:relative;*/
width:100%;
max-width:350px;
height:60px;
margin:5px 0 0 0;
padding:0;
}
audio{
width:100%;
max-width:350px;
height:35px;
margin:0;
}
.nopointer{
cursor:text;
}
.container{
display:flex;
/*flex-direction:row;*/
flex-wrap:wrap;
width:100%;
margin:0 0 40px 0;
padding:0;
}
#toggle{
display:none;
}
.containernav{
position:fixed;
top:0;
left:0;
z-index:15;
width:100%;
height:50px;
margin:0;
background: linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
background: -webkit-linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
background: -o-linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
background: -moz-linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
}
nav{ 
width:auto;
margin:10px 0 0 0;
}
nav ul{ 
display:flex;
/*flex-direction:row;
flex-wrap:wrap;*/
justify-content:space-around;
width:auto;
height:auto;
list-style-type:none;
margin: auto;
padding:0;
}
nav ul li{
width:auto;
height:auto;
text-align:left;
margin:0;
padding:0;  
}   
nav ul li a, nav ul li a:link, nav ul li a:visited, nav ul li a:active{
font-family:Lato,Arial;
font-size:0.9em;
font-weight:normal;
font-style:normal;
margin:0 ;
color:#fff;
padding:3px 5px 5px 5px;
text-decoration:none;  
outline-style:none; 
}
nav ul li a:hover,
nav ul li a.current, nav ul li a:link.current, nav ul li a:visited.current, nav ul li a:active.current{  
color:#ff0000;  
margin:0;
padding:3px 5px 5px 5px;
text-decoration:none;  
outline-style:none;  
}
i{
font-size:36px;
color:#000;
-webkit-animation: fade 1s infinite; 
-moz-animation: fade 1s  infinite; 
-ms-animation: fade 1s  infinite; 
-o-animation: fade 1s  infinite; 
animation: fade 1s  infinite; 
}      
 @keyframes fade {
from { 
color:#000;
}
50%{
color:#ff0000;
}
to { 
color:#000; 
}
}

@-moz-keyframes fade {
from { 
color:#000;
}
50%{
color:#ff0000;
}
to { 
color:#000; 
}
}

@-webkit-keyframes fade {
from { 
color:#000;
}
50%{
color:#ff0000;
}
to { 
color:#000; 
}
}

@-ms-keyframes fade {
from { 
color:#000;
}
50%{
color:#ff0000;
}
to { 
color:#000; 
}
}

@-o-keyframes fade {
from { 
color:#000;
}
50%{
color:#ff0000;
}
to { 
color:#000; 
}
}
header{
display: flex;
align-items: center;/* zorgt voor juiste schaling picture bij chrome */
/*align-self:flex-start;*/
width:100%;
height:auto;
margin:50px auto auto auto;
}
.picheader{
width:100%;
margin: 0;
}
.colorcolorswtp{
display: flex;
align-items: center; /*zorgt voor juiste schaling picture bij chrome */
/*align-self:flex-start;*/
width:100%;
height:35px;
margin:0;
}
.piccolorcolorswtp{
width:100%;
height:35px;
margin:0;
}
h2.title{
display:flex;
flex-flow:row;
justify-content:flex-start;
position:relative;
font-family:Lato,Arial;
font-size:2em;
font-weight:bold;
color:#fff;
width:100%;
margin:-40px 0 0 15px;
text-shadow:2px 2px 5px #000;
}
.fbtwbox{
display:flex;
flex-flow:row;
justify-content:flex-end;
width:100%;
height:25px;
margin:0 0 15px auto;
padding:0 5px 0 0;
}
.fbtwimg{
width:100%;
max-width:25px;
height:25px;
margin:0 5px 0 0;
padding:0;
}
.wandelingen{
display:flex;
justify-content:center;
width:auto;
font-family:Lato,Arial;
font-size:1.5rem;
font-weight:bold;
text-align:center;
color:#000;
padding:5px 10px 5px 10px;
margin:0 auto 10px auto;
}
.navroute{
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:space-around;
flex:100%;
height:auto;
margin:0 auto 10px 0;
padding:0;
}
.navroutebox{
/*width:auto;*/
width:100%;
max-width:185px;
height:auto;
margin:0 auto 10px auto;
padding:5px;
}
.rondwandeling{
font-size:0.7rem;
text-align:center;
padding:0 0 5px 0;
}
a.route, a:link.route, a:visited.route, a:active.route{
display:block;
font-family:Lato,Arial;
font-weight:bold;
font-size:0.9rem;
font-style:normal;
color:#fff; 
margin:0 0 10px 0;
padding:2px 2px 2px 5px;
text-decoration:none;  
outline-style:underline; 
box-shadow: 2px 2px 10px #000;
background: linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
background: -webkit-linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
background: -o-linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
background: -moz-linear-gradient(rgba(0,65,129,1),rgba(0,65,129,1));
}
a:hover.route,
a.routecurrent, a:link.routecurrent, a:visited.routecurrent, a:active.routecurrent{
display:block;
font-family:Lato,Arial;
font-weight:bold;
font-size:0.9rem;
font-style:normal;
color:#fff; 
margin:0 0 10px 0;
padding:2px 2px 2px 5px;
text-decoration:none;  
outline-style:underline; 
background: linear-gradient(rgba(0,65,129,0.6),rgba(0,65,129,0.6));
background: -webkit-linear-gradient(rgba(0,65,129,0.6),rgba(0,65,129,0.6));
background: -o-linear-gradient(rgba(0,65,129,0.6),rgba(0,65,129,0.6));
background: -moz-linear-gradient(rgba(0,65,129,0.6),rgba(0,65,129,0.6));
}
.jaartelling::after{
position:relative;
top:1px;
content: '>';
color:#fff;
margin:0 0 0 3px; 
}
.jaartelling:hover::after{
position:relative;
top:1px;
content: '>';
color:#fff;
margin:0 0 0 3px; 
}
.jaartellingcurrent::after{
position:relative;
top:1px;
content: '>';
color:#000;
margin:0 0 0 3px; 
}
.jaartellingcurrent::before{
display:none;
}
.jaartelling{
display:inline;
font-size:0.7rem;
}
.nummer{
display:inline;
font-size:0.7rem;
}
main{
display:flex;
flex-flow:row wrap;
width:100%;
max-width:120rem;
margin:0 auto 0 auto;
}
.maintext{
flex:60%;
margin:10px 3.5% 20px 0;
padding:0;
}
.titlearticle{
font-family:Lato,Arial;
font-size:1em;
font-weight:bold; 
color: #000;
margin:10px 0 5px 0; 
}
.text{
width:90%;
font-family:Lato,Arial;
font-size:1rem;
color:#000;
margin:0 auto;
padding:0;
}
.pdf{
display:inline-block;
}
.pdfmob{
display:none;
}
.sponsors{
display:flex;
flex-flow:row;
justify-content:flex-start;
font-family:Lato,Arial;
font-size:1.5rem;
font-weight:bold;
width:100%;
color:#000;
margin:20px auto 10px auto;
}
h2.nieuws{
font-family:Lato, Arial;
font-size:1rem;
font-weight:bold;
margin:1px 0 0 0;
padding:0;
}
/*hotspots*/
h2.wandelingenhotspot, h2.kunst{
font-family:Lato, Arial;
font-size:1.2rem;
font-weight:bold;
margin:10px 0 10px 0;
padding:0;
}
.hotspots {
position: relative;
font-weight: bold;
font-family:Lato, Arial;
font-size:1rem;
}
.hotspots img {
max-width: 100%;
height: auto;
display: block;
}
.hotspot {
position: absolute;
width: 25px;
height: 18px;
padding-top: 6px;
text-align: center;
text-decoration: none;
}
.hotspot::after {
content: "";
width: 15px;
height: 15px;
background-color: #fff;
display: block;
margin: -16px auto 0 3px;
border:1px solid #fff;
}
#hs-1{
top: 16%;
left: 86%;
}
#hs-2{
top: 24%;
left: 81%;
}
#hs-3{
top: 24%;
left: 71%;
}
#hs-4{
top: 16%;
left: 63%;
}
#hs-5{
top: 26%;
left: 60%;
}
#hs-6{
top: 38%;
left: 53%;
}
#hs-7{
top: 43%;
left: 42%;
}
#hs-8{
top: 34%;
left: 18%;
}
#hs-9{
top: 28%;
left: 35%;
}
span{
display:none;
}
a:hover span {
display:block;
position:absolute;
right:0;
top:0;
z-index:10;
font-family:Lato,Arial;
font-size:0.9em;
font-weight:bold; 
color:#fff;
margin:25px auto 0 0;
padding:0 2px 0 2px;
border:1px solid #fff;
background-color:#003399;
}
/*end hotspots*/

.sidebar{
flex:35%;
margin:10px 0.5% 20px 0;
padding:0;
}
.sidebarpaneel{
width:auto;
margin: 0;
padding:0;
}
.sidebarkunst,.sidebarorganisatie{
position:absolute;
margin:-6px 0 0 30px;
font-family:Lato,Arial;
font-size:0.9em;
font-weight:normal; 
color:#000; 
}
.sidebarkunstfirst{
position:absolute;
margin:-6px 0 0 5px;
font-family:Lato,Arial;
font-size:0.9em;
font-weight:normal; 
color:#000; 
}
.sidebarorganisatie{
margin:-6px 0 0 15px;
}
.hiddencontainer{
display:none;
}
.imgsidebar, .imgmainleft, .imgwereldtijdpad{
display:flex;
/*flex-direction:row;*/
flex-wrap:wrap;
justify-content:space-around;
margin:10px 0 0 0;
}
.imgsidebarbox{
width:100%;
max-width:150px;
height:auto;
margin:0 auto 10px auto;
padding:5px 0 5px 0;
}
img.schatkamer{
display:inline-block;
width:100%;
max-width:350px;
margin:5px auto 10px auto;
box-shadow:2px 2px 5px #000;

-webkit-transform: rotateX(360deg);
-moz-transform: rotateX(360deg);
-o-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
transform: rotateX(360deg);
	 
-webkit-animation-name: rotation; 
-moz-animation-name:rotation; 
-o-animation-name:rotation; 
-ms-animation-name:rotation; 
animation-name:rotation; 

-webkit-animation-duration: 4s; 
-moz-animation-duration: 4s;
-o-animation-duration: 4s;
-ms-animation-duration: 4s;
animation-duration: 4s;

-webkit-animation-iteration-count: infinite;/* Safari and Chrome */
-moz-animation-iteration-count: infinite;/* Firefox 4 */
-o-animation-iteration-count: infinite;/* Opera */
animation-iteration-count: infinite;

-webkit-animation-timing-function: ease-out-in;/* Safari and Chrome */
-moz-animation-timing-function: ease-out-in;/* Firefox 4 */
-o-animation-timing-function: ease-out-in;/* Opera */
animation-timing-function: ease-out-in;

}

@keyframes rotation {
from { 
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
}
to { 
-webkit-transform: rotateX(360deg);
-moz-transform: rotateX(360deg);
-o-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
transform: rotateX(360deg);
}
}

/* Firefox */
@-moz-keyframes rotation  {
from { 
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
}
to { 
-webkit-transform: rotateX(360deg);
-moz-transform: rotateX(360deg);
-o-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
transform: rotateX(360deg);
}
}

/* Safari and Chrome */
@-webkit-keyframes rotation {
from { 
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
}
to { 
-webkit-transform: rotateX(360deg);
-moz-transform: rotateX(360deg);
-o-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
transform: rotateX(360deg);
}
}

/* Internet Explorer */
@-ms-keyframes rotation {
from { 
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
}
to { 
-webkit-transform: rotateX(360deg);
-moz-transform: rotateX(360deg);
-o-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
transform: rotateX(360deg);
}
}

/* Opera */
@-o-keyframes rotation {
from { 
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
}
to { 
-webkit-transform: rotateX(360deg);
-moz-transform: rotateX(360deg);
-o-transform: rotateX(360deg);
-ms-transform: rotateX(360deg);
transform: rotateX(360deg);
}
}
.imgmainsponsoren{
display:flex;
/*flex-direction:row;*/
flex-wrap:wrap;
justify-content:flex-start;
}
.imgsponsors{
width:100%;
max-width:125px;
height:auto;
margin:10px 5px 10px 5px;
box-shadow: 2px 2px 10px #000;
}
img.traject{
width:100%;
max-width:750px;
margin:10px auto 10px auto;
box-shadow: 2px 2px 10px #000;
}
img.anbi{
display:flex;
justify-content:flex-start;
width:100%;
max-width:200px;
margin:10px auto 10px 0;
box-shadow: 2px 2px 10px #000;
}
img.centered{
width:100%;
height:auto;
margin:5px auto 10px auto;
padding: 0;
box-shadow: 2px 2px 10px #000;
}
.imgnews{
width:100%;
max-width:450px;
height:auto;
margin:0 auto 0 auto;
padding:5px 0 5px 0;
}
img.centeredlz{
width:100%;
max-width:450px;
height:auto;
margin:5px auto 5px auto;
padding: 0;
}
img.centeredip{
width:100%;
max-width:345px;
height:auto;
margin:5px auto 5px auto;
padding: 0;
}
img.alignright{
margin:10px 5px 10px 5px;
padding: 0;
box-shadow: 2px 2px 10px #000;
}
img.alignleft{
margin:10px 5px 10px 5px;
padding: 0;
box-shadow: 2px 2px 10px #000;
}
.alignright{
float:right;
}
.alignleft{
float:left;
}   
.imgbox{
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:flex-start;
padding:20px 0 0 0;
border:1px solid red;
}
img.bd{
flex:auto;
width:100%;
max-width:175px;
margin:5px 5px 10px 5px;
border:3px double #00447b;
} 
img.bd:hover{
display:none;
} 
img.bdtwo{
display:none;
} 
img.bdtwo:hover{
flex:auto;
width:100%;
max-width:175px;
margin:5px 5px 10px 5px;
border:3px double #00447b;
}
a.imga, a:link.imga, a:visited.imga, a:active.imga{
width:100%;
max-width:175px;
padding:5px 15px 10px 5px;
border:1px solid green;
}
.klik{
display:flex;
justify-content:center;
width:100%;
font-family:Lato,Arial;
font-size:12px;
font-weight:bold;
font-style:italic;
color:#333;
padding:0;
margin:10px 0 10px 0;
}
.kliktext{
display:flex;
justify-content:flex-start;
width:auto;
font-family:Lato,Arial;
font-size:12px;
font-weight:bold;
font-style:italic;
color:#333;
padding:0;
margin:10px 0 0 0;
}
.footermob, .nawmob, .nawcontactmob{
display:none;
}
footer{
width:100%;
/*height:auto;*/
min-height:200px;
margin:auto;
padding:20px 0 20px 0;
}
.footerinner{
display:flex;
flex-flow:row wrap;
align-items: center;
justify-content: space-around;
min-height:200px;
}
.footernav{ 
align-self:center;
width:auto;
height:auto;
margin: 0;   
padding:0 ;
list-style-type:none;
}
.footernav  li{
display:block;
width:auto;
height:auto;
margin:0 0 5px 0;
padding:0;  
}   
.footernav li a, .footernav li a:link, .footernav li a:visited, .footernav li a:active{
font-family:Lato,Arial;
font-size:1rem;
font-weight:normal;
font-style:normal;
color:#000;
margin:0;
padding:0 5px 0 5px;
text-decoration:none;  
outline-style:none; 
border-left: 4px double transparent;
}
.footernav li a:hover,
.footernav li a.current, .footernav li a:link.current, .footernav li a:visited.current, .footernav li a:active.current{  
color:#ca0015; 
margin:0;
padding:0 5px 0 5px;
text-decoration:none;  
outline-style:none;  
border-left: 4px double #000;  
}
.footerlinks{ 
align-self:center;
width:auto;
height:auto;
margin: 0;   
padding:0 ;
list-style-type:none;
}
.footerlinks  li{
display:block;
width:auto;
height:auto;
margin:0 0 5px 0;
padding:0;  
} 
.footerlinks li a, .footerlinks li a:link, .footerlinks li a:visited, .footerlinks li a:active{
font-family:Lato,Arial;
font-size:1rem;
font-weight:normal;
font-style:normal;
color:#000;
margin:0;
padding:0 5px 0 5px;
text-decoration:none;  
outline-style:none; 
}
.footerlinks li a:hover{  
color:#000;  
margin:0;
padding:0 5px 0 5px;
text-decoration:none;  
outline-style:none;   
}
.footerbox{
align-self:flex-start;
width:auto;
height:auto;
margin: 0;   
padding:10px 0 10px 0;
list-style-type:none;
}  
.kopfooterbox{
display:flex;
justify-content:center;
font-family:Lato, Arial;
font-size:1.2rem;
font-weight:bold;
text-align:center;
line-height:40px;
color:#000;
margin:0 auto 0 auto;
padding:0;
}
ul.adresbox{
display:flex;
flex-flow:column;
justify-content:flex-start;
font-family:Lato,Arial;
font-size:1rem;
color:#000;
margin:0 auto 0 auto;
padding:0;   
list-style-type:none;                                  
}
a.adres, a:link.adres, a:visited.adres, a:active.adres{  
font-family:Lato,Arial;
font-size:1rem;            
color:#000; 
text-decoration:none;
outline-style:none;
margin:0;
}          
 a:hover.adres{
color:#ff0000;
text-decoration:none;
outline-style:none;
}
.telmobiel{
display:none;
}
.teldesktop{
display:block;
}
td.hist{
font-weight:bold;
padding-right:10px;
}
.historiefb{
display:flex;
flex-direction:row;
flex-wrap: wrap;
justify-content:space-around;
align-items:flex-start;
width:100%;
height:auto;
margin:20px auto 20px auto;
padding:0 0 0 5px;
}
.historiefbbox{
/* display:flex;
justify-content:center; zorgt voor plaatsing img in midden */
width:100%;
max-width:200px;
height:auto;
margin:0 5px 10px 0;
font-family:'Dancing Script', cursive;/*alluraregular,Lato,Arial;*/
font-size:1.3rem;
font-weight:normal;
color:#000;
}
img.historiefbpic{
display:flex; /*zorgt voor plaatsing img in midden*/ 
width:100%;
max-width:300px;
height:auto;
margin:0 0 10px 0;
 -webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px; 

-webkit-box-shadow: 1px 1px 15px 0 #000;
-moz-box-shadow:1px 1px 15px 0 #000;
box-shadow: 1px 1px 15px 0 #000;
 
}
li.one{
background-image: url(../images/picto/t.png);
background-position: 0 2px;
background-repeat: no-repeat;
margin:0;
padding:0 0 5px 30px;
}
li.two{
background-image: url(../images/picto/m.png);
background-position: 0 2px;
background-repeat: no-repeat;
margin:0;
padding:0 0 5px 30px;
}
li.three{
background-image: url(../images/picto/i.png);
background-position: 0 2px;
background-repeat: no-repeat;
margin:0;
padding:0 0 5px 30px;
}
li.four{
background-image: url(../images/picto/e.png);
background-position: 0 2px;
background-repeat: no-repeat;
margin:0;
padding:0 0 5px 30px;
}
h1{
font-family:Lato, Arial;
font-size:1.8rem;
font-weight:bold;
margin:10px 0 20px 0;
padding:0;
}
h2{
font-family:Lato, Arial;
font-size:0.9rem;
font-weight:bold;
margin:5px 0 1px 0;
padding:0;
}
h2.org{
font-family:Lato, Arial;
font-size:0.8rem;
font-weight:normal;
margin:10px 0 10px 0;
padding:0;
}
a, a:link, a:visited, a:active{
font-family:Lato,Arial;
font-size:0.9em;
font-weight:normal; 
font-style:italic;
color:#000; 
margin:0;
padding:3px 0 3px 0; 
text-decoration:underline;  
outline-style:underline; 
}
a:hover{
color:#ff0000; 
margin:0;
padding:3px 0 3px 0;  
text-decoration:none;  
outline-style:none;  
}
.backtop a{
position:fixed;
right:0;
bottom:-5px;
width:50px;
height:50px;
z-index:80;
background-image: url('../images/backtop.png');
background-position: 0 0;
background-repeat: no-repeat;
text-decoration:none;  
outline-style:none; 
cursor:pointer;
}
ul, ol{
font-family:Lato,Arial;
font-size:1rem;
font-weight:normal;
color:#000;
padding:0;
margin:0 0 0 25px;
}
.picto{
display:inline-block;
margin:0;
padding:0 5px 0 0;
} 
.containerpaneel{
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:space-around;
align-items:flex-start;
width:100%;
height:auto;
margin:30px 0 0 0;
}
.paneelbox{
width:auto;
height:auto;
margin:0 10px 10px 0;
}
img.paneelpic{
display:flex;
width:100%;
max-width:400px;
height:auto;
border:3px double #00447b;
}
img.paneelpic:hover{
display:flex;
width:100%;
max-width:400px;
height:auto;
border:3px double #ff0000;
}
.overlay{
position:relative;
width:auto;
height:auto;
z-index:10;
margin: 0;
padding:0;
}
.spanpaneel{
position:absolute;
bottom:0;
width:100%;
max-width:400px;
height:100%;
z-index:50;
margin: 0;
padding:0 6px 0 0;
opacity:0;
}
.spanpaneel:hover{
position:absolute;
width:100%;
max-width:400px;
height:100%;
z-index:50;
margin:0;
padding:0 6px 0 0;
opacity:1;

-webkit-animation: opacity 2s; /* Safari and Chrome */
-moz-animation: opacity 2s; /* Firefox */
-ms-animation: opacity 2s; /* Internet Explorer */
-o-animation: opacity 2s; /* Opera */
animation: opacity 2s;
}

@keyframes opacity {
from { 
opacity: 0; 
}
to { 
opacity:1;
}
}

/* Firefox */
@-moz-keyframes opacity {
from { 
opacity: 0; 
}
to { 
opacity:1;
}
}

/* Safari and Chrome */
@-webkit-keyframes opacity {
from { 
opacity: 0; 
}
to { 
opacity:1;
}
}

/* Internet Explorer */
@-ms-keyframes opacity {
from { 
opacity: 0; 
}
to { 
opacity:1;
}
}

/* Opera */
@-o-keyframes opacity {
from { 
opacity: 0; 
}
to { 
opacity:1;
}
}
.infopaneel,.textspan{    
font-family:Lato,Arial;
font-size:0.9rem;
font-weight:bold;
font-style:normal;
text-align:center;
color:#000;
padding:0;
margin:0;
}
.textspan{
margin:0 0 0 7px;
text-decoration:none;  
outline-style:none; 
background-color: #fff;
}
a.infp, a:link.infp, a:visited.infp, a:active.infp{
font-style:normal;
text-decoration:none;  
outline-style:none; 
}
.iframebox{
display:flex;
width:100%;
justify-content:center;
margin:20px auto auto auto;
}

html, body{
height:100%;
} 
@media only screen and (min-width: 640px) and (max-width: 800px){
nav li a, nav li a:link, nav li a:visited, nav li a:active{
font-size:0.8em;
} 
ul.footerboxtekst{
font-size:1em;
}
}
@media only screen and (min-width: 240px) and (max-width: 640px){
nav{
display:none;
}
.container{
margin:0;
}
header{
margin:auto;
}
.picheader{
width:100%;
margin:0;
}
h2.title{
font-size:1.5em;
margin:-30px 0 0 10px;
}
.colorcolorswtp{
height:25px;
}
.piccolorcolorswtp{
height:25px;
}
.navroutebox{
max-width:170px;
}
a.route, a:link.route, a:visited.route, a:active.route{
font-size:0.8rem;
}
a:hover.route,
a.routecurrent, a:link.routecurrent, a:visited.routecurrent, a:active.routecurrent{
font-size:0.8rem;
}
/*.textoverkaart{
font-size:0.8rem;
}*/
.jaartelling{
display:inline;
font-size:0.6rem;
}
.nummer{
display:inline;
font-size:0.6rem;
}
.containernav{
position:relative;
top:0;
left:0;
z-index:20;
width:100%;
height:auto;
margin:0!important;
background:none;
}
#toggle{
display:inline-block;
position:absolute;
right:5px;
top:5px;
z-index:20;
width:30px;
height:30px;
font-family:Lato, Arial;
font-size:1rem;
font-weight:bold;
text-indent:2px;
color:#000;
margin:0;
padding:5px 5px 0 5px; 
/*border:1px solid #fff;
background: linear-gradient(rgba(0,65,129,0.8),rgba(0,65,129,0.8));
background: -webkit-linear-gradient(rgba(0,65,129,0.8),rgba(0,65,129,0.8));
background: -o-linear-gradient(rgba(0,65,129,0.8),rgba(0,65,129,0.8));
background: -moz-linear-gradient(rgba(0,65,129,0.8),rgba(0,65,129,0.8));*/

background: -webkit-linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9)); 
background: -o-linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9));   
background: -moz-linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9));         
background: linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9)); 
cursor: pointer; 
}
#toggle:hover{
color:#ff0000;
}
/*#toggle::after{
position:absolute;
top:5px;
content: 'menu';
color:#fff;
margin-left:5px;
}
#toggle:hover::after{
position:absolute;
top:5px;
content: 'menu';
color:#ff0000;
margin-left:5px;
}*/
nav{
position:relative;
top:0;
right:0;
width:100%;
height:auto;
margin:0;
padding:0;
background: -webkit-linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9)); 
background: -o-linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9));    
background: -moz-linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9));      
background: linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9)); 
}
nav ul{
flex-direction:column;
margin:0;  
padding:5px 0 5px 0; 
text-align:center;
list-style-type:none;
}
nav ul li{
margin: 0;
padding:0 0 5px 0!important;  
}  
nav ul li a, nav ul li a:link, nav ul li a:visited, nav ul li a:active{
display:block!important;
font-family:Lato,Arial;
font-size:1em !important; 
font-weight:normal;
text-align:center;
color:#000; 
margin:0;
padding:5px!important;   
text-decoration:none;  
outline-style:none; 
}  
nav ul li a:hover,
nav ul li a.current, nav li a:link.current, nav li a:visited.current, nav li a:active.current{    
display:block!important;
color:#ff0000;   
font-weight:normal; 
margin:0;
padding:5px !important;   
text-decoration:underline;  
outline-style:none;  
/*border-bottom:none!important;*/
}
/*i{
position:absolute;
z-index:2;
font-size:24px;
color:#fff;
padding:0 50px 10px 0;
}
i:hover{
font-size:24px;
color:#ff0000;
}*/
.maintext{
flex:100%;
margin:0 0 10px 0;
padding:0;
}
.text{
font-size:0.9rem;
}
.pdf{
display:none;
}
.pdfmob{
display:inline-block;
}
.sidebar{
flex:100%;
margin:0 0 20px 0;
padding:0;
}
.imgsidebarbox{
width:100%;
max-width:100px;
margin:0 auto 0 auto;
}
.sponsors{
margin:10px auto 10px auto;
}
.imgsponsors{
width:100%;
max-width:75px;
height:auto;
margin:5px;
box-shadow: 2px 2px 10px #000;
}
img.bd{
width:100%;
max-width:125px;
margin:5px 5px 10px 5px;
}
a.kaartwtp, a:link.kaartwtp, a:visited.kaartwtp, a:active.kaartwtp{
width:100px;
font-size:0.8rem;
background-image: url(../images/sidebar/wereldtijdpad/kaartbg.jpg);
background-position: 100% 0;
background-repeat: no-repeat;
}
a:hover.kaartwtp{
width:100px;
font-size:0.8rem;background-image: url(../images/sidebar/wereldtijdpad/kaartbghover.jpg);
background-position: 100% 0;
background-repeat: no-repeat;
}
ul, ol{
font-size:0.9rem;
}
.backtop a{
position:fixed;
right:0;
bottom:-5px;
width:35px;
height:35px;
z-index:80;
background-image: url('../images/backtopmob.png');
background-position: 0 0;
background-repeat: no-repeat;
text-decoration:none;  
outline-style:none; 
cursor:pointer;
}
h1{
font-size:1.5rem;
}
.footernav{ 
display:flex;
flex-flow:column nowrap;
width:auto;
width:0 auto 0 auto;
} 
.footernav li a, .footernav li a:link, .footernav li a:visited, .footernav li a:active{
font-size:0.9rem;
}
.footerbox{
display:flex;
flex-flow:row-wrap;
justify-content:space-around;
width:auto;
margin:0 auto 0 auto;
}
.kopfooterbox{
font-size:1.1rem;
}
ul.adresbox{
justify-content:center;    
font-size:0.8rem;                           
}
img.paneelpic,img.paneelpic:hover{
max-width:200px;
}
.spanpaneel,.spanpaneel:hover{
max-width:200px;
}
h4.tel{
font-style:italic;
font-size:0.9rem;
color:#000;
font-weight:normal;
}
.telmobiel{
display:block;
}
.teldesktop{
display:none;
}
.historiefbbox{
max-width:150px;
font-size:1.1rem;

}
}