@import "../1inc/fmt_accoOverzicht.css"; /*Hierin staat alles wat te maken heeft met fmt_accoOverzicht*/



.vpContainer > .row {
    /*border:1px solid black;*/
    margin-top:1.5rem;
    padding:1.5rem 0;

}
.row:has(#vpFirstBlock):not(:has(#introZbKnop)), .spKolomMedium:has(#vpFirstBlock){background-color:var(--lichtgroen);border-radius:1.5rem;}
@media(max-width: 768px) {
    .row:has(#vpFirstBlock):not(:has(#introZbKnop)), .spKolomMedium:has(#vpFirstBlock){margin-top:0;}
}
#LMknopGroot h2{color:var(--achtergrondkleur);}
#spPagLogo{position:absolute;z-index:10;padding:0px;display:none;}
#spTopLijstIcon{position:absolute;z-index:20;font-weight:bold;height:22px;padding:2px;display:none;}
#scrSave{position:absolute;top:10px;left:10px;z-index:15;}
#NLswitch, #ENswitch, #DEswitch, #ESswitch{border-radius:4px 4px 0px 0px;height:100%;margin_bottom:-1px;}
.spTopFotoId{position:absolute;z-index:1;padding:0px;display:none;overflow:hidden;}
#spHeaderTable{border-spacing:0px;border-collapse:collapse;position:relative;z-index:5;}
.xsMenu_optionB{position:fixed;z-index:5;padding:5px;}
.xsBmenuDropdown{float:left;margin-left:2px;}

.pag_blokWissel		{height:1rem;}
.cmsBlokRood		{color:red;font-weight:bold;}
.cmsBlokGeel		{background:yellow;font-weight:bold;}
.cmsBlokGroot		{font-size:larger;}
.cmsBlokXGroot		{font-size:xx-large;}
.cmsBlokKop1		{font-weight:bold;}
.cmsBlokKop2		{color:var(--achtergrondkleur);font-weight:bold;}
.cmsBlokTabLink		{background:var(--achtergrondkleur);cursor:pointer;font-weight:bold;border-top:1px solid var(--tekstkleur);border-left:1px solid var(--tekstkleur);border-right:1px solid var(--tekstkleur);}
.cmsBlokTabLink2	{cursor:pointer;}
.cmsBlokAccLink		{margin-top:8px;cursor:pointer;font-weight:bold;font-style:italic;}
.cmsBlokAccMain		{display:none;}
.cmsBlokTabCell		{background:var(--achtergrondkleur);vertical-align:top;padding:5px;} 
.cmsBlokPlaatje		{width:100%;}
h3					{font-size:10pt;font-weight:bold;}
#spHeaderTable		{}
.contrast			{color:var(--tekstkleur);background:var(--achtergrondkleur);opacity:0.5;}
.spTopLijst			{position:absolute;background:var(--achtergrondkleur);max-width:100%;display:none;z-index:20;}
li.spTopLijst		{margin-top: 5px;}
#spTopPictureReduction	{height:100px;}
.spSfeerFotoContext	{display:none;position:absolute;top:0px;left:0px;width:100%;height:100%;background:var(--achtergrondkleur);z-index:999;}
.spSfeerFotoDiv		{display:none;position:absolute;background:var(--achtergrondkleur);z-index:1000;border-radius:2px;}
.spSfeerFotoTop		{height:30px;font-family:verdana;font-size:16pt;color:var(--tekstkleur);text-align:center;}
.spSfeerFotoLeft	{float:left;width:30px;font-size:20pt;font-weight:bold;color:var(--tekstkleur);cursor:pointer;}
.spSfeerFotoImg		{float:left;cursor:pointer;border-radius:2px;}
.spSfeerFotoRight	{float:left;width:30px;font-size:20pt;font-weight:bold;color:var(--tekstkleur);cursor:pointer;}
.spSfeerFotoBottom	{clear:both;height:30px;font-family:verdana;font-size:20pt;color:var(--tekstkleur);cursor:pointer;text-align:center;}
#spPagSfeerFotoLogo	{border-radius:4px;}
#spHdrLogo			{width:135px;border-radius:4px;display:none;}
#spThisCrum         {display:none;}

.spKolomSmall		{max-width:100%;vertical-align:top;padding-left:5px;}
.spKolomMedium		{max-width:100%;vertical-align:top;padding-left:5px;}
.spKolomLarge		{max-width:100%;vertical-align:top;padding-left:5px;}
.spBlok				{}
.spBlokLos			{border-radius:1rem !important;border:1px solid rgba(0, 48, 31, 0.175) !important;padding:1rem !important;}
.table{border-collapse:initial !important;}
.spBlokBoven		{border-radius:2px 2px 0px 0px;}
.spBlokOnder		{border-radius:0px 0px 2px 2px;}
.spBlokHtml			{}
/*.spBlokKopLos		{background:var(--groen);color:var(--achtergrondkleur);font-weight:bold;padding:5px;border-radius:2px;}
.spBlokKopVast		{background:var(--groen);color:var(--achtergrondkleur);font-weight:bold;padding:5px;border-radius:2px 2px 0px 0px;}*/

.spBlokKopVast, .spBlokKopLos
    {
    width:100%;
    display: inline-block;
    font-weight: bold;
    font-size: 1rem;  
    padding: 5px 5px;
    border-radius: 6px;
    margin-bottom: 5px;
    text-align: center;
    white-space: initial; 
    color: var(--achtergrondkleur) !important;
    background-color: var(--groen) !important;
    outline: solid 1px var(--groen) !important;
    }  

.table>tbody>tr>td	{border:0px;}

tr.menu				{border-bottom: solid 1px var(--uitlichtkleur);line-height:1.2rem;}
tr.abcMenu			{margin:2px;}
.menu a:link {color:var(--tekstkleur) !important;}

.bbFllBalloon		{max-width:300px;}

.vpVeldItem {}
#topcell			{background:var(--achtergrondkleur);}
#accMenu {}
#amHead				{background:var(--achtergrondkleur);border: 2px solid var(--groen);color:var(--groen);font-size:15pt;font-weight:bold;}
.amTitel			{background:var(--groen);width:330px;margin-top:2px;padding:2px;color:var(--achtergrondkleur);font-weight:bold;cursor:pointer;}
.amBlok				{display:none;background:var(--achtergrondkleur);width:330px;padding:2px;}
.amBlok.noJS		{display: inline;background:var(--achtergrondkleur);width:330px;padding:2px;}
.amPeriodeTitel		{background:var(--groen);margin-top:2px;padding:2px;color:var(--achtergrondkleur);cursor:pointer;text-align:left;}
.amPeriodeBlok		{display:none;}
.amPeriodeBlok.noJS	{display:inline;}
.amPeriodeVoorselectie	{text-align:left;}
.amPeriodeSelectie	{text-align:left;width:160px;height:150px;font-size:smaller;overflow-y:auto;overflow-x:auto;}
#prompt_amPeriodePers
,#prompt_amPeriodeSlk
,#prompt_amPeriodeHuis
,#prompt_amPeriodeAppt
,#prompt_amPeriodeHotel
,#prompt_amPeriodePension
,#prompt_amPeriodeBenB
,#prompt_amPeriodeChalet
,#prompt_amPeriodeLogies
,#prompt_amPeriodeCaravan
,#prompt_amPeriodeTent
,#prompt_amPeriodeCamping
,#prompt_amPeriodeSchip
,#prompt_amPeriodeGroep	
,#prompt_amPeriodeDuin
,#prompt_amPeriodeBos
,#prompt_amPeriodeDorp
,#prompt_amPeriodePark
,#prompt_amPeriodeVeld
,#prompt_amPeriodeHaven
,#prompt_amPeriodeLm
,#prompt_amPeriodeDier	
,#prompt_amPeriodeHaard	
,#prompt_amPeriodeInt	
,#prompt_amPeriodeWasm	
,#prompt_amPeriodeVaatw		{font-size:smaller;}
#amPeriodeNaselectie		{text-align:right;}
.tip				{color:red;font-weight:bold;}
#flashcontent		{background:var(--achtergrondkleur);}
.weerTijd	{padding-right:5px;border-right:2px solid grey;}

@media only screen and (max-width: 768px)
	{
	.spKolomSmall		{max-width:100%;vertical-align:top;padding-left:0px;padding-right:0px;}
	.spKolomMedium		{max-width:100%;vertical-align:top;padding-left:0px;padding-right:0px;}
	.spKolomLarge		{max-width:100%;vertical-align:top;padding-left:0px;padding-right:0px;}
	#spHeaderTable h1	{}
	}

.btn-groot-groen{width:100%;padding: 10px 0;}

/*grote zoek & boek knop*/
#introZbKnop 
    {
    position: relative;
    padding: 4rem;
    text-align: center;
    overflow: hidden;
    color: var(--tekstkleur);
    border: 1px solid var(--lichtgroen); 
    border-radius: 6px;
    background-color: var(--achtergrondkleur);            
    }

#introZbKnop:hover 
    {
    background-color: var(--lichtgroen);
    color: var(--tekstkleur); 
    border-color: var(--lichtgroen); 
    text-decoration: none;
    }

#introZbKnop .bg-icon 
    {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 155px; 
    color: var(--lichtgroen);
    z-index: 0; 
    }

#introZbKnop h4,
#introZbKnop h6 
    {
    position: relative;
    z-index: 1; /* tekst vóór het vergrootglas */
    }

/*Lastminute lm caroussel:*/
#lm_carousel_container{height:13rem;}
#lm_carousel {
    white-space: nowrap;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    margin: .5rem 0;
    scrollbar-color: var(--highlightkleur) transparent;
}
#lm_carousel .carousel_slide {
    padding: 2px;
    display: inline-block;
    width: 180px;
    vertical-align: top;
    position: relative;
    cursor: pointer;
    /*transition: width .2s*/
}
.lm_carousel_accnaam{font-size:.9rem;width:100%;font-weight: 400;transition: text-shadow 0.2s ease;transition: transform 0.2s ease;text-align:center;}
.lm_carousel:hover .lm_carousel_accnaam{text-shadow: 0.5px 0 0 var(--tekstkleur);transform: scale(1.05);}
/*.carousel_slide:hover 
    {
    width: 200px;
    }
.carouselTitelonderfoto
    {
    text-align:center;
    white-space:normal;
    }   */ 
#lmdata{display:inline;}
.lmpopup .btn-close{display:none;}
@media (min-width: 768px) {
  .lmpopup .btn-close{display:unset;}
}
.LastminutesTitel, .UitgelichtTitel{
    width:100%;
    display: inline-block;
    font-weight: bold;
    font-size: 1.1rem;  
    padding: .3rem;
    border-radius: .375rem;
    margin-bottom: .3rem;
    text-align: center;
    white-space: initial; 
}
.LastminutesTitel 
    {background-color: var(--highlightkleur);outline: solid 1px var(--highlightkleur) !important;}   
.UitgelichtTitel
    {background-color: var(--uitlichtkleur);outline: solid 1px var(--uitlichtkleur) !important;}        
.lmText{text-align: left;font-size: .8rem;}
#alle_lm_knop{font-size:.9rem;}
#alle_lm_knop i{font-size:1.25rem;margin-right:.5rem;}

/*advertenties*/
.advKnop:hover{opacity:1;}



.veldenRand{border: 1px solid var(--lichtgroen); border-radius: 25px; background-color: var(--lichtgroen); margin-top:1.5rem; padding-top: .8rem; padding-bottom: 0px;}
@media (max-width: 768px) 
    {
    .veldenRand 
        {
        border-radius: 10px; 
        padding: 15px;
        }
    }

.vpTabel td, .vpTabelLetter td {background-color:var(--achtergrondkleur);}
.vpTabel tr:hover td, .vpTabelLetter:hover td {background-color:var(--lichtgroen);}

#introkort{padding:.8rem;padding-bottom:0;}
#introlang{padding:0 .8rem;}

/*fotolink_lijst*/
#fotoLinkLijst > .row:not(:first-child) {padding-top: 1.5rem;}
.vpFotolink_lijstWrapper{overflow:hidden;position: relative;border-radius:10px;}
.vpFotolink_lijstFoto{width:100%;border-radius:10px;}
.vpFotolink_lijstFoto:hover{filter: blur(4px) brightness(0.8);transform: scale(1.05); }
.vpFotolink_lijstBadge{margin-bottom:1rem;max-width:85%;margin-left:7%;opacity:0.9;z-index:100}
.vpFotolink_lijstTitel{}
.vpFotolink_lijstOms{margin-bottom:1.5rem;opacity: 0;transition: opacity 0.4s ease-in-out;font-size:.8rem;}
.vpFotolink_lijstWrapper:hover .vpFotolink_lijstOms {opacity: 1;}
.vpFotolink_lijstOverlay{position: absolute;bottom: 0;left: 0;right: 0;display: flex;flex-direction: column;justify-content: flex-end;color: white;padding: 10px;height: 100%;border-radius: 10px;}

/*fotolink_lijst op mobiel*/
.vpFotolink_lijstWrapperXs{}
.vpFotolink_lijstFotoXs{width:100%;  aspect-ratio: 1 / 1; /* maakt het vierkant */object-fit: cover;border-radius: 50%;}
.vpFotolink_lijstTitelXs{color: var(--tekstkleur);font-size: 0.8rem;text-align: center;text-decoration:none;}
a .vpFotolink_lijstTitelXs{text-decoration:none;}
.vpFotolink_lijstWrapperXs a {text-decoration:none;}

/*bootstrap hover eraf halen*/
#fotoLinkContent .card:hover .card-body {background-color: transparent !important;}
/*.toast:hover .toast-body {background-color: transparent !important;}
.inline-toast:hover .toast-body{background-color:rgb(214.2, 214.2, 205.7);}*/


.btn-light.no-hover:hover,
.btn-light.no-hover:focus,
.btn-light.no-hover:active {
  background-color: var(--achtergrondkleur) !important;
  color: var(--tekstkleur) !important;
  box-shadow: none !important;
  cursor:auto !important;
}

.advertentieIcoon 
    {
    margin-right: 5px;
    font-size: 1.2rem;
    color: var(--groen);
    vertical-align: middle;
    }
#knopintro{font-weight:bold;}
#seointro{cursor:pointer;}
#seoOverlay {
    display: none;
    position: fixed;
    inset: 0;
    background: var(--achtergrondkleur);
    opacity:0.7;
    z-index: 999;
}

#seointroPopup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 90vw;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--achtergrondkleur);
    z-index: 1000;
    border-radius: 8px;
    width:100%;
}
