

body {
  font-family: Arial, Helvetica, sans-serif;
  min-height: 100vh;
  margin:0vw;
  padding:0vw;  
}




.logo
{
position: fixed;	
background-color: transparent;
top: -1.3vw;
left: 1.0vw;
width: 7vw; /* GROOTTE LOGO */
height: auto;
vertical-align: bottom;
z-index: 1;

}


.ehbod
{
 position: fixed;
 font-weight: bold;
 text-align: left;
 top: 0.5vw;
 left: 9.0vw;
 font-size: 1.5vw;
 line-height: 1.5vw;
 color: #2374BF;
 z-index: 1;	
}

.slogan
{
  position: fixed; 	
  color: black;
  font-weight: bold;
  font-size: 1.0vw;
  top: 3.8vw;
  left: 9.0vw;
  z-index: 1;
}





ul 
{
  
  margin: 0vw;
}

li 
{
  
 
}


.hmb_icon
{  
  display: none;
}


.nav
{
  text-align: center;
  position: fixed;
  top: 0vh;
  width: 100%;
  background-color: white; /* RAL 9010 */ 
  padding: 0.8vw 10.0vw;
  height: 08.5vh; 
  font-size: 1.5vw;
  display: block; 
  /*opacity: 0.5;*/
}



.nav a 
{
/* top menu items */
  display: block;
  padding: 1.0vw;
  text-decoration: none;
  font-size: 1.3vw;
  color: grey;
}




.nav a:hover, .dropdown:hover .dropbtn 
{
  background-color: transparent;
  color: black;
  /*font-weight: bold;  */
 

}

.nav .dropdown 
{
  /*submenu under menu, not left*/
  
  display: inline-block;
  text-align: center;
}

.nav .dropdown-content 
{
/* submenus under menu items, only showed on hover */	
  display: none;
  position: absolute;
  background-color: black;
  opacity: 1.0;
  min-width: 2.5vw;
  border-style: solid;
  border-color: grey;
 }



.nav .dropdown-content a 
{
  /* sub menus in vertical list */
  
  color: white;
  padding: 0.6vw 1.0vw;
  text-decoration: none;
  display: block;
  text-align: left;
  font-size: 0.8vw;
}



.nav .dropdown-content a:hover
{
 /* selection bg color */		
  background-color: grey;
}



.nav .dropdown:hover .dropdown-content 
{
  /* no submenu without this */	
  display: block;
}



.nav a.active 
{
background-color: green;
  color: white;
}




/* IFRAME */
.iframe-container 
{
  border-style: none;
  border-color: #FDF4E3;
  margin-top: 11.0vh; /* Matches the menu height */
}



.iframe-container iframe 
{
  border-style: none;
  border-color: #FDF4E3;
  width: 100%;
  display: block;
}



/*=============================================================[ @media screen ]=================================================== */

@media screen and (max-width: 768px) 
{

	.head_background
	{
	  position: fixed;	
	  top: 0vh;
	  left:0%;
	  margin: auto;
	  width: 99.5%;
	  height: 13.0vw;
	  background-color: black; /* RAL 9010 */
	  /*opacity: 0.5;*/  
	}


	.logo
	{
	top: -2.5vw;
	left: 2.5vw;
	width: 15vw; /* GROOTTE LOGO */
	height: auto;
	}


	.mobile-hide_br 
	{
	 display: none;
	}




	.ehbod
	{
	 top: 2.8vw;
	 left: 20.0vw;
	 font-size: 4.5vw;
	 line-height: 1.5vw;
	}



	.slogan
	{
	  color: white;
	  font-size: 2.5vw;
	  top: 7.6vw;
	  left: 20.0vw;
	}



	.hmb_icon
	{
	  display: block;
	  right: 2.5vw;
	  top: 1.8vw;
	  position: fixed;
	  font-size: 7.0vw;
	  color: white;
	  background-color: black;
	  z-index: 1;	
	}

/*==============================================================[ @Navigation ]==================================================== */
	.nav
	{
	   /* zonder dit staan de letter al verkeerd */
	  /*position: fixed;*/
	  top: 12.0vh;
	  left: 1.7vw;
	  width: 42.0vw;
	  height: 56.0vw;
	  background-color: black;

	  padding: 0.0vw 0.0vw;	  
 	  color: red;
	  display: none;
	  border-style: solid;
	  border-color: grey; 
	}


	/* Hide the links inside the navigation menu (except for logo/home) */

	.nav a 
	{
	/* top menu items  */

	  top: 10.0vw;
	  width: 24.0vw;
	  height: 5.0vw;
	  display: block;
	  text-decoration:none;	
	  text-align: left;	  
	  font-size: 3.5vw;
	  color: white;
	  background-color: transparent;

	}


	.nav a:hover, .dropdown:hover .dropbtn /* hover over topmenu */
	{
	  background-color: grey;
	  color: black;
	  /*font-weight: bold;  */
	 

	}

	.nav .dropdown /* hover over topmenu 2 */
	{
	  /*submenu under menu, not left */
	  background-color: transparent;
	  display: block;
	  /* text-align: center; */
	}

	.nav .dropdown-content 
	{
	/* submenus under menu items, only showed on hover */
	  left: 30.0vw;
	  width: 62.0vw;
	  display: none;
	 }



	.nav .dropdown-content a 
	{
	  /* sub menus in vertical list */
	  width: 60.0vw;
	  font-size: 3.0vw;
	  background-color: black;
	}



	.nav .dropdown-content a:hover
	{
	 /* selection bg color 	*/
	  background-color: grey;
	  
	}



	.nav .dropdown:hover .dropdown-content 
	{
	  /* no submenu without this */
	  display: block;
	  
	}



	.nav a.active 
	{
	  background-color: green;
	  color: orange;
	  
	}
/*==========================================================[ IFRAME ]============================================================= */


	.iframe-container 
	{
	  border-color: #FDF4E3;
	  margin-top: 5.8vh; /* Matches the menu height */ 
	}


	.iframe-container iframe 
	{
	  border-color: #FDF4E3;
	  display: block;
	}

	
}









