/******* Do not edit this file *******
Code Snippets Manager
Saved: Jan 09 2026 | 10:54:53 */
/* ===================================================
   GROUP: Basis CSS
   =================================================== */

/* ----- Sub: Secundaire knop styling----- */
.secundaireknop {
    -webkit-backdrop-filter: blur(16.5px);
    backdrop-filter: blur(16.5px);
}

/* ----- Sub: Fit content ----- */
.fit-content {
	width: fit-content;
}

/* ----- Sub: Subtitel roteren ----- */
.roteren {
    transform-origin: top left;
    transition: transform 0.3s ease;
}

@media (min-width: 1200px) {
    .roteren {
        transform: rotate(-90deg) translateX(-100%);
    }
}

/* ----- Sub: Swipe hover cursor effect ----- */
.swipe-hover, .swipe-hover a {
  cursor: url('/wp-content/uploads/Swipe-and-choose-icon-3.svg') 54 54, auto;
}

/* ----- Sub: Teksten afkappen op 2 regels ----- */
.afkap3 {
	 display: -webkit-box;
	 -webkit-line-clamp: 3;
	 -webkit-box-orient: vertical;
	 overflow: hidden;
	 text-overflow: ellipsis;
	 width: 100%;
	 word-break: break-word;
}

/* ----- Sub: Zorg dat lange woorden netjes worden afgebroken ----- */
@media (max-width: 767px) {
  h1, h2, h3, h4, h5, h6 {
    word-break: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
  }
}

/* ----- Sub: Hoveren over een link ----- */
a {
    color: #C5A055; /* normale kleur van de link */
    transition: color 0.3s ease; /* 0.3 seconden vloeiende overgang voor de kleur */
}
a:hover {
    color: #A3813B; /* kleur bij hover */
}


/* ----- Sub: Bullets aanpassen ----- */
.elementor-widget-text-editor ul {
  list-style: none;
  padding: 0;
  margin-bottom: 20px;
}

.elementor-widget-text-editor ul li:before {
  content: '•';
  margin-right: 8px;
}



/* ----- Sub: Tabs ruimte kleiner maken op tablet en mobile ----- */
@media (max-width: 767px) {
  .e-n-tabs-heading {
    display: flex !important;  /* forceer flex */
    flex-wrap: wrap !important; /* forceer wrap als het nodig is */
    gap: 12px !important;      /* forceer de ruimte tussen de knoppen */
  }

  .e-n-tabs-heading .e-n-tab-title {
    flex: 1 1 auto !important; /* optioneel: maakt knoppen flexibel */
    margin: 0 !important;      /* reset oude marges die plugin kan gebruiken */
  }
}





/* ===================================================
   GROUP: Menubalk
   =================================================== */

/* ----- Sub: Menubalk basis----- */
@media (min-width: 1200px) {
	.menu {
		transition: all 0.3s ease!important;
		padding: 22px 36px;
	}
}

/* ----- Sub: Menubalk sticky effecten----- */
@media (min-width: 1200px) {
	.menu.elementor-sticky--effects {
		-webkit-backdrop-filter: blur(16.5px);
		backdrop-filter: blur(16.5px);
		background-color: #6969696B!important;
	}
	
	.menu.elementor-sticky--active {
		width: fit-content !important;
	}
}

/* ----- Sub: Hamburgermenu op tablet en mobile ----- */
span.elementor-menu-toggle__icon--open, span.elementor-menu-toggle__icon--close {
    display: flex;
    padding: 22px 33px;
	-webkit-backdrop-filter: blur(16.5px);
	backdrop-filter: blur(16.5px);
}

/* ----- Sub: CTA op mobile ----- */
@media (max-width: 767px) {
    .menucta {
        position: fixed;
        bottom: 24px;
        width: calc(100% - 48px)!important;
        left: 50%;
        transform: translateX(-50%);
        opacity: 0;
        transition: opacity 0.3s ease;
        pointer-events: none; /* voorkomt dat je erop klikt als hij onzichtbaar is */
    }

    .menucta.visible {
        opacity: 1;
        pointer-events: auto;
    }
}

/* ===================================================
   GROUP: Scrollbalk
   =================================================== */

/* ----- Sub: Standaard scrollbalk weghalen ----- */
html {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE 10+ */
}

html::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Edge */
}

/* ----- Sub: Nieuwe scrollbalk styling ----- */
.scrollbalk {
  transform: translateY(-50%) rotate(90deg) translateX(100%);
  transform-origin: top right;
  position: fixed;
  top: 40%;
  right: clamp(1rem, -9.4659rem + 21.8324vw, 8rem);
}

/* ===================================================
   GROUP: Achtergrond afbeeldingen
   =================================================== */

/* ----- Sub: Afbeelding op achtergrond zetten ----- */
.imgbg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ----- Sub: Afbeelding een overlay gradient geven ----- */
.imgverloop::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(260deg, rgba(0, 0, 0, 0.00) 35.04%, #000 100%);
  pointer-events: none;
}

/* ----- Sub: Afbeelding een donkere overlay geven ----- */
.imgoverlay::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #121212CC;
}

/* ===================================================
   GROUP: Loops
   =================================================== */
.pageloop {
  border: 1px solid rgba(255, 255, 255, 0.11);
  -webkit-backdrop-filter: blur(6.5px);
  backdrop-filter: blur(6.5px);
  background-color: rgba(18, 18, 18, 0.1);
  transition: all 0.3s ease;
}

.pageloop:hover {
  border: 1px solid rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(16.5px);
  backdrop-filter: blur(16.5px);
  background-color: rgba(11, 11, 11, 0.6);
}

.pageloop .loop-knop {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.pageloop:hover .loop-knop {
    opacity: 1;
}


.pageloop2 .loop-knop {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.pageloop2:hover .loop-knop {
    opacity: 1;
}