/*
	General behaviour on screenwidth:
		>=1280		FULL MAX-SIZE FUNCTIONALITY

		--- 1080-wide screens ---
		1239		Nieuwste projecten: 3->2
		1239		smaller menu fonts
		1190        smaller titles and menu fonts
		1132		"news" drops off menu
		1080		smaller menu fonts

		--- 960-wide screens ---
		1050		3 col -> 2 col ?? / 5 col -> 3 col
		1023		"agenda" drops off menu
		1000		keuze jaarverslagen 4 -> 3 kolommen
		960			Nieuwste projecten: 2->1; less room around tables

		--- 800-wide screens (mobile) ---
		934			MOBILE MENU
		800			projecttexts go vertical (icons above title);  smaller title fonts;

		--- 768-wide true mobile ---
		768			full-height boxes on banners; smaller footer font
		640			LOWEST WIDTH FOR ALL MOBILE APPLICATIONS
*/

:root {
	--color-natuur: #24BF5B;
	--color-kunst:  #4384D9;
	--color-lepra:  #FFAA46;
	--color-onderw: #ED69B4;
	--color-overig: #505050;

	--bgcolor-natuur: #cceecc; 
	--bgcolor-kunst:  #BDDFFF; 
	--bgcolor-lepra:  #ffcc77; 
	--bgcolor-onderw: #ffddff; 
	--bgcolor-overig: #eeeeee; 

	--linkcolor: #0D5399;
}



/* main screen */
.mobile-viewport {
  max-width: 624px;
  margin: 0 auto;
  background: #f0f0f0;
}

/* general */
body {
  margin: 0;
  font-family: DM Sans, Cabin,Arial,"Microsoft Sans Serif",Helvetica,Verdana,Sans-Serif; 
  background-color: #ffffff;
  min-width:624px;
}

h1 {
	font-size:40px;
	color:#606060;
	font-weight: bold;
}
h2 {
	font-size:30px;
	color:#555588;
	font-weight: bold;
}
h3 {
	font-size:20px;
	color:#606060;
	font-weight: bold;
}
h3 a {
	color:var(--linkcolor);
	text-decoration:none; 
}
h3 a:hover {
	text-decoration:underline; 
}

@media (max-width:1190px) { h1 {font-size:40px;}  h3 {font-size:18px;} }
@media (max-width: 800px) { h1 {font-size:36px;}  h3 {font-size:16px;} }



/*
	Links in general
*/
.alink a:link		{color:var(--linkcolor); text-decoration:none;}
.alink a:hover		{color:var(--linkcolor); text-decoration:underline;}
.alink a:visited	{color:var(--linkcolor); text-decoration:none;}

.ourproj .slider a:link    {color:#ffffff;}
.ourproj .slider a:hover   {color:#ffffff;}
.ourproj .slider a:visited {color:#ffffff;}


/*
	sticky menu bars
*/
.navbar-wrapper {
  position: sticky;
  top: 0;
  z-index: 1000;
  background-color: transparent; 
}
.navbar {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  padding: 0;
  height: 100px;
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.4);  
  margin: 0 auto;  
}
.navbar-mobile {
  padding: 0;
  height: 72px;
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.4);  
  margin: 0 auto;
  display: none;
}
@media (max-width:934px) {
  .navbar {
    display: none;
  }
  .navbar-mobile {
    display: block;
  }
}

.nav-group {
  display: flex;
  height: 100%;
}

.spacer {
  flex-grow: 1;
}

/* right group boxes don't stretch */
.right-group .nav-box {
  flex: 0 0 auto;
}

/* Left group boxes do stretch */
.left-group .nav-box {
  flex: 1;

}

.nav-box {
  flex: 1; /* Let each nav-box grow equally within its group */
  min-width: 0; /* Prevent overflowing content */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  white-space: nowrap;
  border-radius: 0;
  height: 100%;
  cursor: pointer;
}
@media (max-width:1239px) { 
	.nav-box {font-size:18px; } 
	.navbar { height: 88px; }
}
@media (max-width:1190px) { 
	.nav-box {font-size:16px; } 
	.navbar { height: 80px; }
}
@media (max-width:1080px) {
	.nav-box {font-size:16px; } 
	.navbar { height: 76px; }
}


.nav-box a {
	color:inherit;
	text-decoration:none; 
}



.clickable		{ cursor: pointer; }
.linklike		{ color:var(--linkcolor); }
.linklike:hover	{ text-decoration:underline; }



.box-home      { background-color: #ffffff; padding:0 50px; }
.box-natuur    { background-color:var(--color-natuur); color: white; padding:0px 38px;}
.box-kunst     { background-color:var(--color-kunst ); color: white; padding:0px 38px;}
.box-lepra     { background-color:var(--color-lepra ); color: white; padding:0px 38px;}
.box-nieuws    { background-color: #ffffff; color: #505050; padding: 0 19px; }
.box-agenda    { background-color: #ffffff; color: #505050; padding: 0 19px; }
.box-overons   { background-color: #ffffff; color: #505050; padding: 0 19px; }
.box-aanvragen { background-color: #ffffff; color: #505050; padding: 0 19px; }
.box-zoek      { background-color: #ffffff; color: #505050; padding: 0 10px 0 20px; }
.box-taal      { background-color: #ffffff; color: #505050; padding: 0 45px 0 10px; }

@media (max-width:1132px) {
.box-nieuws    { display:none; }
}

@media (max-width:1080px) {
.box-zoek      { background-color: #ffffff; color: #505050; padding: 0 10px 0 20px; }
.box-taal      { background-color: #ffffff; color: #505050; padding: 0 35px 0 10px; }
}

@media (max-width:1023px) {
.box-agenda    { display:none; }
}





.nametarget {
  scroll-margin-top: 110px; /* Leaves space above when jumped to */
}


.content {
	line-height:1.3;
	margin: 0 auto;
	background-color: white;
	padding: 0px 0px;
}
.content p {
	color: #333;
}


/*
	Tables inside content
*/
.table_newproj 	 { width:83%; padding:80px 0; } /* projects index largeicons (main page) */
.table_projindex { width:83%; max-width:1200px; padding:40px 0; } /* projects index smallicons at top */
.table_nutezien	 { width:90%; max-width:1200px; padding:80px 0; } /* projects index smallicons "nu te zien" */ 
.table_projects	 { width:83%; padding:80px 0; } /* projects full-info */
.table_nieuws    { width:90%; padding:80px 0; } /* news items on main screen */
.table_news      { width:90%; max-width:960px; padding:40px 0; } /* news items on main screen */
.table_infobox   { width:55%; padding:48px 48px; } /* info box "onze stichting" etc. */
.table_jaarversl { width:55%; padding:48px 48px; } /* info box "onze stichting" etc. */
.table_aanvragen { width:55%; padding:48px 48px; } /* info box aanvragen */
.table_kw_ctry   { width:99%; padding: 0px  0px; } /* info box aanvragen */
.table_notulen	 {              } /* notulen  */

@media (max-width:1239px) {
.table_newproj 	 { width:92%; padding:80px 0; } /* projects index largeicons (main page) */
.table_projindex { width:90%; padding:40px 0; } /* projects index smallicons at top */
.table_projects	 { width:83%; padding:80px 0; } /* projects full-info */
.table_nieuws    { width:90%; padding:80px 0; } /* news items */
.table_infobox   { width:70%; padding:48px 48px; } /* info box "onze stichting" etc. */
}
@media (max-width:960px) {
.table_newproj 	 { width:92%; padding:80px 0; } /* projects index largeicons (main page) */
.table_projindex { width:95%; padding:20px 0; } /* projects index smallicons at top */
.table_projects	 { width:83%; padding:80px 0; } /* projects full-info */
.table_nieuws    { width:90%; padding:80px 0; } /* news items */
.table_infobox   { width:70%; padding:48px 48px; } /* info box "onze stichting" etc. */
}





/* screen-wide image with text */

.image-banner {
  position: relative;
  width: 100%;
  overflow: hidden;
  max-height:650px;  
  background-color:grey;
}
.image-banner img {
  width: 100%;
  height: auto;
  display: block;
}

.credits-text {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index:3;

  opacity: 1;
  transition: opacity 0.5s ease-in-out;

  font-size: 12px;
  color: #cccccc;
  text-shadow: 0px 0px 3px black;
}
.credits-text.left {
  right: auto;
  left: 10px;
}


.overlay-text {
	width:75%; 
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 76px;
  text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
  text-align: center;
  font-weight: bold;
  pointer-events: none; /* text not clickable */
  z-index:2;
}
@media (max-width:1190px) {.overlay-text {font-size: 60px;}}
@media (max-width:920px)  {.overlay-text {font-size: 48px;}}
@media (max-width:728px)  {.overlay-text {font-size: 40px;}}




.banner-box {
  position: absolute;
  width:42%;
  min-height:70%;  
  max-width:640px;
  color: white;
  text-align: center;
    display: flex; 
	align-items:center;
  font-weight: bold;
  padding:22px 0;
  font-size: 20px;
  z-index:3;
}
.banner-textbox {
	width:77%;
}
.banner-title {
  font-size: 32px;
}
@media (max-width:1132px) {.banner-box {font-size:18px;}  .banner-title {font-size:28px;}}
@media (max-width: 960px) {.banner-box {font-size:16px;}  .banner-title {font-size:26px;}}
@media (max-width: 820px) {.banner-box {font-size:14px;}  .banner-title {font-size:20px;}}
@media (max-width: 768px) {.banner-box {font-size:13px;min-height:100%;padding:0px 0;} 
	.banner-title {font-size:18px;}
	.banner-textbox {width:85%;}
	}

.ban-natuur {background:var(--color-natuur);	bottom:0; right:0;}
.ban-kunst  {background:var(--color-kunst );	bottom:0; left:0; }
.ban-green  {background:var(--color-lepra );	bottom:0; right:0;}
.ban-odw    {background:var(--color-onderw);	bottom:0; left:0; }
.ban-overig {background:var(--color-overig);	bottom:0; left:0; }

.tdbox_natuur {background-color:var(--bgcolor-natuur);} 
.tdbox_kunst  {background-color:var(--bgcolor-kunst );} 
.tdbox_lepra  {background-color:var(--bgcolor-lepra );}
.tdbox_onderw {background-color:var(--bgcolor-onderw);}
.tdbox_overig {background-color:var(--bgcolor-overig);}

.tdbox {
	width:70%;
	min-width:400px;
	max-width:720px; 
	padding:24px;
}




/* read-more button */

.read-more-btn {
  display: inline-block;
  font-style:normal;
  text-decoration: none;
  min-width:155px;
  padding: 15px 12px;
  color: #ffffff; 
  font-weight: bold;
  font-size: 19px;
  border: none;
  border-radius: 0; /* no round corners */
  cursor: pointer;
  margin: 40px 20px 0 20px;
  
}

@media (max-width:960px) { .read-more-btn {font-size:16px; padding: 13px 10px; margin:24px 16px 0 16px;} }
@media (max-width:790px) { .read-more-btn {font-size:15px; padding:  8px  8px; margin:16px 11px 0 11px;} }

.btn-natuur			{ background-color: var(--color-natuur); }
.btn-kunst			{ background-color: var(--color-kunst ); }
.btn-lepra			{ background-color: var(--color-lepra ); }
.btn-odw			{ background-color: var(--color-onderw); }
.btn-grey			{ background-color: var(--color-overig); color: #ffffff; }

.btn-natuur:hover	{ background-color: #207720; color: #ffffff; }
.btn-kunst:hover	{ background-color: #335295; color: #ffffff; }
.btn-lepra:hover	{ background-color: #cc6600; color: #ffffff; }
.btn-odw:hover		{ background-color: #880088; color: #ffffff; }
.btn-grey:hover		{ background-color: #202020; color: #ffffff; }

.btn-onnatuur		{ background-color: #ffffff; color: var(--color-natuur); }
.btn-onkunst		{ background-color: #ffffff; color: var(--color-kunst ); }
.btn-onlepra		{ background-color: #ffffff; color: var(--color-lepra ); }	
.btn-onodw			{ background-color: #ffffff; color: var(--color-onderw); }
.btn-ongrey			{ background-color: #ffffff; color: var(--color-overig); }

.btn-onnatuur:hover	{ background-color: #000000; color: var(--color-natuur); }
.btn-onkunst:hover	{ background-color: #000000; color: var(--color-kunst ); }
.btn-onlepra:hover	{ background-color: #000000; color: var(--color-lepra ); }
.btn-onodw:hover	{ background-color: #000000; color: var(--color-onderw); }
.btn-ongrey:hover	{ background-color: #000000; color: var(--color-overig); }

.isnatuur	{ color:var(--color-natuur); }
.iskunst	{ color:var(--color-kunst ); }
.islepra	{ color:var(--color-lepra ); }
.isonder	{ color:var(--color-onderw); }
.isoverig	{ color:var(--color-overig); }

.bgnatuur	{ background-color:var(--color-natuur);color:white; }
.bgkunst	{ background-color:var(--color-kunst );color:white; }
.bglepra	{ background-color:var(--color-lepra );color:white; }
.bgonder	{ background-color:var(--color-onderw);color:white; }
.bgoverig	{ background-color:var(--color-overig);color:white; }

/*
	team en bestuur
*/

.lidteam {
  font-size: 24px;
  color: #2899FF; 
  font-weight: bold;
  padding:0 0 30px 0;
}
.lidbestuur {
  font-size: 24px;
  color: #2899FF; 
  font-weight: bold;
  padding:0 0 30px 0;
}




/*
	jaarverslagen
*/
.jaarverslag-table {
	padding:0;
}
.jaarverslag-table td {
	font-weight:bold;
	font-size: 16px;
	color:black;
}
.jaarverslag-hr {
	height: 2px;
	background-color:black;
	border: none;
	margin: 12px 0; /* optional spacing */
}
.jaarverslag-table a {
	color:black;
	text-decoration:none; 
}
.hidden-row {
	display:none;
}

/*
	Jaarverslag JV20xx pages
*/
.jvlegenda {
	background-color:#ffffff;
}


/*
	news
*/
.news_table {
	border-collapse: collapse;
	width:100%;
	max-width:800px;
}
.news_table td {
	padding: 6px;
	vertical-align:top;
}
.news_date {
	font-weight:bold;
	font-size: 14px;
	color:#50aa50;
	min-width:66px;
}
.news_project {
	font-weight:bold;
	font-size: 18px;
	color:#2899FF;
	text-decoration:none; 
}
.news_title {
	font-weight:bold;
	font-size: 16px;
	color:#ff5050;
	color:black;
	text-decoration:none; 
}
.news_source {
	font-weight:bold;
	font-size: 14px;
	color:#ff5050;
	text-align: right;
	max-width:120px;
}
.news_newyear {
	font-weight:bold;
	font-size: 32px;
	color:#50aa50;
}
.news-hr {
	height: 2px;
	background-color:black;
	border: none;
	margin: 4px 0; /* optional spacing */
}

.news_title:hover	{ text-decoration:underline; }
.news_project:hover	{ text-decoration:underline; }




/*
	legenda (for footer)
*/
.legenda {
	color:white;
	width:85%; 
	padding:52px 16px 72px 16px;
}
.legenda a {	
	color:white;
	text-decoration:none; 
}
.legenda a:hover {	
	color:#ddddff;
}
.legendafont {
	font-size:16px;
	color:white
}
@media (max-width:768px) {
	.legenda {
		width:90%; 
	}
	.legendafont {
		font-size:15px;
	}
}



/*
	responsive table
		3-wide, going to 2-wide or 1-wide
*/
.responsive-table {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
}
.responsive-table-row {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.responsive-cell {
  box-sizing: border-box;
  flex: 0 0 33.33%; 
  padding: 20px;
  font-size:20px;
}
@media (max-width: 1239px) {.responsive-cell {flex: 0 0 50%;}}
@media (max-width:  960px) {.responsive-cell {flex: 0 0 100%;}}



.responsive-cell50 {
  box-sizing: border-box;
  flex: 0 0 50%; 
  padding: 18px 20px;
  font-size:20px;
}
@media (max-width:  959px) {.responsive-cell50 {flex: 0 0 100%; padding:16px 20px; }}
.table_kw_ctry .responsive-cell50 {
  padding: 2px 20px;
  font-size:20px;
}



.responsive-cell33 {
  box-sizing: border-box;
  flex: 0 0 33%; 
  padding: 20px;
  font-size:20px;
}
@media (max-width: 1023px) {.responsive-cell33 {flex: 0 0  50%; padding:16px;}}


.responsive-cell20 {
  box-sizing: border-box;
  flex: 0 0 20%; 
  padding: 20px 20px;
  font-size:20px;
}
@media (max-width: 1023px) {.responsive-cell20 {flex: 0 0 33%;}}







.table_jv  { width:95%; min-width:300px; max-width:900px; padding:32px 12px; } /* info box "onze stichting" etc. */
.jvcell {
  box-sizing: border-box;
  flex: 0 0 25%;
  padding: 20px 0px;
  font-size:20px;	    

  display:flex;               
  flex-direction: column;      /* Align content vertically */
  justify-content: flex-end;   /* Push content to the bottom */
}
.jvhide {
  display:none;
}
@media (max-width: 1000px) {.jvcell {flex: 0 0 33%;}}




/*
	projects
*/
.projcell {
	text-align:left;
}
.projdate {
	font-size:16px;
	font-weight:bold;
}
.projtitle {
	font-size:19px;
	font-weight:bold;
	color:black;
	text-decoration:none; 
	padding:12px 0;
}
.projtitle a {
	color:black;
	text-decoration:none; 

}


.see_items {
	padding: 0 0 20px 40px;
	//font-size: smaller;
}
.see_items a {
	display: block;
	padding:  0 0 0 60px;
	text-indent: -60px;
}



/*
	miniatures
*/
td.pricon{
	vertical-align: top;
	text-align:center;
	font-size:12px; text-decoration:none; line-height:1; color:#666666; 
	margin:0px;
	padding-bottom:12px;
	padding-right:14px;
	width:110px;
}
td.prtext{
	vertical-align: top;
	font-size:16px; text-decoration:none; line-height: 1.4;
	margin:0px;
	padding-top:0px; padding-bottom:12px;
	padding-right:6px;
	min-width:120px;
}
img.thmb1	{width:96px; height:72px; margin:4px 8px 1px 6px;}

.agendablk  {max-width:760px;} 
.agendamon  {font-size:28px; text-decoration:none; color:#777777; text-transform: uppercase; }
.agtext		{font-size:19px; line-height:1.4; vertical-align:top; padding-bottom:40px;}
.agtext	a 	{font-size:19px; font-weight:bold; text-decoration:none;}
.agenda     {font-size:19px; line-height:1.4;}
.agenda a 	{font-weight:normal; text-decoration:none;}
.agimg		{width:160px; vertical-align:top; font-size:14px; color:#666666; padding: 8px 12px 24px 12px;}
.agimg img  {width:128px; height:96px; margin:0px 12px 0 0;}
.table_nutezien .thmb1 { width:128px; height: 96px; }





/*
	make miniature image of foto
*/
.minifoto {
	width: 120px;
	height:120px;
}
.minifoto img {
	width:100%; 
	height:100%; 
	object-fit:cover;
}


/*
	bigthumb
*/
.bigthumbbox {
	width:90%;
	justify-content: center;
}
.bigthumb {
	width: 100%;
	max-width :400px;
	aspect-ratio: 4 / 3; /* width : height = 4 : 3 ? height = 75% of width */

  overflow: hidden;
  position: relative;
  background-color: #000; /* optional */
}

.bigthumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


/*
	Table for project texts -> 100% when narrow
*/
.ourproj {
	//border:1px solid black;
	border-collapse: collapse;
	width:100%;
	max-width:800px;
}
.ourproj td {
  min-width:120px;
  padding: 0 8px;
}
/* Standaard: normale tabelweergave */
@media (max-width: 800px) {
  .ourproj tr {
    display: flex;
    flex-direction: column;    
  }
  .ourproj td {
    width:100%;
    display:block;
    box-sizing:border-box;
	margin-bottom: 24px;
  }
}


.orgs {
  display: flex;
  flex-direction: column; 
  align-items: center;   
  gap: 16px;
}
@media (max-width: 800px) {
  .orgs { flex-direction: row; align-items: flex-start; }
  .orgs img { margin-right:16px; }
}


.PRJTITL 	{font-size:20px; font-weight:bold; color:black; line-height:1.2; margin-top:-3px; margin-bottom:8px; display:inline-block;}
.PRJTXT 	{font-size:18px; text-decoration:none; xline-height:1.2;}
@media (max-width:840px) {
.PRJTXT 	{font-size:16px; text-decoration:none; xline-height:1.1;}
}

.ourproj a:link		 {color:var(--linkcolor); text-decoration:none;}
.ourproj a:hover     {color:var(--linkcolor); text-decoration:underline;}
.ourproj a:visited	 {color:var(--linkcolor); text-decoration:none;}
a.CRD:link	  { COLOR: #666666; text-decoration:none }
a.CRD:visited { COLOR: #666666; text-decoration:none }
a.AGN:link	  { COLOR: #666666; text-decoration:none }
a.AGN:hover	  { text-decoration:underline }
a.AGN:visited { COLOR: #666666; text-decoration:none }

.prtext a:link		{color:var(--linkcolor); text-decoration:none;}
.prtext a:hover		{color:var(--linkcolor); text-decoration:underline;}
.prtext a:visited	{color:var(--linkcolor); text-decoration:none;}


.notuul { font-weight: bold; }

/*
	OLD STUFF
*/
.greybox {
	max-width:100%;
	text-align:left;
	font-size:18px; 
	line-height:1.2;
	color:BLACK;
}	
.greyinner {
	font-size:18px; 
	padding:20px;
}
.greyinner a:link		{color:var(--linkcolor); text-decoration:none;}
.greyinner a:hover		{color:var(--linkcolor); text-decoration:underline;}
.greyinner a:visited	{color:var(--linkcolor); text-decoration:none;}
.darkbox {
	font-size:12px; 
	max-width:100%;
	background:#cccccc;
	text-align:left;
	padding:16px;
}	




.PLTXT		{font-size:11px; text-decoration:none; line-height: 1; color:#555555} /* date under img */
.SUBTXT		{font-size:12px; text-decoration:none; line-height: 1; color:#555555; font-style: italic} /* title under photo */
.TURTXT		{font-size:14px; text-decoration:none;} 
.TURTXT1	{font-size:12px; text-decoration:none; line-height: 1}
.TURTXT2	{font-size:14px; text-decoration:none; line-height: 1.4;}
.TURTXT3	{font-size:20px; text-decoration:none; line-height: 1.1;}
.TURSEP		{font-size:24px; font-weight: bold; }
.TURTXT5	{font-size:24px; text-decoration:none;}
.GEDICHT    {font-size:14px; font-style: italic; line-height:1.4;}

.ptnr {
	border: 0px;
	margin-right:4px;
    outline: 10px solid transparent;
}
.ptnr:hover {
	border-radius: 6px;
	outline: 10px solid #eeeeee;
	background-color:   #eeeeee;
}

hr.mline {
	border:0;
	height:2px;
	color:#ffffff;
	background:#ffffff;
	width:100%;
}
hr.newsline {
	border:0px;
	height:2px;
	background:#95989A;
	width:100%;
}
.menubox {
	max-width:100%;
	text-align:left;
	padding:0px;
}	
.premap {
	min-height:90px;
}

.t1 {
	font-weight: bold;
	font-style: italic;
	letter-spacing: 4px;
	font-size:48px; 
	text-decoration:none; 
	color:555555;
	text-align:left;
	margin:15px 0px 15px;
	text-transform: uppercase;
}
.t2 {
	font-size:24px; 
	line-height: 120%;
	font-weight: bold;	
	color:#555555;
	text-align:left;
	margin:20px 0px 6px 20px;
}


.gebiedbar {
	float:right;
	padding: 30px 0px 0px 0px;
}
.gebiedfont {
    font-weight: bold;
	font-style: italic;
	letter-spacing: 1.5px; 
	font-size:12px;
	text-decoration:none; 
	text-shadow: 0px 0px 0px #ffffff;
    background-color: #f9f9f9;
	padding: 4px 10px;	
}


.catfont {
	font-size:12px;
	text-decoration:none; 
    font-weight: bold;
	text-transform: uppercase;
}
.searchfont {
	font-size:18px;
	text-decoration:none; 
    font-weight: bold;
	xtext-transform: uppercase;
	padding:0px 8px;
}
.newfont {
	font-size:13px;
	text-decoration:none; 
	color:#eeeeee;
	padding:0px 4px 1px;
	background:#bb4444;
}
.jvtable {
	border-spacing: 16px;
    border-collapse: separate;
	font-size:13px; 
}
table.fototable {
	border-spacing: 16px;
    border-collapse: separate;
	padding:3px;
}
td.imgonly {
	line-height:0px;
	vertical-align:middle;
}
td.fotoicon {
	vertical-align: top;
	text-align:center;
}

.indenter {
	padding-left: 2.5em;
	padding-top: 0.7em;
	padding-bottom: 0.3em;
}
.bundelthumb {
	width:120px;
	height:192px;
	border:0px;
}

a.menufont {	
	font-size:15px; 
	text-decoration:none; 
	margin:4px;
}
a.menufont:link,
a.menufont:visited	{color: WHITE; text-decoration: none;}
a.menufont:hover,
a.menufont:active	{color: WHITE; text-decoration: none; border-bottom: 2px solid red; }


a.link_nature {color:#309C5B; text-decoration:none;}
a.link_onder  {color:#AA60A7; text-decoration:none;}
a.link_lepra  {color:#CA7010; text-decoration:none;}
a.link_kunst  {color:#2F97D3; text-decoration:none;}



.hand 	{CURSOR: hand}





img.world	{width:240px; height:100px}
img.bundel  {width:280px; height:448px}
img.any		{padding:0; width:100%; max-width:100%;}




/*
	dropdown
*/
.dropbtn {
	width:40px;
	height:40px;
    color: white;
    padding: 0px;
    border: none;
    cursor: pointer;
	background:none;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
	font-size:18px;
	display: none;
    position: absolute;
	right:0px;
    background-color: #f9f9f9;
    min-width: 200px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.7);
	text-align:left;
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 9px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #888888;
}


/*
	dropdown mobile menu
*/

.mobilemenutable {
	width:100%;
}

/*
.navbar img {
    outline: 2px solid transparent;
}
.navbar img:hover {
	border-radius: 3px;
	outline:  2px solid #eeeeee;
	background-color:   #eeeeee;
}
.mobilemenutable img {
    outline: 2px solid transparent;
}
.mobilemenutable img:hover {
	border-radius: 3px;
	outline:  2px solid #eeeeee;
	background-color:   #eeeeee;
}
*/


#fullscreenBox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100dvh;
  background-color: rgba(255,255,255,1);
  color: white;
  transform: translateY(-100%);
  transition: transform 0.3s ease-in-out;
  z-index: 1001;
}

#fullscreenBox.show {
  transform: translateY(0);
}

.fullscreenBox-content {
    color: #505050;
	font-weight: bold;
	font-size:24px;
    min-width: 200px;
	text-align:center;
}
.fullscreenBox-content a {
    color: #505050;
    padding: 9px 16px;
    text-decoration: none;
    display: block;
}
.fullscreenBox-content a:hover {
	background-color: #f1f1f1
}

.imgclicked {
    color: #505050;
	font-weight: bold;
	font-size:24px;
    min-width: 200px;
	height: calc(100vh - 80px); /* subtract the header height */

		display: flex;
		flex-direction: column;      
		justify-content: center;     
		align-items: center;         

	background-color: #f1f1f1
}





/* animated banner */

.image-animbanner {
  position: relative;
  width: 100%;
  max-width: 100%;
  max-height:650px;
  aspect-ratio: 2; 
  overflow: hidden;
  background-color:#0D5399;
}
.image-animbanner img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; 
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
}

img[importance="high"] {
  opacity: 1;
}

.image-animbanner img.active {
  opacity: 1;
  z-index: 1;
}





/*
	table pagetypes
*/
.pagetype7 {background-color:#222222;}
.pagetype7 a {color:#eeeeee;text-decoration:none; }
.pagetype7 a:hover {text-decoration:underline; }
.pagetype7 .t2 {color:#eeeeee;text-decoration:none; }
.pagetype7 h1 {color:#eeeeee;text-decoration:none; }
.pagetype7 .linklike {color:#88aaff;}
.pagetype7 .TURSEP {color:#eeeeee;}
.nrfotos {color:#ff3333;font-weight:bold;}



/*
	werkgebied items
*/
.wgebied {
	width:160px;
	height:160px;
	font-size:18px;
	font-weight: bold;
	font-style: italic;
	line-height:1.1;
	color:white;	
}
.wgebied a {
	color:white;
	text-decoration:none;	
}
.wgebied50 {
	text-transform: uppercase;
	width :244px;
	height:244px;
	line-height:1.8;
	font-size:24px;
	font-style: normal;
 }



#fullscreenBox .responsive-table {
	width:624px;
}
#fullscreenBox .responsive-table-row {
	padding:0px 20px;
}
.responsive-cell-menu {
  align-items: center;      /* Vertically center */
  box-sizing: border-box;
  flex: 0 0 50%; 
  padding: 20px;
  font-size:24px;
}
@media (orientation:landscape) and (max-height:630px) {
	#fullscreenBox .responsive-table {
		width:99%;
	}
	.responsive-cell-menu {
		padding:7px 7px;
		font-size:17px;
		flex: 0 0 25%; 
	}
	.wgebied50 {
		width :98%;
		height:98%;
		line-height:1.5;
		padding:0 0 6px 0;
		font-size:16px;
	}
	.fullscreenBox-content {
		color: #505050;
		font-size:16px;
		min-width: 160px;
		text-align:center;
	}
	.fullscreenBox-content a {
		padding: 2.5px 0px;
	}
}



/*
	jaarverslag budgettable
*/

table.budgettable {
	border-spacing: 1px;
    border-collapse: separate;
	font-size:11px; 
	border: 1px solid #aaaaaa;
	padding:0px;	
	background-color:#eeeeee;
}
.lolite  {background-color:#ffffff;}
.hilite  {background-color:#dde5ff;}


/*
	slider for images to external sources
*/
.slider {  
  display: flex;
  align-items: center;     
  justify-content: center; 
  text-align: center;  
  overflow: hidden;
  height: 0px;
  transition: height 0.3s ease;
}
.slider.show {
  height: 48px;
}
.slider .read-more-btn {
  margin-top: 0px;
}



/*
	search
*/

.shortmatches td	{ padding:8px; }
.shortmatches img	{ padding-top:4px; }
@media (max-width:800px) {
	.shortmatches img	{ padding-top:4px; width:72px;height:54px; }
	
}

.shortmatch			{ color:#000000; font-size:14px; text-decoration:none; line-height:1.4;}
a.shortmatch:hover,
a.shortmatch:active {text-decoration:underline;}


/*
@media (max-width:639px) {
	.projtitle { font-size:24px; }
	.responsive-cell { font-size:20px; }
	.PRJTITL 	{font-size:24px; }
	.PRJTXT 	{font-size:19px; }
	.table_infobox { width:80%; min-width:300px; padding:24px 24px; }
	td.prtext	{font-size:19px; }
	h1 {font-size:36px;}  
	h3 {font-size:22px;} 
	.banner-box { font-size:15px;line-height:1.2; }
	.banner-title {font-size:24px;}
	.image-banner img { min-height:360px; object-fit:cover; }
	.read-more-btn {font-size:18px; padding:9px 8px; margin:16px 6px 0 16px;}	
}
*/

@media (max-width:720px) {
	.perland .prtext {font-size:14px;}
}
