/*reset*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, caption, tbody, tfoot, thead, table, tr, td, th,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

h1 {font-size:250%; font-family: raavi, arial, sans-serif;}
h2 {font-size:200%; font-family: raavi, arial, sans-serif;}
h3 {font-size:150%; font-family: raavi, arial, sans-serif;}
h4 {font-size:100%; font-family: raavi, arial, sans-serif; /*letter-spacing:1.1px;  color:#99391F  ; */ font-style: italic;/* font-weight:600; font-variant:small-caps; */ display: inline;}
h5 {font-size:80%;letter-spacing:1.2px;}
p {font-size:100%; font-family: raavi, arial, sans-serif;}


html{
height:auto;
background-color:#CCEBC1;
background:-moz-linear-gradient(top, #CCEBC1 ,#9BCD9B);
background:-webkit-gradient(linear, left top, left bottom, from(#ECF1EF), to(#9BCD9B));
}


/*#wrapper{
height:100%;
width:100%;
text-align:left;
}*/



body{
font-family:raavi, arial, sans-serif;
}

d/* iv.titel{
padding-left:0;
} */

h1 {font-size:250%; font-family: "times new roman",georgia,serif;}

h1.titel{
font-weight: normal;
font-size: 30pt;
color: #FF9900 /*#FFCC998*/;
}

div.titel
{
padding-top: 5%;
padding-left:12%;
text-align:center;
/*position: relative; 
Z-index:1*/
}

/* begin horizontaal menu */

ul.hormenu {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
	width:96.5%;
}

li.horli {
    float: left;
}

li.horli a, .dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
	
}

li.horli a:hover, .dropdown:hover .dropbtn {
    background-color: DarkOliveGreen;
}

li.horli.dropdown {
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

li.horli div.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
	Z-index:2
}

/* einde horizontaal menu */

/* houder die menu in het centrum zet*/
#houder {
position: fixed;
top: 60%; /*was 70%*/
left: 0%;
width: 90%; /*was 100%*/
height: 90%; /*was 100%*/
overflow: visible;
Z-index:0;
/*border:1px solid yellow;*/
}

.sidebar {
left: 0%;
padding:0.8%;
position:absolute;
width:10.5%;
height:auto; /*schuifbalk menu bij zeer kleine beeldresolutie*/
top: -50%; /*	min helft van totale hoogte van de hele sidebar =42 hoger gezet i.v.m div browser resoluties ; van -47 naar -50 ivm te lage positie contact-button 20-07-2021*/
/*border:1px solid blue;*/
}

/* stijlen voor ie*/
.sidebarie {
left: 0%;
padding:1.8%;
position:absolute;
line-height:20%;
width:10.5%;
height:auto;
top:-48%;
/*border:1px solid blue;*/
}

.sidebarie  img{
margin-left:auto;
margin-right:auto;
width:74%;
}

a:hover img{
filter:alpha(opacity=70);
width:73%;
}

a{ 
border:0; /* remove dotted line aroud links in ie*/
outline:0;
}
/*Einde stijlen voor ie*/



ul.block li a:link,ul.block li a:visited, ul.block li a:hover{
display:block;
width:100%;
height:100%;
/*background-size: contain;*/
background-position:center;
/*border:1px solid red;*/
padding-top:26%;
padding-bottom:26%;
margin-top:2%; /*was 5*/
margin-bottom:2%; /*was 5*/
}

a:link{
color:#181818;
font-weight:bold;
text-decoration:none;
}

a.home:link{
background:url(home.png) no-repeat;
background-size: contain;
}

a.cv:link{
background:url(tasa.png) no-repeat;
background-size: contain;
}

a.cva:link{
background:url(cva.png) no-repeat;
background-size: contain;
}

a.gras:link{
background:url(grasp.png) no-repeat;
background-size: contain;
}

a.genea:link{
background:url(genealogieab.png) no-repeat;
background-size: contain;
}

a.agenda:link{
background:url(agenda.png) no-repeat;
background-size: contain;
}

a.links:link{
background:url(linkskl.png) no-repeat;
background-size: contain;
}

a.contact:link{
background:url(contactkl.png) no-repeat;
background-size: contain;
}

a:visited{
color:#181818;
font-weight: bold;
text-decoration: none;
}

a.home:visited{
background:url(home.png) no-repeat;
}

a.cv:visited{
background:url(tasa.png) no-repeat;
}

a.cva:visited{
background:url(cva.png) no-repeat;
}

a.gras:visited{
background:url(grasp.png) no-repeat;
}

a.genea:visited{
background:url(genealogieab.png) no-repeat;
}

a.agenda:visited{
background:url(agenda.png) no-repeat;
}

a.links:visited{
background:url(linkskl.png) no-repeat;
}

a.contact:visited{
background:url(contactkl.png) no-repeat;
}


a:hover{
color: #FABA2F;
font-weight: bold;
}

a.home:hover{
background:url(homeorange.png) no-repeat;
background-size: 80%;
}

a.cv:hover{
background:url(tasaorange.png) no-repeat;
background-size:73%;
}

a.cva:hover{
background:url(cvaorangeb.png) no-repeat;
background-size: 78%;
}

a.gras:hover{
background:url(grasporange.png) no-repeat;
background-size: 85%;
}

a.genea:hover{
background:url(genealogieabgorange.png) no-repeat;
background-size: 61%;
}

a.agenda:hover{
background:url(agendaorange.png) no-repeat;
background-size: 73%;
}

a.links:hover{
background:url(linksorangekl.png) no-repeat;
background-size: 75%;
}

a.contact:hover{
background:url(contactorangekl.png) no-repeat;
background-size: 83%;
}


a.home:active{
background:url(homeorange.png) no-repeat;
}

a.cv:active{
background:url(tasaorange.png) no-repeat;
}

a.cva:active{
background:url(cvaorangeb.png) no-repeat;
}

a.gras:active{
background:url(grasporange.png) no-repeat;
}

a.genea:active{
background:url(genealogieaborange.png) no-repeat;
}

a.agenda:active{
background:url(agendaorange.png) no-repeat;
}

a.links:active{
background:url(linksorangekl.png) no-repeat;
}

a.contact:active{
background:url(contactorangekl.png) no-repeat;
}

a:active{
color: #9C119C;
font-weight: bold;
}

.sidebar ul li, .sidebarie ul li  {
list-style: none;
}