@import url(https://fonts.googleapis.com/css?family=Karla:400:700);
@import url(https://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,600);

html{height:100%;background:#fff;}
body{min-height:100%;color:#333;line-height:1.2;font-weight:300;margin:0 auto;padding:0 .5em;background:#fff;font-size:100%;font-family:'Karla', sans-serif;}
*,:before,:after{margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}

a {text-decoration:none;color:#333;}
.screen a:hover {color:#000;}
a.active,  a:hover {text-decoration:underline;}

blockquote{display:block;margin: .5em 0;padding-left:2em;}
blockquote:before{content:'–';position:absolute;margin-left:-1em;}
header {min-height:6em;margin:2em 0 0em 0;}
header a{display:inline-block;padding:1rem;}
header h2 {margin:0;font-size:140%}
h3 {font-size:20px;}
nav ul{list-style:none;margin:0;padding:0;}
nav ul li{display:inline-block;}
nav ul li a{display:block;margin-right:1em;}
nav ul li a.active, nav ul li a:hover {color:#000;}

ul.asd {list-style:none;padding:0;}
ul.asd li {display:block;margin-bottom: 1em;	}
ul.asd li a{display:block;padding:.5em 0 0 0;margin-right:1em;color:#666;}
/*ul.asd li a:before {content:'·'; position:absolute;margin-left:-1em;}*/
ul.asd li a.active, ul.asd li a:hover {color:#000;}

ul.mnu {}
li.hm {font-size: 140%;}
ul.sub {position:absolute;background:#fff;border:1px solid;;z-index:100;display:none;padding:.5em 0;}
ul.sub li {display:block;}
ul.sub li a{padding:.5em 1em;}
main {position:relative}
article {}
h1,h2,h3,h4,h5,p {margin-bottom:.5em;font-weight: 300}
strong {font-weight:700;}
h4 {font-size:90%;}
.h1, h1 {font-size:150%}
.c0,.c1,.c2,.c3,.c35,.c4, .c-6 {display:inline-block;vertical-align: top;flex:none;}
.c0 {width:12.5%}
.c1 {width:25%}
.c2 {width:50%}
.c35 {width:87.5%}
.c3 {width:75%}

.c-6 {width:16.66%}
.c4 {width:100%}
.c5 {display:block;}
.pd{padding:1rem;}
.pd5{padding:.5rem;}
.ph{padding:0 1rem;}
.ph2{padding:0 2rem;}
.pv{padding:1rem 0;}
.mt{margin-top:1em}
.mb{margin-bottom:1em}
.br {border-right:1px solid #eee;}
.small {font-size:90%;}
.rgt {text-align: right;}
.grey, .grey a {color:rgba(0,0,0,.4)}
img {    max-width: 100%;}
.flex-w{display:flex;flex-direction: column;}
.flex-c{display: flex;flex:1;}
.blue {color:rgb(1, 154, 255)}
.thu {padding-top:75%; background-position: center center; background-size: cover;position:relative;}
.thu.pano {padding-top:40%;}
.thu small {position:absolute;bottom:0;padding:0 .5em;display:none;background:rgba(255,255,255,.9) ;width:100%;}
.thu:hover small {display: block;}
.swiper-container {width: 100%;height: 100%;}
.swiper-slide {}
.dbg{background:rgba(185, 195, 193, 0.3)}
/*.swiper-slide article{  font-size:90%;  height: 100%;overflow-y: scroll;-webkit-overflow-scrolling: touch;padding-top: 7em;}*/
.swiper-container .pagination{position:absolute;bottom:0;left:0;padding:1em;}
.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2;margin:.2em;cursor:pointer;}
.swiper-pagination-bullet:hover, .swiper-pagination-bullet-active {opacity:.8;}
hr {border:none;border-top:1px solid #eee; margin:.5em 0;	}
.poem {font-family:Crimson Text;font-size:110%;line-height:1.4;background:rgba(185, 195, 193, 0.3);}

.full-image img{width:100% !important;height:auto;}
label {font-size:90%;}
input {display: block;border:1px solid rgba(0,0,0,.2) !important;border-radius:2em;padding:.7em 1em;font-size:100%;width:100%;}
input[type=submit]{width: auto;
    background: #333;
    color: #eaeded;
    border-radius: 0.3em;margin-top:2em;}

::-webkit-input-placeholder {color: #ccc;}
::-moz-placeholder { color: #ccc; }
:-ms-input-placeholder { color: #ccc; }

select{width:100%;visibility: hidden;}

.noUi-connect {box-shadow: none;background:#eee;}
.noUi-target {box-shadow:none;background:#fff;}
.select2-container--default .select2-selection--multiple .select2-selection__choice {border: none;background:#B9D0DE;padding:1em;border-radius:2em;}
.select2-selection__rendered li{display:block;float:none !important;}
.select2-search .select2-search__field{margin:0 !important;;}



#inloggen {    position: absolute;
    top: 2.3rem;
    right: 1rem;
    font-size:90%;}
    #inloggen a{padding:.5rem 0;}
#result .c1{height:100%;background:#dfe;}
.fam {border:1px solid rgba(0,0,0,.2);margin-bottom:1em;height:5rem;position:relative;cursor:pointer;}
.fam:hover{border-color:#0f0;}


.fam-inner{padding:.5em;}
/* .fam a {pointer-events: none;cursor: default;}*/
.fam.active {border-color:#000;}
.fam.mt{margin-top:7em;}
.fam.mt2{margin-top:19em;}
.fam.active p {font-weight:700;}
.fam time{display:inline-block;min-width:2em;}

.fam.fork:before{content:'';position:absolute;top:50%;left:100%;width:2rem;border-top:1px solid;border-color:inherit}
.fam.bfork:before{content:'';position:absolute;bottom:50%;left:-1rem;width:1rem;border-bottom:1px solid;border-left:1px solid;border-color:inherit;height:6em;}
.fam.mt.bfork:before{height:12em;}
.fam.mt2.bfork:before{height:24em}
.fam.fst.bfork:before{left:-2rem;width:2rem;height:0;}

.fam.fork-back:before {content: '';
    position: absolute;
    width: 15px;
    height: 6rem;
    left: -16px;
    border-left: 1px solid rgba(0,0,0,.2);
    border-bottom: 1px solid rgba(0,0,0,.2);
    top: -3.5rem;}
.fam.fork-back.fst:before {border-left: none;width:30px;left:-30px;}
    
.fam p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.fam.male {padding-left:1em;	}
.fam.female {padding-left:1em;	}
.fam.male:after {content:'';width:1em;height:50%;background:#B8DDE8;position:absolute;right:0em;top:0em;}
.fam.female:after {content:'';width:1em;height:50%;background:#EBBAD5;position:absolute;right:0em;top:0em;}
.fam.bfork:after{width:.5em;left:0;height:100%;}


form {background: 	rgba(185, 195, 193, 0.3);padding:1em;}
form input {border-radius:0;font-size:90%;margin:.5em 0;}
.alert {color:#ce7575}
.spcr {}
.read {max-width:40em;line-height:1.4;}
.read ul {display:block;margin-bottom:2em;margin-left:0;	padding-left:1em;}
.read ul li {margin-bottom:.5em;}

.yrs {margin-left: 36%;}
.yr {position:relative;height:4rem;border-right:1px solid rgba(0,0,0,.2);padding-left: 3em;}
.yr:before{content:'';position:absolute;top:.5rem;right:0;width:1rem;border-top:1px solid rgba(0,0,0,.2)}
.yr:after{content:'';position:absolute;top:2.5rem;right:0;width:.5rem;border-top:1px solid rgba(0,0,0,.2)}
.yr .item {position:absolute;top:.5em;	padding:.5em;width:250%;border:1px solid rgba(0,0,0,.2);background:#fff;font-size:90%;height: 4em;overflow: hidden;z-index:1;}
.yr .item:hover {height:auto;z-index:10;cursor:pointer;background:#def;min-height: 4em;}
.yr .item img {float:left;max-width:4em;max-height:3em;margin-right:1em;}

.ll.hst {background:#f3e4eb;}
.ll.fam {background:#e3ece3;}
.ll.hst:hover {background:#f3e4eb;}
.ll.fam:hover {background:#e3ece3;}

.spacer {margin:.25em 0 .25em 22%;width:1em;height:.25em;border:1px double rgba(0,0,0,.2);border-left:none;border-right:none;}
/*.yr .item:before {content:'';position:absolute;top:-1px;left:-1em;width:1rem;border-top:1px solid rgba(0,0,0,.2)}*/

.no-descriptions .read{display:none;}
.itmz {display:block;margin-bottom:1em;;}
.itmz img{ max-width:100%;}

#temp {position:absolute; min-width:30em;max-width:100%;margin:1em;color:#fff;top:5em;bottom:0;overflow:auto;z-index:100;}
#temp ul {list-style:none;margin:0;padding:0;border: 1px solid #B9D0DE;border-bottom: 0;}

#temp a {padding: 1em;
    display: block;
    border-bottom: 1px solid #B9D0DE;
    background: #fff;}

#pp {position:absolute; padding:1em; background: #fff;z-index:100;border:1px solid rgba(0,0,0,.5);}
#pp:before{content:'';	position:absolute;left:50%;top:-.5em;margin-left:-.2em;width: 0; 
	height: 0; 
	border-left: .5em solid transparent;
	border-right: .5em solid transparent;
	
	border-bottom: .5em solid rgba(0,0,0,.5);}
#pp img {max-width:100%;max-height:24em;}
/* noui*/
.sliderbox {position:relative;padding:2em 2em 0 2em;height:5em;}
.min, .max {position:absolute;bottom:0;font-size:85%;color:#666;}
.min {left:1em;}
.max {right:1em;}