


.menuimage {   /* was #drop */
	display: none;
	font-family: Arial, Helvetica, sans-serif;  /* font-family: century gothic,  */
	background-color: #484848; 
	
	margin-right: 0px;
	padding:0 0 0 0;
    position: relative;
}
.menuimage ul {
	padding: 0 5px 10px 5px;
}


.menuimage ul:hover ul  {  /* + .dropdown-content   poging */
	display: block;
	background: 222; /* donkergrijs */
	
}


.dropdownmenu {
  position: relative; 
  display: inline-block; /* zodat menu onder deze knop komt*/
  margin: 10px 0  0 0;
  font-size:110%;
}

.dropdownmenu a {
  background-color: #484848; /* #484848; light grey */
  color:  #50c0ff;  /* #01a7e3 lightblue*/;
  text-decoration: none;
  
  padding: 5px;
  font-weight: bold;
 /* display: inline-block;    */ 
 
 border-radius: 5px; 

}

.dropdown-content {
  background-color: #484848; /* #484848; light grey */
  color:  #50c0ff;  /* #01a7e3 lightblue*/;
  text-decoration: none;
  min-width: 160px;
  
  display: none;
  position: absolute;
  overflow: auto;
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */
  z-index: 1;
}

.dropdown-content a {
  /*text-decoration: none;*/
  display: block;
}





.show {display: block;}



body {
  padding: 0px;
  margin:0px;
  font-family: Arial, Helvetica, sans-serif; /*  font-family: century gothic; */
  font-size:120%;
  /*background:lightgrey ; /*url(img/noise.png);  */
}
#header,   h1, h2, h3, h4 {
  font-family: Arial, Helvetica, sans-serif; /* font-family: century gothic, 'Open Sans Condensed', sans-serif; */
  color :  #0090ff; /*     blue;*/
}

 h1, h2 {
  font-size:140%;
 }
 h3 { 
  font-size:130%;
 }
 h4 { 
  font-size:120%;
 }

#header {
  color: white; /*#fff;*/ 
  background:#333; /* url(img/noise.png); */
  width: 100%;
  margin:   0 ;
  padding: 0; 
}

	
.col22 {
   width: 35%;
   max-height: 130px;
	/* float:left; */
	
	margin: 0 ;
	padding : 0;

}
.col75 {
	max-height: 130px;
	max-width: 740px;
    width: 64%;
	 
	margin: 0 ;
	padding : 0;
}

.col100 {
   width: 100%;
   margin: 0 ;
   padding: 0;
}

.tdcenter {
	text-align:center;
}

#footer { 
	color: lightgrey; /*  #111; */
	background: #484848; /* #ccc; light grey */
	margin:0;
	clear: both;
  	width: 100%; 
	
	display: inline-block;
}
#footer h5  {
	padding: 3px 3px;
	text-align:center;
}
#footer h5 a , #footer table tr  a {
	/* text-decoration: none; */
	color: white; 
}
#footer table {;
	 margin: auto;
}
#footer tr, #footer td {
	padding: 0 10px ;
}



#content{
	width: 100%;   /* max-width:960px; */
margin: 0px auto;

margin: 5px 0 0  0;
	clear: both;
		float:left;
}

#main {
  float: left; 
  width: 22%;
  margin: 0 0 10px 0;
  padding: 0;
}
#main .textArea {
	margin-right: 2%;
	padding: 0 2% 0 2%;
}
.sidebar{
	float: right;
	margin: 0 0 10px 0%;
	padding: 0;
	width: 77%; 
}
.sidebar .textArea {
	padding: 10px;
	font-size: 16px;  
	display: inline-block;
} 

.uurtabel {
  width: 90%
  max-width: 720px;
}

	
#menu ul  {
  margin: 0;
  padding: 5px;
  list-style: none;
  background:  #484848; 
  overflow: hidden; 
  color: white;
  
}

#menu li {
  display: block;    /* responsive */
}
#menu a {
  display: block;
  color:  #50c0ff;  /* #01a7e3 lightblue*/
  text-decoration: none;
  padding: 5px;
  font-weight: bold;
}

#menu a:hover , .dropdownmenu a:hover ,  .dropdown-content a:hover    {
	background: black;
	color: white; 
}








a img:hover { 
	transform: scale(1.1); 
}


	
.dropprak-btn {
    background-color: #484848;     color: #50c0ff;   /* #01a7e3 lightblue*/   padding: 10px;     font-size: 14px;  min-width: 150px; 
}
.dropprak {
    display: inline-block;    position: relative; 
}
.dropprak-content {
    position: absolute;   background-color: #222;    min-width: 250px;     display: none;     z-index: 1;  
}
.dropprak-content a {
    color: #50c0ff;		 /* #01a7e3 lightblue*/    padding: 4px 16px;     text-decoration: none;  display: block;
}
.dropprak-content a:hover {
	color: white;     background-color: black;
}
.dropprak:hover .dropprak-content {
    display: inline-block;
}
.dropprak:hover .dropprak-btn {
    background-color: #222;
}








img.lefty       { float:left ; border:0 ; margin: 4px; max-width:50% } 
img.nolefty       { float:center ; border:0 ; margin: 4px; max-width:50% } 
img.righty     { float:right; border:0 ; margin: 4px; max-width:50% } 

#sv-container {  }

/* MEDIA QUERIES 
*/

@media screen and (max-width: 640px) {
	
	body{
		font-size: 100%;
	}
	.sidebar{
		margin: 0;
		width:100%;   
	}
	
	.menuimage  {  
	      display: flex;
	}	

	#main  {
	   width:100%;
	}
	#menu {
		display:none;
	}
	#fbbutton {
		display:none;
	}
	

	.col22 {
		display:none;
	}
	.col75 {
		width:100%;
	}
	
		
	.uurtabel {
	  width: 75%
	}
	
	
}