/* 
basemap1.css provides customised responsive design for concept 'nazka interactive mapps' on a leaflet-map
(c) 2015, nazka mapps
*/

@charset "utf-8";

.hidden { display: none; }
.unhidden { display: block; }

/* uit bootstrap */
.hide {
  display: none !important;
}

.show {
  display: block !important;
}
/*=================================================================*/
/* algemeen geldende eigenschappen - overgenomen uit bootstrap.css !!! should still be cleaned */ 

body {
  width: 100%;
  height: 100%;
  font-size: 14px;
  font-family: quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif; 
/*  line-height: 1.428571429; */ 
  color: #fff !important;
  background-color: #000 !important;
}

html {
  width: 100%;
  height: 100%;
  overflow-x:hidden;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

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

a:active,
a:hover {
  outline: 0;
}

a:hover,
a:focus {
  color: #000 !important;
  text-decoration: underline;
}

a:focus {
  outline: thin dotted #fff;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}



p {
  margin: 0 0 10px;
}

b,
strong {
  font-weight: bold;
}

dfn {
  font-style: italic;
}

small {
  font-size: 80%;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: Montserrat, quattrocento-sans;
  font-weight: 500;
  line-height: 1.1;
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small,
.h1 small,
.h2 small,
.h3 small,
.h4 small,
.h5 small,
.h6 small {
  font-weight: normal;
  line-height: 1;
  color: #999999;
}

h1,
h2,
h3 {
  margin-top: 5px !important;
  margin-bottom: 5px;
}

h4,
h5,
h6 {
  margin-top: 10px;
  margin-bottom: 10px;
}

h1,
.h1 {
  font-size: 32px;
}

h2,
.h2 {
  font-size: 20px;
}

h3,
.h3 {
  font-size: 24px;
}

h4,
.h4 {
  font-size: 18px;
}

h5,
.h5 {
  font-size: 14px;
}

h6,
.h6 {
  font-size: 12px;
}

h1 small,
.h1 small {
  font-size: 24px;
}

h2 small,
.h2 small {
  font-size: 18px;
}

h3 small,
.h3 small,
h4 small,
.h4 small {
  font-size: 14px;
}

/* images */
img {
  border: 0;
  vertical-align: middle;
}

.img-rounded {
  border-radius: 6px;
}
.img-circle {
  border-radius: 50%;
}

.logo {
	padding: 10px 20px 10px 20px !important;
}

.logo:hover,
.logo:focus,
.logo.active {
    background-color: #fff;
}
/*
.icon {
	height:25px; 
	width:25px;
	cursor: help;
}
*/

/*font*/
.light {
    font-weight: 400;
}

.fat {
	font-weight:900;
}

.fatitalic {
	font-weight:600;
	font-style:italic;
}

.italic {
	font-style:italic;
}

.center {
	text-align:center;
}

.alignrechts {
	text-align: right;
}
.zondermargin {
	margin: 0px !important;
}

/* navbar - header */
.navbar {
	margin-bottom: 0;
    text-transform: uppercase;
    font-family: Montserrat, quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif;
    background-color: #000;
/*	font-size: 16px;*/
}

.navbar-brand {
    font-weight: 700;
}

.navbar-brand:focus {
    outline: 0;
}

.navbar-brand:hover {
    background-color: rgb(255,255,255);
		filter: alpha(opacity=50); /* internet explorer */
		opacity: 0.5; /* fx, safari, opera, chrome */
 		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; /*IE8*/
}

.navbar-custom a {
    color: #fff;
}

.navbar-custom .nav li a {
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
}

.navbar-custom .nav li a:hover,
.navbar-custom .nav li a:focus,
.navbar-custom .nav li.active {
    outline: 0;
    background-color: rgb(255,255,255);
		filter: alpha(opacity=50); /* internet explorer */
		opacity: 0.5; /* fx, safari, opera, chrome */
 		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; /*IE8*/
}

.navbar-toggle {
    padding: 4px 6px;
    font-size: 16px;
    color: #fff;
}

.navbar-toggle:focus,
.navbar-toggle:active {
    outline: 0;
}


.brand-heading {
    font-size: 40px;
}
/*
.page-scroll {
	font-size:16px;
}
*/
/*
@media(min-width:767px) {
.navbar {
	padding: 0px 0px 0px 0px;
	border-bottom: 0;
	letter-spacing: 1px;
	background: 0 0;
	-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
	-moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
	transition: background .5s ease-in-out,padding .5s ease-in-out;
}

.top-nav-collapse {
	padding: 0;
	background-color: #000;
}

.navbar-custom.navbar-fixed-top {
      border-bottom: 1px solid rgba(255,255,255,.3);
}
}
*/


/* buttons */

.btn-circle {
    width: 70px;
    height: 70px;
    margin-top: 15px;
    padding: 7px 16px;
    border: 2px solid #28C3AB; /*#fff;*/
    border-radius: 35px;
    font-size: 40px;
    color: #28C3AB; /*#fff;*/
    background: #fff; /*0 0;*/
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
}

.btn-circle:hover,
.btn-circle:focus {
    outline: 0;
    color: #333; /*#fff;*/
    background: #28C3AB; /*rgba(255,255,255,.1);*/
	border: none;
}

.page-scroll .btn-circle i.animated {
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 1s;
    -moz-transition-property: -moz-transform;
    -moz-transition-duration: 1s;
}

.page-scroll .btn-circle:hover i.animated {
    -webkit-animation-name: pulse;
    -moz-animation-name: pulse;
    -webkit-animation-duration: 1.5s;
    -moz-animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
}

.btn {
	background-color: #000 !important;
	color: #fff !important;
	font-variant:small-caps;
	font-weight: 800 !important;
	padding: 5px 5px;
	  -webkit-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25); 
	  -moz-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25); 
	box-shadow: inset 0px -2px 1px rgba(0, 0, 0, 0.45), 0px 1px 1px rgba(0, 0, 0, 0.25); 
	outline-width: 0; 
	  -webkit-border-radius: 5px;	
	  -moz-border-radius: 5px; 
	border-radius: 5px;
}
.btn:hover {
	background-color: #fff !important;
	color: #000 !important;
		-webkit-box-shadow: 0; 
		-moz-box-shadow: 0; 
	box-shadow: 0; 
}

.btn-click  {
	background-color: #fff !important;
	color: #000 !important;
	padding: 2px 5px;
	  -webkit-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25); 
	  -moz-box-shadow: inset 0px -3px 1px rgba(0, 0, 0, 0.45), 0px 2px 2px rgba(0, 0, 0, 0.25); 
	box-shadow: inset 0px -2px 1px rgba(0, 0, 0, 0.45), 0px 1px 1px rgba(0, 0, 0, 0.25); 
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	outline-width: 0; 
	  -webkit-border-radius: 5px;	
	  -moz-border-radius: 5px; 
	border-radius: 5px;
}

.btn-click:hover {
	background-color: #000 !important;
	color: #fff !important;
}

/* interactive guide + data-loading */
#startboodschap-txt {
	position:absolute;
    left: 320px;
	top: 60px;
	width: 300px;
	height: 250px;
	background: rgba(255,255,255,0.9) ;  /*ervoor (255, 255, 255, 1) wit*/
	filter: alpha(opacity=90); /* internet explorer */
    opacity: 0.9; /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=90)"; /*IE8*/
	border:thin #FFFFFF solid;
	border-radius: 5px;
	-webkit-box-shadow: 4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	-moz-box-shadow:    4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	box-shadow:         4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	padding: 10px 10px 5px 10px;
	display: block;
	overflow: hidden;
	z-index: 100;
	color: #000;
	font-size: 0.8em;
	font-weight: 500;
}

#data-loading {
	position:absolute;
    left: 25%;
	right: 25%;
	top: 50%;
	width: 50%;
	height: auto;
	background: rgba(255,255,255,1) ;  /*ervoor (255, 255, 255, 1) wit*/
		filter: alpha(opacity=100); /* internet explorer */
		opacity: 1; /* fx, safari, opera, chrome */
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; /*IE8*/
	border:thin #FFFFFF solid;
	border-radius: 5px;
	-webkit-box-shadow: 4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	-moz-box-shadow:    4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	box-shadow:         4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	padding: 10px 10px 5px 10px;
	display: block;
	overflow: hidden;
	z-index: 3000;
	color: #000;
	font-size: 1em;
	font-weight: 500;
	text-align: center;
}

#loading-spin {
	height: 60px;
	position:relative;
	bottom: 0px;
}

#startboodschap-txt h3, #volgboodschap1-txt h3, #volgboodschap2-txt h3{
	font-size: 20px;
	font-weight:700;
	font-variant:small-caps;
}

#sluit {
    position:relative;
	text-align:center;
	float: center;
	clear: none;
	margin-right: 20px;
	margin-top: 0px;
}

#sluit2 {
    position:relative;
	text-align:center;
	float: center;
	clear: none;
	margin-right: 20px;
	margin-top: 10px;
	margin-top: 10px;
}

#sluit3 {
    position:relative;
	text-align:center;
	float: right;
	clear: none;
}

#volgboodschap1-txt {
	position:absolute;
    right: 50px;
	top: 90px;
	width: 250px;
	height: 310px;
	background: rgba(255,255,255,1) ;  /*ervoor (255, 255, 255, 1) wit*/
	filter: alpha(opacity=100); /* internet explorer */
    opacity: 1; /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; /*IE8*/
	border:thin #FFFFFF solid;
	border-radius: 5px;
	-webkit-box-shadow: 4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	-moz-box-shadow:    4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	box-shadow:         4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	padding: 0px 10px 5px 10px;
	display: none;
	overflow: hidden;
	z-index: 100;
	color: #777;
	font-size: 1.1em;
	font-weight: 500;
}

#volgboodschap2-txt {
	position:absolute;
    left: 283px;
	top: 410px;
	width: 400px;
	height: 210px;
	background: rgba(255,255,255,1) ;  /*ervoor (255, 255, 255, 1) wit*/
	filter: alpha(opacity=100); /* internet explorer */
    opacity: 1; /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; /*IE8*/
	border:thin #FFFFFF solid;
	border-radius: 5px;
	-webkit-box-shadow: 4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	-moz-box-shadow:    4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	box-shadow:         4px 4px 2px 0px rgba(50, 50, 50, 0.3);
	padding: 0px 10px 5px 10px;
	display: none;
	overflow: hidden;
	z-index: 100;
	color: #777;
	font-size: 1.1em;
	font-weight: 500;
}

#volgboodschap1-txt p, #volgboodschap2-txt p{
	text-align:right;
}

#volgende {
    position:relative;
	text-align:center;
	float: right;
	clear: none;
	margin-right: 20px;
	margin-top: 10px;
}

#volgende2 {
    position:relative;
	text-align:center;
	float: right;
	clear: none;
	margin-right: 20px;
	margin-top: 10px;
}


/*=============================================================================*/
/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default */


/* map van leaflet */
#map { 
	position:absolute;
	float: none; 
	clear: none;
	top: 50px; 
	bottom:0px; 
	width:100%;
	z-index: 1;
	background-color: #000;
}

#map-ui {
    position: absolute;
    top: 0px;
    list-style: none;
    margin: 0;
    padding: 0;
    z-index: 100;
}

/* solution if titles of navbar are too long | standard OFF */
/*
@media(min-width:767px) and (max-width: 992px) {
#map {
   margin-top: 50px;
}

#startboodschap-txt {
	top: 110px;
}
}
*/ 

/*
#map-ui a {
    background: #FFF;
    color: #3C4E5A;
    display: block;
    margin: 0;
    padding: 0;
    border: 1px solid #BBB;
    border-bottom-width: 0;
    min-width: 138px;
    padding: 10px;
    text-decoration: none;
}

#map-ui a:hover {
    background: #ECF5FA;
}

#map-ui li:last-child a {
    border-bottom-width: 1px;
    -webkit-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
}

#map-ui li:first-child a {
    -webkit-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
}

#map-ui a.active {
    background: #3887BE;
    border-color: #3887BE;
    border-top-color: #FFF;
    color: #FFF;
} 

*/ 
/* =============================================================== */
/* divs, modals en rest */
.modal-dialog {
	font-family: quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif;
}

.modal-title {
		color: #333;
}

.modal-body {
	padding: 0px !important;
}

.modal-body p{
	padding-left: 20px !important;
	padding-right: 20px !important;
	padding-top: 10px !important;
	font-size:14px;
}

.modal-footer {
	margin-top: 0px !important;
	padding: 10px !important;
}

.modal-footer p {
	margin-bottom: 0px !important;
	margin right: 20px;
}

.icon {
	height:25px; 
	width:25px;
	cursor: help;
}

/* ************************************************************ */

/* fiche layout */

#fichecontainer {
	color: #000;
    position:absolute;
	top: 10px;
	right: 60px;
    width: 400px;
	height: auto;
	z-index: 122;
	background:rgba(255, 255, 255, 0.5);
		background: #FFFFFF;
		filter: alpha(opacity=90); /* internet explorer */
		opacity: 0.9; /* fx, safari, opera, chrome */
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=90)"; /*IE8*/
	font-size: 0.8em;
	overflow-x: hidden;
	overflow-y: hidden;
	border-radius: 5px;
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
}

#fiche {
	position: relative;
	clear: both;
    width: 100%;
}

#klapweg {
    position:relative;
	float: left;
    width:25px;
	top: 0; 
	z-index:102;
}


#fichecontent {
    position:relative;
	float: left;
    width: 375px;
	border-left:rgba(51, 51, 51, 0.2) solid 1px;
}

#div-el {
	clear: both;
	float: left;
	width: 100%;
	display: block;
	text-align: center;
	margin-bottom: 2px;
	padding: 0px 5px 0px 5px;
}

#divleft {
	float:left;
	width: 49%;
}

#divright {
	clear: none;
	text-align: center;
	float:left; 
	width: 49%;
	margin-left:2px;
}

#divright p{
	clear: none;
	text-align: left;
	padding-left: 10px;
	padding-right: 20px; /* // om deel van de tekst niet onder de scroll-bar te laten komen*/
	display: table-cell; 
	vertical-align: middle; 
}

/* gauge */


/*
#afb {
	float: left;
	display: block;
	overflow: hidden;
	height: 160px;
	width: 200px;
	z-index: 102;
	outline:rgb(0,0,0) solid 2px;
	margin-top: 5px;
	margin-left: 10px;
	margin-bottom: 5px;
}
*/
/* ************************************************************ */



/* klapin en klapuit pijltjes*/

.img-arrow {
	height:25px; 
	width: 25px;
}

.img-arrow:hover {
		filter: alpha(opacity=50); /* internet explorer */
		opacity: 0.5; /* fx, safari, opera, chrome */
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; /*IE8*/
}

#klapuit {
    position:absolute;
    top:45px;
	right: 0px;
    width:25px;
	z-index:10;
}

#klapin{
    position:absolute;
    top:232px;
	right: 0px;
    width:25px;
	z-index:11;
}

/* open en close pijltjes*/

#open {
    position:absolute;
    bottom: 0px;
	right: 0px;
    width:25px;
	z-index:10;
}

#close {
    position:absolute;
    bottom: 0px;
	right: 0px;
    width: 25px;
	z-index:11;
	display: none;
}

/* ******************************************************************** */

@-webkit-keyframes pulse {    
    0 {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes pulse {    
    0 {
        -moz-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
}


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}

/* Extra Large devices (extralarge desktops, 1400px and up) */
@media (min-width: 1400px) {
}




/* ==============================================================================*/
/* specifiek extra voor leaflet of leaflet plugins */

/*toggling layers*/
/* ========================================================= */
/*
.menu-ui {
  background: #fff;
  position:absolute;
  top:150px;
  left:0px;
  z-index:100;
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px;
  width:80px;
  border:2px solid rgba(255,255,255,.6);
  }
  .menu-ui a {
    font-size:18px;
	font-variant:small-caps;
    color:#428bca;
    display:block;
    margin:0;
	padding:0;
    padding:10px;
    text-decoration:none;
    text-align:center;
    }
    .menu-ui a:first-child {
      border-radius:0px 3px 0 0;
      }
    .menu-ui a:last-child {
      border-radius:0 3px 0px 0px;
      }
    .menu-ui a:hover {
	background-color: #fff;
	color:#428bca;
	font-size: 24px;
	text-decoration:none;
      }
    .menu-ui a.active {
	background-color: #a1e5d8;
	color:rgba(255,255,255,1);
	border-bottom:1px dashed rgba(255,255,255,0.5); 
	font-size: 24px;
	text-decoration:none;
      }
      .menu-ui a.active:hover {
	background-color: #a1e5d8;
	color:rgba(255,255,255,.8);
	font-size: 18px;
        }
/* ========================================================= */

/* general typography */

/* .leaflet-top {
	margin-top: 10px !important;
	} */

.leaflet-container {
	font: 14px/1.5 quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif;
	}

/* general toolbar styles */
.leaflet-bar a,
.leaflet-bar a:hover {
	background-color: #fff;
	border-bottom: 1px solid #ccc; /*border-right: 1px solid #ccc; voorheen bij zoom horizontaal naastelkaar */
	width: 36px !important;
	height: 36px !important;
	line-height: 36px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
	
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius:4px; /*border-bottom-left-radius: 4px; voorheen bij zoom horizontaal naast elkaar */ 
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius:4px; /*border-top-right-radius: 4px;  voorheen bij zoom horizontaal naast elkaar */ 
	border-bottom-right-radius: 4px; 
	border-bottom: none;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 24px quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif; /* origineel = font: bold 18px 'Lucida Console', Monaco, monospace;*/
	text-indent: 1px;
/*	float: left; /*om de zoom-control-knoppen horizontaal naasteen te zetten*/
	}
.leaflet-control-zoom-out {
	font-size: 26px; 
	}

.leaflet-touch .leaflet-control-zoom-in {
	font-size: 28px; 
	}
.leaflet-touch .leaflet-control-zoom-out {
	font-size: 30px; 
	}

/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	overflow-y: auto;
	}
.leaflet-control-layers-toggle {
	background-image: url(images/layers.png);
	background-size: 30px 30px;
	width: 36px; /*ervoor 72px*/
	height: 36px; /*ervoor 72px*/
	}

.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(images/layers-2x.png);
	background-size: 30px 30px; /*ervoor 26px 26px*/
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 36px; /*ervoor 72px*/
	height: 36px; /*ervoor 72px*/
	}

.leaflet-control-layers-expanded {
	background-color: #000 !important;
/*	padding: 6px 6px 6px 6px; */
	color: #fff !important;
	}


.leaflet-control-layers-selector, input[type=checkbox] {
	width: 16px;
	height: 16px;
	color: #2A6496;
}


/* popup */
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	color: #333; /*toegevoegd*/
	}
.leaflet-popup-content {
	margin: 10px 13px;  /* origineel slechts 2 waarden: gelijk voor L&R T&B 13px  19px */
	line-height: 1.2;   /* origineel 1.4 */
	}
	
.leaflet-popup-content p {
	margin-top: 4px !important;
	margin-bottom: 8px !important;
	}
	
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
/*	background:rgba(90, 90, 90, 0.9); /*	background: white; = origineel - uitgeschakeld */
	background: #fff; /*#5A5A5A;*/
	filter: alpha(opacity=90); /* internet explorer */
    opacity: 0.90; /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=90)"; /*IE8*/
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	padding: 4px 4px 0 0;
	text-align: center;
	width: 18px;
	height: 14px;
	font: 16px quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif;  /* origineel =font: 16px/14px Tahoma, Verdana, sans-serif; */
	color: #c3c3c3;
	text-decoration: none;
	font-weight: bold;
	background: transparent;
	z-index: 3000; /* dit zorgt ervoor dat de x terug verschijnt (popup zelf kwam boven close-button te liggen en was daardoor niet meer klikbaar! */
	}
	
.leaflet-popup-content h4 {
	color: #7d0207;
	font-weight:800;
	border-bottom: #7d0207 thin solid;
/*	background: #8fd6b8; /*#5A5A5A;*/
/*	filter: alpha(opacity=50); /* internet explorer */
/*    opacity: 0.5; /* fx, safari, opera, chrome */
/*    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; /*IE8*/
	}	
.leaflet-popup-content #foto {
	bottom: 0;
	width: 100%;
	height: 80px;
	background-size:cover;
	background-position:bottom;
}

/* div icon */
.leaflet-div-icon {
	width: 30px !important;
	height: 30px !important;
	background-color: white;
	}
	

/*marker cluster classes */
.Xcluster {
	background-color: #f15737 ;
	text-align: center;
	font-size: 24px;
	color: #fff;
	border-radius: 20px;
	filter: alpha(opacity=80); /* internet explorer */
    opacity: 0.8; /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=80)"; /*IE8*/
}
 	
/*geosearch.css integrated */
.leaflet-center {
	width: 250px;
	margin-left: auto;
	margin-right: auto;
	position: absolute;
	float: left; /*was ervoor right*/
	left: 100px; /*deze lijn is zelf toegevoegd*/
	padding-right: 50px;
}
.leaflet-control-geosearch, .leaflet-control-geosearch ul {
	border-radius: 7px;
	background: none repeat scroll 0 0 rgba(0, 0, 0, 0.15);
	margin: 10px 0 0 0;
	padding: 5px;
	width: 100%;
	height: auto;
}
.leaflet-control-geosearch-msg ul {
	list-style: none;
	display: none;
	height: auto;
	background: none;
	padding: 0;
}
.leaflet-control-geosearch ul li {
	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.85);
    border-radius: 4px;
    margin: 2px 0;
    padding: 4px;
    font: 14px sans-serif;
    text-indent: 4px;
}
.leaflet-container .leaflet-control-geosearch input {
	width: 100%;
	height: 28px;
	padding: 0;
	font: 14px quattrocento-sans; /*zelf toegevoegd*/
	text-indent: 8px;
	background: rgba(255, 255, 255, 0.8);			
	border-radius: 4px;
	border: none;
}

/* StyledControlLayer */
/* deel gekopieerd van StyledControlLayer.css */
.ac-container{
	width: auto;
	margin: 0; /* ori: 10px auto 10px auto; */
	text-align: left;
	overflow-y: hidden;/*ori: auto;*/
	overflow-x: hidden;
	height: auto;
}
.ac-container label{
	font-family: quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif;  /*'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;*/
	padding: 5px 5px 5px 5px; /* ori: 5px 20px; */
	position: relative; /* removes borders on active layers */
	margin-bottom: 2px !important;
	border-radius: 5px 5px 0px 0px;	
	z-index: 20;
	display: block;
	height: 30px;
	cursor: pointer;
	color: #fff;
	text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
	line-height: 33px;
	font-size: 19px; /* ori: 19px*/
	background: #000 url(images/arrow_down.png) no-repeat right; /* ori  background: #000  && no background-position-x*/
	background-position-x: 93.1%;
/*	box-shadow: 
		0px 0px 0px 1px rgba(155,155,155,0.1),
		0px 2px 3px rgba(255,255,255,1); */
	box-shadow: 
		0px 0px 0px 1px rgba(155,155,155,0.1), 
		0px -1px 1px rgba(255,255,255,1);
	font-weight: 400;
	font-variant:small-caps;
}
.ac-container label:hover{
	background-color: #fff;
/*		filter: alpha(opacity=70); /* internet explorer */
/*		opacity: 0.7; /* fx, safari, opera, chrome */
/* 		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=70)"; /*IE8*/
	color: rgba(0,0,0,1);
}
.ac-container input.menu:checked + label,
.ac-container input.menu:checked + label:hover{
	color: #000;
	background: #fff; /*ori #c6e1ec;*/
	box-shadow: 
		0px 0px 0px 2px rgba(0,0,0,0.9), 
		0px 2px 3px rgba(155,155,155,1);
}
.ac-container label:hover:after,
.ac-container input.menu:checked + label:hover:after{
	content: '';
	position: absolute;
	width: 24px;
	height: 24px;
	right: 13px;
	top: 7px;
	background: transparent url(images/arrow_down.png) no-repeat center center;
}
.ac-container input.menu:checked + label:hover:after{
	background-image: url(images/arrow_up.png);
}
.ac-container input.menu{
	display: none; 
}
.ac-container article{
	background: rgba(255, 255, 255, 0.5);
	margin-top: -1px;
	margin-bottom: 5px;
	margin-left: 30px;
	border-radius: 0px 0px 10px 10px;
	overflow: hidden;
	height: 0px;
	position: relative;
	z-index: 10;
	-webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
}

.ac-container input.menu:checked ~ article{
	-webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
}

.ac-container input.menu:checked ~ article.ac-large{
	height: auto;
	max-height : 100px;
	background-color : #FFF;
/*	padding-top: 5px; */
	overflow-y: auto;
}

.menu-item-radio{
	font-family: quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif; /*'Ubuntu-Regular', Arial, sans-serif;*/
	font-size: 14px; /* ori 13px */
/*	font-variant:small-caps;*/
	padding-left: 10px;
	color: #000; /*#428bca;*/
	background-color: #fff;
}

.menu-item-checkbox{
	font-family: quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif; /*'Ubuntu-Regular', Arial, sans-serif;*/
	font-size: 14px; /* ori 13px */
/*	font-variant:small-caps;*/
	padding-left: 10px;
	color: #000; /*#428bca;*/
	background-color: #fff;
}


/*Toevoeging van classe base in javascript StyledControlLayers bij opbouw van de basemaps layout*/
/*
.base {
	background: #ffffbb !important;
}

.ac-container .base input.menu:checked + label, .ac-container .base input.menu:checked + label:hover {
	background: #FFC !important;
}
*/

/* Markercluster classes */
.markercluster {
	background-color: #fff; /*#f64779 ; */
	text-align: center;
	font-size: 20px;
	color: #000;
	border-radius: 20px;
	filter: alpha(opacity=80); /* internet explorer */
    opacity: 0.8; /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=80)"; /*IE8*/
}


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.leaflet-left {
	left: 0px; /*was voordien 0 */
	}

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.leaflet-center {
/*	width: 55%; /*was ervoor 40%*/
/*	max-width: 440px; */
	width: 440px;
	left: 100px !important; /*deze lijn is zelf toegevoegd*/
}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}

/* popovers --- Start */

.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 101;
  display: none;
  width: 200px;
  padding: 1px;
  text-align: left;
  white-space: normal;
  background-color: white;
  color: rgb (90, 90, 90); /*voorheen black */
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  background-clip: padding-box;
  font-size: 12px;
  font-weight: normal;
  line-height: 14px;
}

.popover.top {
  margin-top: -10px;
}

.popover.right {
  margin-left: 10px;
}

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

.popover.left {
  margin-left: -10px;
}

.popover-title {
  padding: 8px 14px;
  margin: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
/*  background-color: rgba(90, 90, 90, 0.9);  /*voorheen #b8e356*/ 
    background: #5A5A5A;
	filter: alpha(opacity=90); /* internet explorer */
    opacity: 0.9; /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=90)"; /*IE8*/
  border-bottom: 1px solid #ebebeb;
  border-radius: 5px 5px 0 0;
  color: white; /*voorheen black */
}

.popover-content {
  padding: 9px 14px;
}

.popover .arrow,
.popover .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}

.popover .arrow {
  border-width: 11px;
}

.popover .arrow:after {
  border-width: 10px;
  content: " ";
}

.popover.top .arrow {
  bottom: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-color: #999999;
  border-top-color: rgba(0, 0, 0, 0.25);
  border-bottom-width: 0;
}

.popover.top .arrow:after {
  bottom: 1px;
  margin-left: -10px;
  border-top-color: #ffffff;
  border-bottom-width: 0;
  content: " ";
}

.popover.right .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-right-color: #999999;
  border-right-color: rgba(0, 0, 0, 0.25);
  border-left-width: 0;
}

.popover.right .arrow:after {
  bottom: -10px;
  left: 1px;
  border-right-color: #ffffff;
  border-left-width: 0;
  content: " ";
}

.popover.bottom .arrow {
  top: -11px;
  left: 50%;
  margin-left: -11px;
  border-bottom-color: #999999;
  border-bottom-color: rgba(0, 0, 0, 0.25);
  border-top-width: 0;
}

.popover.bottom .arrow:after {
  top: 1px;
  margin-left: -10px;
  border-bottom-color: #ffffff;
  border-top-width: 0;
  content: " ";
}

.popover.left .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-left-color: #999999;
  border-left-color: rgba(0, 0, 0, 0.25);
  border-right-width: 0;
}

.popover.left .arrow:after {
  right: 1px;
  bottom: -10px;
  border-left-color: #ffffff;
  border-right-width: 0;
  content: " ";
}

pre {
  white-space: pre-wrap;
}

svg:not(:root) {
  overflow: hidden;
}

code,
pre {
  font-family: quattrocento-sans, "Trebuchet MS", Helvetica, sans-serif; /* voorheen Monaco, Menlo, Consolas, "Courier New", monospace;*/
  font-size: 1em;
}

code {
  padding: 2px 4px;
  font-size: 100%; /*voorheen 90%*/
  color: rgb (51, 51, 51); /* voorheen #c7254e*/
  white-space: normal ; /* voorheen "nowrap" --> laat de txt op 1 lijn doorlopen, zelfs als de div te smal is, "normal" verdeelt de text dan op de volgende lijn */
  background-color: rgb (255, 255, 255) transparent; /*voorheen #f9f2f4 maar gaf een beige schijn achter het symbooltje */
  border-radius: 4px;
}

pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.428571429;
  color: #333333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #cccccc;
  border-radius: 4px;
}

pre code {
  padding: 0;
  font-size: inherit;
  color: inherit;
  white-space: pre-wrap;
  background-color: transparent;
  border: 0;
}
/* ------------ end popovers*/