@import "../1inc/fmt_accoOverzicht.css"; /*Hierin staat alles wat te maken heeft met fmt_accoOverzicht*/

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

/*#pgOms p{margin-bottom:0;display:inline;}*/
#zkbkContainer {
    flex: 1 0 auto; /* neemt alle beschikbare ruimte */
}

.footerWrapper {
    flex-shrink: 0; /* voorkomt dat footer omhoog gedrukt wordt */
}


#zkbkBody			{margin-top:0;margin-left:3;background:#BFFFBF;}
/*#zkbkHeader			{}*/
/*.zkbkVlag			{width:30px;margin-top:3px}*/
/*.zkbkBalloon		{width:200px;}*/
/*.zkbkTabSpace		{width:10px;}*/
//**#zkbkLijstTab		{width:240px;border: 2px solid white;white-space:nowrap;font-size:larger;cursor:pointer;margin-bottom:3px;border-radius:2px;display:none;float: right;}*/
/*#zkbkLijstTab		{width:50%;border: 2px solid #CCC;white-space:nowrap;font-size:larger;cursor:pointer;margin-bottom: 5px;border-top-left-radius:8px;border-bottom-left-radius:8px;display:none;float:left;color:#444;background:#DDD;box-shadow:3px 3px 5px -1px rgb(0 0 0 / 20%);vertical-align:middle;padding:5px;text-align: center;}*/
/*#zkbkLijstTab:hover	{box-shadow: 0 0 5px -1px rgb(0 0 0 / 60%);font-weight: bold;}*/
/*#zkbkKaartTab		{width:300px;border: 2px solid white;white-space:nowrap;font-size:larger;cursor:pointer;margin-bottom:3px;border-radius:2px;display:none;float: right;}*/
/*#zkbkPopupKnop		{border:2px solid #CCC;margin-bottom:3px;margin:0px 3px 3px 3px;border-radius:8px;color:#444;background:#DDD;box-shadow:3px 3px 5px -1px rgb(0 0 0 / 20%);padding:5px;text-align:center;}*/
/*#zkbkPopupKnop:hover	{box-shadow: -5px -5px 8px -1px rgb(0 0 0 / 60%);}*/
/*#zkbkKaartTab		{width:50%;border: 2px solid #CCC;white-space:nowrap;font-size:larger;cursor:pointer;margin-bottom:5px;border-top-right-radius:8px;border-bottom-right-radius:8px;display:none;float:right;color:#444;background:#DDD;box-shadow:3px 3px 5px -1px rgb(0 0 0 / 20%);vertical-align:middle;padding:5px;text-align: center;}
#zkbkKaartTab:hover	{box-shadow: 0 0 5px -1px rgb(0 0 0 / 60%);font-weight: bold;}*/

/*#zkbkKaartTab		{width: 50%;}
#zkbkLijstTab		{width: 50%;}*/
/*#zkbkXsToCriteria	{position: fixed;top:15px;left:10px;z-index:5;background:#BFFFBF;border-radius:5px;;display:none;}*/
#zkbkXsToResultaten	{position: fixed;top:15px;right:10px;z-index:5;padding:5px;background:#BFFFBF;border-radius:2px;display:none;}
/*.zkbkXsResultPreview	{height:30px;}*/
#zkbkContainer		{padding-left:0px;padding-right:0px;width:100vw;min-height:670px;}
/*#zkbkResultaten	{position:absolute;overflow:auto;max-width:100vw;}*/
#zkbkCriteria	{    max-width: 100%;width: 100%;box-sizing: border-box;overflow-x:hidden;}
/*.periodeTips	{cursor:pointer;color:blue;white-space: nowrap;}*/
/*.zkbkCriteriaTitel	{background:#009900;color:var(--achtergrondkleur);font-weight:bold;height:22px;padding:2px;}*/
/*.zkbkCriteriaTitel.nr1 {width:100px;border-left:1px solid lightgrey;}*/
/*.zkbkCriteriaTitel.nr3	{width:50px;text-align:center;border-right:1px solid lightgrey;}*/
.zkbkCriteriaTitelClickable	{background:var(--achtergrondkleur);font-weight:bold;padding:2px;cursor:pointer;border-bottom:1px solid lightgrey;}
.zkbkCriteriaTitelClickable.nr1 {width:105px;border-top-left-radius:2px;}
.zkbkCriteriaTitelClickable.nr3 {width:50px;text-align:center;border-top-right-radius:2px;}
#vogelvluchtMap			{width:100%;height:90vw;display:none;}
/*#vogelvluchtMapClose	{position:absolute;width:16px;height:16px;cursor:pointer;display:none;z-index:100;}*/
/*.zkbkAccInfo			{position:absolute;background:var(--achtergrondkleur);}*/



/*#lijstkaartswitch 	{width: 100%;}*/


@media only screen and (max-width: 769px)
	{

	/*h1					{font-size:24px;}
	h2					{font-size:20px;}
	.zkbkResultatenBlok			{padding-left:0px;padding-right:0px;}
	.zkbkXVeldBlok				{padding-left:0px;padding-right:0px;}
	.zkbkCriteriaTitel.nr1 		{width:130px;}
	.zkbkCriteriaTitelClickable.nr1 {width:135px;overflow:hidden;white-space:nowrap;}
	.zkbkCriteriaTitelClickable	{height:44px;}
	.zkbkAccInfo.zkbkOverview	{width:100%;height:700px;margin:0px;border-radius:0px;padding:0px;border:0px;background-image: linear-gradient(white,ivory);}/*{width:363px;height:435px;}			/*373*/
	/*.zkbkAccInfo.zkbkOverview:hover	{border:0px;}
	.zkbkAccFotoBlok			{width:100%;}	/*353*/
	/*.zkbkAccFoto.zkbkOverview	{width:100%;XXmax-width:384px;height:inherit;border-radius:0px;}
	.zkbkAccBalkBlok			{width:100%;padding:5px;}
	.zkbkAccBalkTab				{}
	.zkbkAccBalkXfFlag			{font-size:22px;}
	.zkbkAccBalkKaartFlag			{font-size:22px;}
	.zkbkAccBalkVvImg			{height:17px;}
	.zkbkAccTextNaam			{}
	.zkbkAccTextBlok			{width:100%;padding:5px;}
	.zkbkAccTextAanbieding		{display:block;}
	.zkbkAccAvailBlok.zkbkOverview	{display:block;}*/
	}

@media (min-width: 768px) {
  #zkbkCritContainer {
    position: static;  /* offcanvas positie resetten */
    transform: none;
  }
  .zkbkAccDetailcarousel{max-width:320px;}
	.zkbkDetailLeft{max-width:320px;}
}

/* Sticky navbar */
.zkbkXsNavbar {width: 100vw;transition: top 0.2s;z-index: 999;background-color:var(--achtergrondkleur);align-items: center;flex-wrap: nowrap;}
.zkbkXsNavbar.sticky {position: fixed;top: 0;left: 0;}
.zkbkXsNavbar .btn {flex: 1 1 0;white-space: nowrap;font-size: clamp(0.8rem, 2vw, 1rem);padding: 0.25rem 0.5rem;}
#zkbkNavLogo {opacity:0;flex: 1 1 0; min-width: 0;text-align: center;}
#zkbkNavLogo img {max-height:2rem;height: auto;width: auto;display: block;margin: 0 auto;}
#zkbkNavLogo p {font-size: clamp(0.6rem, 1.5vw, 0.8rem);margin: 0;white-space: nowrap;}

/*filterfooter*/
.zkbkXsFilterBalk{white-space: nowrap;position: fixed; bottom: 0; left: 0; width: 100%; z-index: 1050; background-color: var(--achtergrondkleur);}
.zkbkXsFilterBalk .aantalGeselecteerd, .zkbkXsFilterBalk .aantalKaart{font-size: clamp(0.7rem, 2.5vw, 0.8rem);min-width: 0;}
.zkbkXsFilterBalk button {font-size: clamp(0.9rem, 2.5vw, 1rem);min-width: 0;}

.zkbkNiksGevonden{font-size: 1.4rem;}
.zkbkNiksGevonden li{margin:1rem;font-size:1.2rem;}

.fade-flex {
  display: flex;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.fade-flex.show {
  opacity: 1;
  pointer-events: auto;
}