/* =============================================================================
 * style.css
 * =============================================================================
 *
 * Project-specifieke styling. Vul aan per project.
 *
 * Bevat:
 *   - @font-face declaraties (verwijzen naar /fonts/)
 *   - CSS variabelen (:root)
 *   - Reset / base styles
 *   - Layout en componenten
 *   - Block-specifieke styling
 *   - Media queries
 *
 * Wordt op twee plekken ingeladen:
 *   1. Frontend  — via wp_enqueue_style in nepal360_scripts() (functions.php)
 *   2. Editor    — via add_editor_style() in nepal360_setup() (functions.php)
 *                  zodat blokken in de Gutenberg editor identiek renderen
 *
 * NB: De style.css in de theme root bevat alleen de WordPress thema header
 * en wordt NIET geënqueued.
 * ============================================================================= */

/* Table of Content
==================================================
	#Font-Face
	#Site Styles
	#Media Queries */

/* #Font-Face
================================================== */
/* Fonts staan lokaal in css/fonts.css */

/* #Site Styles
================================================== */
:root {
	--blok-ruimte: 20px; /* ruimte boven en onder elk blok — desktop 40px (zie 1025px) */
	--font-size-base: 16px;
	--width-base: 1316px;
	--font-family-base: 'Roboto', sans-serif;
	--font-family-avenir: 'Avenir', sans-serif;
	--font-family-heading: 'Merriweather', sans-serif;
	--font-family-icon: 'icomoon', sans-serif;
	--lineheight-base: 1.35;
	--gutter-base: 15px;
	--color-text: #4a5568;
	--color-primary: #dbb601;
	--color-secondary: #517af0;
	--color-white: #fff;
	--color-black: #000;
	--color-grey: #718096;
	--color-light: #edf1f7;
	--color-dark: #1a202c;
	--color-green: #059669;
	--color-pink: #d17786;
	--color-bronze: #785a00;
	--color-warm: #808469;
	--color-blue-100: #cbd5e0;
	--color-yellow: #fcbf03;
	--color-yellow-100: #f2b704;
	--color-bright: #f7fafc;
	--color-grey-100: #a0aec0;
	--color-grey-200: #e5e8eb;
	--color-grey-300: #2d3748;
	--color-grey-400: #909daf;
	--color-pink-100: #eedcdf;
	--color-green-100: #b0dcbc;
	--color-green-200: #005a0c;
	--color-button-hover: #c9a804;
	--duration: 0.25s ease-in-out;
	--font-size-h1: 40px;
	--font-size-h2: 26px;
	--font-size-h3: 22px;
	--font-size-h4: 20px;
	--font-size-h5: 18px;
	--font-size-h6: 16px;
	--default-radius: 12px;
	--heading-lineheight: 1.1;
	--font-weight-light: 300;
	--font-weight-regular: 400;
	--font-weight-medium: 500;
	--font-weight-bold: 700;
	--font-weight-heavy: 900;
}

/* =============================================================================
 * Blokruimte — elk blok krijgt --blok-ruimte boven en onder (20px mobiel, 40px
 * desktop). Padding als standaard: de ruimte valt binnen het blok, dus een
 * achtergrondkleur uit de instellingen-tab heeft lucht, en twee blokken staan
 * altijd 2× --blok-ruimte uit elkaar (padding valt niet weg zoals margin).
 * Margin alleen bij blokken met een eigen gekleurd vlak over de volle breedte;
 * hun eigen padding is de binnenruimte van dat vlak.
 * De instellingen-tab (padding/margin per blok) overschrijft dit inline.
 * ============================================================================= */

.usp,
.travel,
.ebook,
.trips,
.blogs,
.blogs-overzicht,
.social,
.over,
.cta,
.seo,
.about,
.visit,
.member,
.contact,
.social-media,
.content,
.information { padding-top: var(--blok-ruimte); padding-bottom: var(--blok-ruimte); }

.reviews,
.offer { margin-top: var(--blok-ruimte); margin-bottom: var(--blok-ruimte); }

/* ### general ### */
* { margin: 0; padding: 0; box-sizing: border-box; }
html,
body { font-family: var(--font-family-base), sans-serif; font-size: var(--font-size-base); font-weight: var(--font-weight-regular); line-height: var(--lineheight-base); color: var(--color-text); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { background: url('../images/body-bg.png') repeat top center; }
input,
select,
textarea { padding: 8px 18px; width: 100%; height: 48px; font-family: var(--font-family-base), sans-serif; font-size: var(--font-size-base); font-weight: var(--font-weight-medium); color: var(--color-dark); border: 1px solid rgba(26, 32, 44, 0.2); border-radius: var(--default-radius); background-color: var(--color-white); resize: none; }
select { background: var(--color-white) url('../images/select-arrow.png') no-repeat center right 18px; background-size: 7px 5px; appearance: none; -webkit-appearance: none; cursor: pointer; }
textarea { margin-bottom: 8px; padding-top: 15px; height: 148px; }
input[type='checkbox'] { padding: 0; display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; border: 1px solid rgba(46, 46, 46, 0.1); border-radius: var(--default-radius); background-color: var(--color-white); -webkit-appearance: none; }
input[type='checkbox']:checked:before { display: block; font-family: var(--font-family-icon), sans-serif; font-size: 8px; content: '\e901'; }
input::placeholder,
textarea::placeholder { color: var(--color-dark); }
img { display: block; max-width: 100%; height: auto; border: 0; }
ul,
li { list-style: none; }
p { margin-bottom: 20px; }
a { display: inline-block; color: var(--color-primary); transition: var(--duration); }
:focus { outline: none; }
h1,
h2,
h3,
h4,
h5,
h6 { margin-bottom: 16px; font-family: var(--font-family-heading), sans-serif; font-weight: var(--font-weight-medium); line-height: var(--heading-lineheight); color: var(--color-dark); }
h1 { font-size: var(--font-size-h1); }
h2 { font-size: var(--font-size-h2); }
h3 { font-size: var(--font-size-h3); }
h4 { font-size: var(--font-size-h4); }
h5 { font-size: var(--font-size-h5); }
h6 { font-size: var(--font-size-h6); }

/* ### global classes ### */
.clear { visibility: hidden; clear: both; height: 0; line-height: 0; }
.centered,
.centered-lg { padding-right: var(--gutter-base); padding-left: var(--gutter-base); }
blockquote { padding: 20px; font-size: 18px; font-weight: var(--font-weight-medium); font-style: italic; line-height: 1.5; border: solid 1px var(--color-light); border-radius: 24px; background-color: var(--color-white); }

/* ### button ### */
.button { padding: 5px 30px; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; font-family: var(--font-family-base), sans-serif; font-size: var(--font-size-base); font-weight: var(--font-weight-medium); text-decoration: none; color: var(--color-white); border: 0; border-radius: 55px; background-color: var(--color-primary); transition: var(--duration); cursor: pointer; }
.blok-leeg { margin: 20px auto; padding: 20px 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; max-width: var(--width-base); font-family: var(--font-family-base), sans-serif; font-size: var(--font-size-base); color: var(--color-text); border: 2px dashed var(--color-primary); border-radius: 16px; background-color: var(--color-bright); }
.blok-leeg strong { font-weight: var(--font-weight-bold); color: var(--color-dark); }
.blok-leeg span { flex: 1 1 auto; }
.blok-leeg .button { min-height: 40px; padding: 5px 24px; }
.button:focus,
.button:hover { background-color: var(--color-button-hover); }
.button-outline-white,
.button-outline { padding: 5px 40px; color: var(--color-primary); border: 1px solid var(--color-primary); background-color: transparent; }
.button-outline:focus,
.button-outline:hover { color: var(--color-white); background-color: var(--color-primary); }
.button-outline-secondary { padding: 5px 40px; color: var(--color-dark); border: 1px solid var(--color-dark); background-color: transparent; }
.button-outline-secondary:focus,
.button-outline-secondary:hover { color: var(--color-white); background-color: var(--color-dark); }
.button-white { color: var(--color-warm); background-color: var(--color-white); }
.button-white:focus,
.button-white:hover { color: var(--color-white); }
.button-outline-white { color: var(--color-white); border: 1px solid var(--color-white); }
.button-outline-white:focus,
.button-outline-white:hover { color: var(--color-primary); background-color: var(--color-white); }

/* ### wrapper ### */
#wrapper { position: relative; display: block; width: 100%; min-height: 100%; overflow-x: clip; }

/* ### header ### */
.header { padding-top: 10px; padding-bottom: 10px; position: fixed; top: 0; left: 0; z-index: 9; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; width: 100%; transition: var(--duration); }
.header-logo { width: 65px; transition: var(--duration); }
.header-logo img { width: 100%; }
.header.sticky { padding-top: 5px; padding-bottom: 5px; background-color: var(--color-white); }
.admin-bar .header { top: 46px; }
@media only screen and (min-width: 783px) { .admin-bar .header { top: 32px; } }
.header.sticky .header-logo { width: 60px; }
.header.sticky .mobile-menu .hamburger svg { stroke: var(--color-dark); }
.header.sticky .mobile-menu { top: 5px; }

/* ### header-menu ### */
.header-menu { display: none; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
.header-menu ul { display: flex; flex-wrap: wrap; justify-content: center; }
.header-menu li { position: relative; }
.header-menu li a { display: inline-flex; align-items: center; font-weight: var(--font-weight-medium); text-decoration: none; color: var(--color-white); transition: var(--duration); }
.header-menu li a i { margin-left: 5px; font-size: 7px; }
.header-menu li a:focus,
.header-menu li a:hover { color: var(--color-primary); }
.header-menu li ul { padding: 10px 0; position: absolute; top: 100%; left: 0; display: block; opacity: 0; visibility: hidden; width: max-content; border-radius: var(--default-radius); background-color: var(--color-white); transition: var(--duration); box-shadow: 0 2px 5px rgb(0, 0, 0, 0.16); }
.header-menu li:hover ul { opacity: 1; visibility: visible; }
.header-menu li li a { padding: 3px 15px 1px; display: block; color: var(--color-text); }
.header-menu li li ul { top: 0; left: 100%; display: none; width: max-content; }
.header-menu li li:hover ul { display: block; }
.header-menu li:not(:last-child) { margin-right: 20px; }
.header-menu .button { margin-left: 20px; }
.header-menu li li:not(:last-child) { margin-right: 0; }

/* Gewone dropdown: wat ruimte onder het hoofditem, met een brug zodat de hover niet wegvalt */
.header-menu > ul > li:not(.is-mega) > ul { margin-top: 15px; }
.header-menu > ul > li:not(.is-mega) > ul:before { position: absolute; bottom: 100%; left: 0; right: 0; height: 15px; content: ''; }

/* Kopjes zonder link (inc/mega-menu.php) */
.header-menu li .menu-kopje { display: inline-flex; align-items: center; font-weight: var(--font-weight-medium); color: var(--color-white); cursor: default; }
.header-menu li .menu-kopje i { margin-left: 5px; font-size: 7px; }
.header-menu li li .menu-kopje { padding: 3px 15px 1px; display: block; font-weight: var(--font-weight-bold, 700); color: var(--color-dark); }

/* Mega menu: paneel over de volle breedte, kolommen gecentreerd */
.header-menu li.is-mega { position: static; }
/* Het hoofditem van een mega menu vult de volle hoogte van de header (het logo
 * maakt de header hoger dan de links). Zo loopt de hover-zone van het hoofditem
 * door tot de onderkant van de header-inhoud; alleen de header-padding blijft
 * over en die overbrugt .mega-paneel:before. Gewone items blijven gecentreerd. */
.header-menu { align-self: stretch; }
.header-menu > ul { align-self: stretch; align-items: center; }
.header-menu > ul > li.is-mega { align-self: stretch; display: flex; align-items: center; }
.header-menu li.is-mega > .mega-paneel { padding: 30px 20px 35px; position: absolute; top: 100%; left: 0; right: 0; opacity: 0; visibility: hidden; pointer-events: none; border-radius: 0 0 var(--default-radius) var(--default-radius); background-color: var(--color-white); box-shadow: 0 20px 30px rgba(26, 32, 44, 0.08); transition: var(--duration); }
.header-menu li.is-mega:hover > .mega-paneel,
.header-menu li.is-mega:focus-within > .mega-paneel { opacity: 1; visibility: visible; pointer-events: auto; }
/* Dicht = onzichtbaar én niet aanwijsbaar, ook de lijsten erin (visibility: inherit),
 * zodat het paneel alleen opent vanaf het hoofditem en niet als je toevallig
 * over het lege gebied onder de header beweegt */
.header-menu li.is-mega > .mega-paneel:before { position: absolute; bottom: 100%; left: 0; right: 0; height: 40px; content: ''; } /* brug over de header-padding, zodat hover niet wegvalt */
.mega-kolommen { margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; gap: 30px 50px; max-width: 1400px; }
.mega-kolom { flex: 0 1 220px; min-width: 160px; }
.header-menu .mega-paneel ul { padding: 0; position: static; display: block; opacity: 1; visibility: inherit; width: auto; border-radius: 0; background: none; box-shadow: none; }
.header-menu .mega-paneel li { margin-right: 0; }
.header-menu .mega-kolom > ul > li + li { margin-top: 24px; }
.header-menu .mega-kopje > a,
.header-menu .mega-kopje > .menu-kopje { margin-bottom: 8px; padding: 0; display: block; font-family: var(--font-family-heading), sans-serif; font-size: 17px; font-weight: var(--font-weight-medium); color: var(--color-dark); }
.header-menu .mega-links li a { padding: 4px 0; display: block; font-weight: var(--font-weight-regular, 400); color: var(--color-text); }
.header-menu .mega-links li a:hover,
.header-menu .mega-kopje > a:hover { color: var(--color-primary); }

/* Mobiel: kopjes */
.m-menu ul li .menu-kopje { padding: 0 15px; display: block; line-height: 47px; color: var(--color-dark); border-bottom: 1px solid var(--color-text); cursor: default; }
nav .m-menu ul li label.menu-kopje { padding-right: 60px; cursor: pointer; border-bottom: 1px solid var(--color-text); }
.m-menu ul li.m-menu__kopje > a,
.m-menu ul li.m-menu__kopje > .menu-kopje { font-family: var(--font-family-heading), sans-serif; font-weight: var(--font-weight-medium); color: var(--color-dark); background-color: var(--color-light); }
.m-menu ul.m-menu__groep { height: auto; overflow: visible; }

/* ### Mobile Menu ### */
.mobile-menu { position: absolute; top: 10px; right: 0; transition: var(--duration); }
.mobile-menu .hamburger { position: absolute; top: 13px; right: 20px; display: flex; align-items: center; color: var(--color-primary);
transition: var(--duration); cursor: pointer; }
.mobile-menu .hamburger svg { stroke: var(--color-white); }
.mobile-menu label { margin-bottom: 0; }
.m-menu__checkbox { display: none !important; }
.m-menu__toggle { margin-left: -8px; padding-top: 5px; cursor: pointer; }
.m-menu { position: fixed; top: 0; right: -768px; z-index: 2; opacity: 0; visibility: hidden; width: calc(100vw - 30px); max-width: 768px; height: 100vh; background-color: var(--color-white); -o-transform: translate3d(-450px, 0, 0); transform: translate3d(768px, 0, 0); transition: transform 0.35s; overflow: hidden; }
.m-menu__overlay { position: absolute; top: 0; bottom: 0; z-index: 1; display: none; width: 100%; background-color: rgba(103, 103, 103, 0.5); }
.m-menu__header { padding: 0 16px; display: flex; align-items: center; height: 61px; border-bottom: 1px solid var(--color-text); }
.m-menu__header span { width: 100%; font-size: 20px; text-align: center; color: var(--color-white); }
.m-menu .m-menu { transform: translate3d(768px, 0, 0); }
.m-menu .header-submenu { padding: 5px 0; border-bottom: 1px solid var(--color-text); }
.m-menu ul { height: 100%; overflow-y: auto; }
.m-menu ul li { margin-right: 0 !important; position: relative; display: block !important; }
.m-menu ul li ul { display: block !important; }
.m-menu ul li a { font-size: 16px; font-weight: 500; }
.m-menu ul li a:focus,
.m-menu ul li a:hover { text-decoration: none !important; color: var(--color-secondary); }
.m-menu ul li a,
nav .m-menu ul li label { padding: 0 15px; position: relative; display: block; line-height: 47px; text-align: left; text-decoration: none; color: var(--color-text); border-bottom: 1px solid var(--color-text); cursor: pointer; }
nav .m-menu ul li label { border-bottom: 0; }
.m-menu .btn-last { padding: 15px 10px; border-bottom: 0; }
.m-menu .button { display: flex; align-items: center; justify-content: center; color: var(--color-white); border: 0; }
.m-menu .button:focus,
.m-menu .button:hover { background-color: var(--color-secondary); }
.m-menu .button.button-arrow:after { height: 42px; }
.m-menu ul li label.a-label__chevron { position: absolute; top: 0; right: 0; display: inline-block; width: 51px; height: 48px; border-left: solid 1px var(--color-text); }
.m-menu ul li label.a-label__chevron:after { padding: 5px; position: absolute; top: 19px; right: 20px; display: inline-block; width: 0; height: 0; border-color: var(--color-text); border-style: solid; border-width: 1px 1px 0 0; transform: rotate(45deg); content: ''; }
.m-menu ul li .-invisible { border-bottom: 0; }
.m-menu .m-menu label.m-menu__toggle { margin: 0 !important; padding: 0 0 0 10px; display: flex; border-bottom: 0; }
.m-menu__checkbox:checked ~ .m-menu__overlay { display: block; }
.m-menu__checkbox:checked ~ .m-menu { right: 0; opacity: 1; visibility: visible; transform: translate3d(0, 0, 0); }

/* ### hero ### */
.hero { margin-bottom: 5px; padding-top: 110px; padding-bottom: 120px; position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; }
.hero h1 { margin-bottom: 25px; color: var(--color-white); }
.hero-block { position: relative; z-index: 1; width: 100%; }
.hero-intro { width: 100%; font-size: 18px; font-weight: var(--font-weight-medium); color: var(--color-white); }
.hero-intro p { margin-bottom: 28px; }
.hero-lead { margin-bottom: 10px; padding: 8px 20px 7px 16px; display: inline-flex; flex-wrap: wrap; align-items: center; font-size: 14px; font-weight: var(--font-weight-medium); color: var(--color-grey-200); border: solid 1px var(--color-grey-400); border-radius: 55px; background-color: rgba(113, 128, 150, 0.8); }
.hero-lead i { margin-right: 9px; font-size: 16px; }
.hero-form { padding: 10px 20px 20px; min-height: 100px; border-radius: var(--default-radius); background-color: var(--color-white); }
.hero-group { padding-top: 16px; padding-bottom: 5px; position: relative; width: 100%; }
.hero-form select { padding: 25px 0 0; height: 50px; font-size: var(--font-size-base); font-weight: var(--font-weight-medium); border: 0; border-radius: 0; background: var(--color-white) url('../images/select-arrow.png') no-repeat bottom 10px right 0; background-size: 7px 5px; cursor: pointer; }
.hero-group.last { border-right: none !important; }
.hero-form span { position: absolute; top: 17px; left: 0; display: inline-block; font-size: 12px; font-weight: var(--font-weight-medium); text-transform: uppercase; color: var(--color-grey-100); pointer-events: none; }
.hero-form .button { margin-top: 15px; width: 100%; border-radius: 24px; }
.hero-form .button i { margin-right: 10px; font-size: 18px; }
.hero-group:not(:last-child) { border-bottom: solid 1px var(--color-light); }
.hero-bg-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.hero-bg-image:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(26, 32, 44, 0.2); content: ''; }
.hero-bg-image img { width: 100%; height: 100%; object-fit: cover; }
.hero:after { position: absolute; bottom: 0; left: 0; width: 100%; height: 60px; background: url('../images/pattern-clouds.png') repeat-x left bottom; background-size: 1920px 100%; content: ''; }
.hero.inner { margin-bottom: 0; padding-bottom: 30px; } /* ruimte eronder komt van het volgende blok (--blok-ruimte) */
.hero.is-alt .hero-intro,
.hero.inner .hero-intro { margin: 0 auto 25px; text-align: center; }
.hero.inner .hero-form { margin: 0 auto; }
.hero.inner .hero-bottom { margin-top: auto; }
.hero.inner.no-form { padding-bottom: 110px; }

/* ### breadcrumb ### */
.breadcrumb { margin-bottom: 2px; }
.breadcrumb ul { display: flex; flex-wrap: wrap; justify-content: center; }
.breadcrumb li { position: relative; font-size: 14px; font-weight: var(--font-weight-medium); text-transform: lowercase; color: var(--color-white); }
.breadcrumb li a { text-decoration: none; color: var(--color-white); }
.breadcrumb li a:hover { text-decoration: underline; }
.breadcrumb li:not(:last-child):after { margin: 0 11px; display: inline-block; vertical-align: baseline; content: '|'; }

/* ### usp ### */

.usp-block { padding-bottom: 30px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 20px; border-bottom: solid 1px var(--color-light); row-gap: 20px; }
.usp strong { margin-bottom: 11px; display: block; font-size: 16px; font-weight: var(--font-weight-medium); color: var(--color-dark); }
.usp-info { font-size: 14px; text-align: center; }
.usp-info p { margin-bottom: 0; }
.usp-icon { margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; font-size: 26px; color: var(--color-secondary); border-radius: var(--default-radius); background-color: rgba(81, 122, 240, 0.08); }
.usp-icon img { width: 26px; height: 26px; object-fit: contain; }

/* ### intro-text ### */
.intro-text { margin-bottom: 24px; font-weight: var(--font-weight-medium); text-align: center; color: var(--color-dark); }
.intro-text p:last-child { margin-bottom: 0; }

/* ### travel ### */

.travel-intro { margin-bottom: 22px; }
.travel-toggle { margin: 0 auto 30px; padding: 4px; display: flex; justify-content: space-between; width: 100%; max-width: 346px; border: 1px solid var(--color-light); border-radius: var(--default-radius); background-color: var(--color-white); }
.travel-toggle button { display: flex; align-items: center; justify-content: center; min-width: 150px; height: 48px; font-family: var(--font-family-base), sans-serif; font-size: var(--font-size-base); font-weight: var(--font-weight-regular); color: var(--color-grey); border: 0; border-radius: var(--default-radius); background-color: transparent; cursor: pointer; }
.travel-toggle button.is-active { color: var(--color-white); background-color: var(--color-grey); }
.travel-toggle button:last-of-type { margin-right: 0; }
.travel-block { margin-bottom: 40px; }
.travel-table { overflow-x: auto; }
.travel-table.active { display: block; }
.travel-table-head { padding: 0 5px; display: flex; flex-wrap: wrap; }
.travel-table-head-item { width: 21.3%; font-weight: var(--font-weight-heavy); color: var(--color-dark); }
.travel-table-head-item.is-hide { display: none; }
.travel-table-head-item:nth-child(2) { width: 11.2%; }
.travel-table-head-item:nth-child(3) { width: 9.3%; }
.travel-table-head-item:nth-child(4) { width: 9.5%; }
.travel-table-head-item:nth-child(5) { width: 11.4%; }
.travel-table-head-item:nth-child(6) { width: 25%; }
.travel-table-head-item:nth-child(7) { width: 10.4%; }
.travel-table-row { padding: 7px 5px; display: flex; gap: 2px; align-items: center; justify-content: space-between; background-color: var(--color-bright); }
.travel-table-row:nth-child(odd) { background-color: transparent; }
.travel-table-item { color: var(--color-grey-300); font-size: 12px; }
.travel-table-item small { margin-left: 10px; display: flex; justify-content: center; width: 11px; height: 11px; font-size: 8px; font-weight: var(--font-weight-bold); font-style: normal; color: var(--color-white); border-radius: 55px; background-color: var(--color-dark); }
.travel-table tr td strong,
.travel-table-item strong { padding: 1px 6px; display: inline-flex; font-size: 11px; font-weight: var(--font-weight-medium); color: var(--color-green-200); border-radius: var(--default-radius); background-color: rgba(132, 201, 150, 0.64); }
.travel-table-item .button { padding: 0; width: 25px; height: 25px; min-height: auto; font-size: 10px; border-radius: 6px; }
.travel-table-item .button em { display: none; font-style: normal; }
.travel-table-item.is-hide { display: none; }
.travel-table-item.is-flex { display: flex; }
.travel-table-item span.is-mobile { display: block; }
.travel-table-item.is-tablet { display: none; }
.travel-all { margin-top: 30px; text-align: center; }
.travel-all .button { min-width: 266px; }
.travel-table table { border-top: solid 1px var(--color-light); }
.travel-table thead tr td { padding: 2px 22px; font-weight: var(--font-weight-heavy); }
.travel-table tbody tr:nth-child(odd) { background-color: var(--color-light); }
.travel-table tbody tr td { padding: 6px 15px; }
.travel-table tr td .button { padding: 10px 20px 5px; min-height: 36px; font-weight: var(--font-weight-heavy); }
.travel-holder,
.travel-table { display: none; }
.travel-table.is-active,
.travel-holder.is-active { display: block; }
.travel-grid { display: grid; grid-template-columns: 1fr; gap: 30px; }
.travel-leeg { padding: 40px 0; text-align: center; }
.travel-grid .travel-leeg { grid-column: 1 / -1; }

.blogs-filter { margin: 0 auto 40px; display: flex; flex-wrap: wrap; gap: 15px; justify-content: center; max-width: 1080px; }
.blogs-filter select { padding: 0 40px 0 16px; flex: 1 1 100%; height: 56px; font-family: var(--font-family-base), sans-serif; font-size: var(--font-size-base); color: var(--color-dark); border: 1px solid var(--color-light); border-radius: var(--default-radius); background: var(--color-white) url('../images/select-arrow.png') no-repeat right 16px center; background-size: 7px 5px; -webkit-appearance: none; appearance: none; cursor: pointer; }
.blogs-filter .button { flex: 1 1 100%; min-height: 56px; }
.travel-bottom { display: flex; justify-content: center; }
.travel .swiper { overflow: visible; }

/* ### card-travel ### */
.card-travel { display: block; text-decoration: none; color: var(--color-text); border: 1px solid var(--color-light); border-radius: 24px; overflow: hidden; background-color: var(--color-white); }
.card-travel-image { position: relative; width: 100%; }
.card-travel-image img { width: 100%; height: 100%; object-fit: cover; }
.card-travel-image:after { position: absolute; bottom: 0; left: 0; width: 100%; height: 24px; background: url('../images/seperator-white.png') no-repeat; background-size: 100% 100%; content: ''; }
.card-travel-tag { padding: 10px; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; }
.card-travel-tag span { padding: 3px 16px 1px 18px; font-size: 14px; font-weight: var(--font-weight-medium); color: var(--color-grey); border-radius: 55px; background-color: var(--color-light); }
.card-travel-tag span:nth-child(2) { color: var(--color-pink); background-color: var(--color-pink-100); }
.card-travel-info { padding: 0 20px 29px; }
.card-travel-info.bg-white { background-color: var(--color-white); }
.card-travel-title { margin-bottom: 9px; font-family: var(--font-family-heading), sans-serif; font-size: 20px; font-weight: var(--font-weight-medium); color: var(--color-dark); }
.card-travel-mount { margin-bottom: 16px; display: flex; flex-wrap: wrap; align-items: center; }
.card-travel-mount em { margin-left: 10px; display: flex; align-items: center; justify-content: center; width: 11px; height: 11px; font-size: 8px; font-weight: var(--font-weight-bold); font-style: normal; color: var(--color-white); border-radius: 55px; background-color: var(--color-dark); }
.card-travel-mount em[data-uitleg],
.travel-table-item small[data-uitleg] { position: relative; cursor: help; }
.card-travel-mount em[data-uitleg]:hover:after,
.travel-table-item small[data-uitleg]:hover:after { padding: 10px 12px; position: absolute; bottom: calc(100% + 8px); left: 0; z-index: 5; width: 240px; font-size: 13px; font-weight: 400; line-height: 1.4; text-align: left; white-space: normal; color: var(--color-white); border-radius: 8px; background-color: var(--color-dark); content: attr(data-uitleg); }
.card-travel-info p { margin-bottom: 17px; font-size: 14px; line-height: 1.2; }
.card-travel-info ul { margin-bottom: 25px; }
.card-travel-info li { padding-left: 15px; position: relative; color: var(--color-text); }
.card-travel-info li:before { position: absolute; top: 6px; left: -1px; font-family: var(--font-family-icon), sans-serif; font-size: 9px; color: var(--color-green); content: '\e904'; }
.card-travel-info li:not(:last-child) { margin-bottom: 9px; }
.card-travel-info h6 { margin-bottom: 2px; font-weight: var(--font-weight-bold); text-align: center; }
.card-travel-panel { margin-bottom: 19px; padding: 7px 10px; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; border-top: 1px solid var(--color-light); border-bottom: 1px solid var(--color-light); }
.card-travel-date { display: flex; align-items: center; font-size: 14px; color: var(--color-grey); }
.card-travel-date i { margin-right: 5px; font-size: 15px; color: var(--color-secondary); }
.card-travel-data { margin-bottom: 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: center; }
.card-travel-data span { padding: 6px 6px 3px; font-family: var(--font-family-avenir), sans-serif; font-size: 12px; font-weight: var(--font-weight-heavy); line-height: var(--heading-lineheight); color: var(--color-bronze); border-radius: 6px; background-color: rgba(242, 183, 4, 0.2); }
.card-travel-text .button { width: 100%; }
.card-travel-price { margin-bottom: 13px; font-size: 14px; text-align: center; }
.card-travel-price strong { font-size: 20px; font-weight: var(--font-weight-bold); color: var(--color-grey-300); }
.card-travel-button { width: 100%; }
.card-travel-button button { width: 100%; }
.card-travel-logo { padding-top: 20px; display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.card-travel:focus .card-travel-info .button,
.card-travel:hover .card-travel-info .button { background-color: var(--color-button-hover); }

/* ### reviews ### */
.reviews { padding-top: 40px; padding-bottom: 40px; position: relative; }
.reviews-block { position: relative; z-index: 1; }
.reviews-bg-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.reviews-bg-image:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(237, 241, 247, 0.9); content: ''; }
.reviews-bg-image img { width: 100%; height: 100%; object-fit: cover; }
.reviews-bottom { display: flex; justify-content: center; }
.reviews-holder { position: relative; }
.reviews .swiper { margin-bottom: 40px; overflow: visible; }
.reviews .swiper-slide { height: auto; }
.reviews .swiper-button-prev,
.reviews .swiper-button-next { left: -10px; }
.reviews .swiper-button-next { right: -10px; left: unset; }
.reviews.inner { padding-top: 0; padding-bottom: 0; }
.reviews.inner .card-review p { margin-bottom: 27px; }
.reviews.inner .card-review p:last-child { margin-bottom: 17px; }
.reviews-wrap { margin-bottom: 40px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 17px; row-gap: 20px; }

/* ### ebook ### */

.ebook h2 { color: inherit; }
.ebook-block { padding: 40px 20px; position: relative; color: var(--ebook-tekst, var(--color-white)); border-radius: 24px; background-color: var(--ebook-bg, var(--color-warm)); }
.ebook-intro { width: 100%; line-height: 1.6; color: inherit; }
.ebook-intro p { margin-bottom: 14px; }
.ebook-intro ul { margin-bottom: 23px; }
.ebook-intro li { margin-bottom: 10px; padding-left: 15px; position: relative; }
.ebook-intro li:after { position: absolute; top: 5px; left: -2px; font-family: var(--font-family-icon), sans-serif; font-size: 10px; content: '\e904'; }
.ebook-form { font-size: 12px; }
.ebook-form-input { margin-bottom: 7px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 15px; row-gap: 10px; }
.ebook-form input { font-weight: var(--font-weight-medium); color: inherit; border: solid 1px currentColor; background-color: transparent; }
.ebook-form input::placeholder { color: inherit; }
.ebook-form button { width: 100%; }
.ebook-form p { margin-bottom: 0; }
.ebook-form p a { color: inherit; }
.ebook-form p a:focus,
.ebook-form p a:hover { text-decoration: none; }
.ebook-magazine { margin: 0 auto 30px; width: 100%; max-width: 150px; }
.ebook-magazine img { width: 100%; }

/* ### trips ### */

.trips-column { margin-bottom: 40px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 15px; row-gap: 15px; }
.trips-bottom { display: flex; flex-wrap: wrap; justify-content: center; }
.trips .travel-block { margin-bottom: 0; }

/* ### offer ### */
.offer { padding-top: 40px; padding-bottom: 40px; position: relative; color: var(--offer-tekst, var(--color-white)); background-color: var(--offer-bg, var(--color-primary)); }
.offer h2 { color: inherit; }
.offer-block { color: inherit; }
.offer-block p { margin-bottom: 34px; }
.offer-block p strong { font-weight: var(--font-weight-medium); }
.offer-column { display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 30px; row-gap: 20px; }
.offer-logo { position: absolute; top: 95px; left: -7px; display: none; opacity: 0.1; width: 508px; pointer-events: none; }
.offer-logo img { width: 100%; }

/* ### blogs ### */

.blogs .intro-text { margin-bottom: 23px; }
.blogs-holder { padding-bottom: 40px; border-bottom: 1px solid var(--color-light); }
.blogs-column { margin-bottom: 40px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 16px; row-gap: 20px; }
.blogs-bottom { display: flex; flex-wrap: wrap; justify-content: center; }

/* ### social ### */
.social { position: relative; }
.social h2 { margin-bottom: 28px; text-align: center; }
.social-column { display: grid; grid-template-columns: repeat(4, 1fr); }
.social-column img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.social-view-all { padding: 5px 4px 5px 12px; position: absolute; right: 11px; bottom: 11px; z-index: 1; display: flex; align-items: center; font-size: 12px; font-weight: var(--font-weight-medium); text-decoration: none; color: var(--color-dark); border-radius: 55px; background-color: var(--color-white); }
.social-view-all span { margin-left: 6px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; color: var(--color-blue-100); border-radius: 55px; background-color: var(--color-text); }
.social-view-all:focus,
.social-view-all:hover { color: var(--color-white); background-color: var(--color-primary); }

/* ### over ### */
.over { display: flex; flex-wrap: wrap; align-items: center; }
.over h2 { margin-bottom: 25px; }
.over-image { margin-bottom: 30px; display: flex; flex-wrap: wrap; align-self: flex-start; width: 100%; border-radius: 24px; overflow: hidden; }
.over-image img { width: 100%; }
.over-intro { flex: 1; line-height: 1.37; }
.over-intro p { margin-bottom: 22px; }
.over-intro em { font-style: normal; }
.over-intro ul { margin-bottom: 20px; }
.over-intro li a { color: var(--color-text); }
.over-intro li a:hover { text-decoration: none; color: var(--color-primary); }
.over.reverse { flex-direction: row-reverse; }

/* ### cta ### */

.cta h2 { margin-bottom: 29px; color: inherit; }
.cta-block { padding: 50px 20px; position: relative; display: flex; flex-wrap: wrap; justify-content: center; color: var(--cta-tekst, var(--color-white)); border-radius: 24px; background-color: var(--cta-bg, var(--color-primary)); overflow: hidden; }
.cta-intro { position: relative; z-index: 1; width: 100%; max-width: 690px; font-weight: var(--font-weight-medium); text-align: center; color: inherit; }
.cta-intro p { margin-bottom: 24px; }
.cta-button { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
.cta-button .button-white { color: var(--cta-bg, var(--color-primary)); border: 1px solid var(--cta-tekst, var(--color-white)); background-color: var(--cta-tekst, var(--color-white)); }
.cta-button .button-outline-white { color: var(--cta-tekst, var(--color-white)); border: 1px solid var(--cta-tekst, var(--color-white)); background-color: transparent; }
.cta-button .button-white:focus,
.cta-button .button-white:hover { color: var(--cta-tekst, var(--color-white)); background-color: transparent; }
.cta-button .button-outline-white:focus,
.cta-button .button-outline-white:hover { color: var(--cta-bg, var(--color-primary)); background-color: var(--cta-tekst, var(--color-white)); }
.cta-bg-image { position: absolute; top: 0; left: 0; opacity: 0.2; width: 100%; height: 100%; }
.cta-bg-image img { width: 100%; height: 100%; object-fit: cover; }

/* ### popular ### */
.popular { margin-bottom: 40px; }
.popular-column { margin-bottom: 40px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 15px; row-gap: 20px; }
.popular-bottom { display: flex; justify-content: center; }
.popular-intro { margin-bottom: 32px; font-weight: var(--font-weight-medium); text-align: center; color: var(--color-dark); }
.popular-intro h2 { margin-bottom: 25px; }

/* ### seo ### */
.seo { display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 30px; row-gap: 20px; }
.seo h2 { margin-bottom: 38px; }
.seo p { margin-bottom: 22px; }
.seo p:last-of-type { margin-bottom: 0; }
.seo img { margin: 34px 0 40px; width: 100%; border-radius: 24px; overflow: hidden; }

/* ### abouts ### */
.about { display: flex; flex-wrap: wrap; justify-content: center; }
.about h2 { margin-bottom: 25px; }
.about-text { width: 100%; max-width: 600px; text-align: center; }
.about p { margin-bottom: 23px; }

/* ### contact ### */

.contact h2 { margin-bottom: 23px; }
.contact-intro { margin-bottom: 30px; width: 100%; }
.contact-column { display: flex; flex-wrap: wrap; align-items: center; }
.contact-image { margin-right: 17px; width: 100%; max-width: 120px; border-radius: 100%; overflow: hidden; }
.contact-image img { width: 100%; }
.contact-info { flex: 1; }
.contact-info li:not(:last-child) { margin-bottom: 5px; }
.contact-info li a { display: inline-flex; align-items: center; text-decoration: none; color: var(--color-black); }
.contact-info li a i { margin-right: 10px; font-size: 20px; transition: var(--duration); }
.contact-info li a span { color: var(--color-text); transition: var(--duration); }
.contact-info li a:focus span,
.contact-info li a:hover span { text-decoration: underline; color: var(--color-primary); }
.contact-info li a:hover i { color: var(--color-primary); }
.contact-right { width: 100%; }
.contact-row { margin-bottom: 16px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 16px; row-gap: 10px; }
.contact-check { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; font-size: 12px; color: var(--color-dark); }
.contact-check p a { color: var(--color-dark); }
.contact-check p a:focus,
.contact-check p a:hover { text-decoration: none; color: var(--color-primary); }
.contact-check p:last-of-type { margin-bottom: 0; }
.contact-check button { width: 100%; }

/* ### social-media ### */
.social-media-block { padding: 19px 30px; text-align: center; border: solid 1px  var(--color-light); border-radius: 24px; background-color: var(--color-white); }
.social-media ul { display: flex; flex-wrap: wrap; justify-content: center; }
.social-media li a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; text-decoration: none; color: var(--color-blue-100); border-radius: 55px; background-color: var(--color-text); }
.social-media li a i { font-size: 20px; }
.social-media li a img { width: 20px; height: 20px; object-fit: contain; }
.social-media li a:hover { color: var(--color-white); background-color: var(--color-primary); }
.social-media li:not(:last-child) { margin-right: 10px; }

/* ### banner ### */
.banner { padding-top: 120px; padding-bottom: 90px; position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; }
.banner h1 { margin-bottom: 22px; font-size: 40px; color: var(--color-white); }
.banner-block { position: relative; z-index: 1; width: 100%; }
.banner-intro { display: flex; flex-direction: column; width: 100%; max-width: 850px; min-height: 180px; font-size: 18px; font-weight: var(--font-weight-medium); color: var(--color-white); }
.banner-intro p { margin-bottom: 28px; }
.banner-tag { margin-bottom: 30px; display: flex; flex-wrap: wrap; gap: 15px; align-items: center; }
.banner-tag span { padding: 3px 16px; font-size: 14px; font-weight: var(--font-weight-medium); color: var(--color-grey); border-radius: 55px; background-color: var(--color-light); }
.banner-tag span:nth-child(2) { color: var(--color-green-200); background-color: var(--color-green-100); }
.banner-tag span:nth-child(3) { color: var(--color-pink); background-color: var(--color-pink-100); }
/* Tags op naam i.p.v. positie: "Populair" blijft roze ook zonder gegarandeerd vertrek */
.banner-tag span.is-regio { color: var(--color-grey); background-color: var(--color-light); }
.banner-tag span.is-gegarandeerd { color: var(--color-green-200); background-color: var(--color-green-100); }
.banner-tag span.is-populair { color: var(--color-pink); background-color: var(--color-pink-100); }
.banner-bg-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.banner-bg-image:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(26, 32, 44, 0.2); content: ''; }
.banner-bg-image img { width: 100%; height: 100%; object-fit: cover; }
.banner:after { position: absolute; bottom: 0; left: 0; width: 100%; height: 60px; background: url('../images/pattern-clouds.png') repeat-x left bottom; background-size: 1920px 100%; content: ''; } /* zelfde als .hero: herhalen over de volle breedte, ook boven 1920px */
.banner .breadcrumb { margin-top: auto; }
.banner .breadcrumb ul { justify-content: flex-start; }

/* ### information ### */
.information { position: relative; z-index: 1; }
.information .nav-tabs { display: none; }
.information .tab_content { display: block; }
.support-tag-icon img { width: 26px; height: 26px; object-fit: contain; }
.support-tekst { margin-bottom: 33px; }
.support-tekst > :last-child { margin-bottom: 0; }
.support .accordion { margin-bottom: 30px; }
.support .price-tour { margin-bottom: 40px; } /* + 10px van het laatste item = 40px, gelijk aan de andere onderdelen */
.support > :last-child { margin-bottom: 0; }
.information .nav-tabs ul { display: flex; flex-wrap: wrap; }
.information .nav-tabs li { padding: 15px 30px; font-size: 14px; font-weight: var(--font-weight-medium); text-decoration: none; color: var(--color-white); border-radius: var(--default-radius); background-color: var(--color-primary); cursor: pointer }
.information .nav-tabs li.is-active,
.information .nav-tabs li:focus,
.information .nav-tabs li:hover { background-color: var(--color-secondary); }
.information-left { flex: 1; }
.information-right { width: 100%; }
.information-sticky { position: sticky; top: 96px; left: 0; }

/* ### support ### */
.support { margin-bottom: 50px; }
.support h3 { margin-bottom: 28px; }
.support p { margin-bottom: 33px; }
.support-top { margin-bottom: 42px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 20px; row-gap: 20px; }
.support-tag { font-size: 14px; text-align: center; }
.support-tag strong { margin-bottom: 9px; display: block; font-size: var(--font-size-base); color: var(--color-dark); }
.support-tag p { margin-bottom: 0; }
.support-tag-icon { margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; font-size: 26px; color: var(--color-secondary); border-radius: var(--default-radius); background-color: rgba(81, 122, 240, 0.08); }
.support-items { margin-bottom: 20px; }
.support-space { height: 30px; }
.support-column { margin-bottom: 39px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 15px; row-gap: 20px; }
.support-view-all { margin-bottom: 39px; padding-top: 21px; display: flex; justify-content: center; }

/* ### location ### */
.location { margin-bottom: 40px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 16px; row-gap: 16px; }
.location-image { position: relative; width: 100%; border-radius: 24px; overflow: hidden; }
.location-image img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; } /* elke kaart even hoog, wat de foto ook is */
.location-icon { margin-top: -30px; position: absolute; top: 50%; left: 50%; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; font-size: 20px; text-decoration: none; color: var(--color-white); border-radius: var(--default-radius); background-color: rgba(81, 122, 240, 0.4); transform: translate(-50%, -50%); }
.location-text { padding: 19px 10px; position: absolute; bottom: 0; left: 0; width: 100%; font-weight: var(--font-weight-medium); text-align: center; color: var(--color-text); background-color: var(--color-light); }

/* ### image-panel ### */
.image-panel { margin-bottom: 40px; display: flex; flex-wrap: wrap; align-items: center; }
.image-panel-photo { margin-bottom: 30px; display: flex; align-self: flex-start; width: 100%; border-radius: 24px; overflow: hidden; }
.image-panel-photo img { width: 100%; }
.image-panel-intro { flex: 1; }
.image-panel-intro p { margin-bottom: 24px; }
.image-panel-intro p:last-of-type { margin-bottom: 0; }
.image-panel.reverse { flex-direction: row-reverse; }
/* Tekst om de afbeelding heen (tab-blokken): floaten i.p.v. twee kolommen */
.image-panel.is-omloop { display: block; }
.image-panel.is-omloop:after { display: table; clear: both; content: ''; }

/* ### accordion ### */
.accordion-item { margin-bottom: 10px; border-radius: var(--default-radius); background-color: var(--color-primary); overflow: hidden; }
.accordion-title { padding: 23px 45px 18px 30px; position: relative; width: 100%; font-family: var(--font-family-base), sans-serif;
font-size: var(--font-size-base); font-weight: var(--font-weight-medium); text-align: left; color: var(--color-white);
border: 0; background-color: var(--color-primary); 	cursor: pointer; }
.accordion-title .icon-globe { position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; font-size: 25px; background-color: rgba(81, 122, 240, 0.08); }
.accordion-content { height: 0; overflow: hidden; transition: height 0.4s ease; }
.accordion-intro { padding: 0 30px; color: var(--color-white); }
.accordion-intro p { margin-bottom: 20px; }
.accordion-intro img { margin-bottom: 20px; width: 100%; border-radius: var(--default-radius); }
.accordion-title:after { position: absolute; top: 26px; right: 22px; font-family: var(--font-family-icon), sans-serif; font-size: 7px; transition: var(--duration); content: '\e901'; }
.accordion-title span { position: absolute; top: 14px; left: 12px; display: flex; align-items: center; justify-content: center; width: 35px; height: 35px; font-family: var(--font-family-icon), sans-serif; color: var(--color-primary); border-radius: 55px; background-color: var(--color-primary); transition: var(--duration); content: '\e904'; }
.accordion-title span i { font-size: 11px; color: var(--color-primary); }
.accordion-title.active:after { transform: rotate(-180deg); }
.accordion-outline .accordion-item { border: solid 1px var(--color-dark); background-color: transparent; }
.accordion-outline .accordion-title { padding: 17px 45px 16px 19px; font-family: var(--font-family-heading), sans-serif; font-size: var(--font-size-base); font-weight: var(--font-weight-medium); color: var(--color-dark); background-color: transparent; }
.accordion-outline .accordion-intro { padding: 0 20px; }
.accordion-second .accordion-title { padding-left: 80px; }
.accordion-second .accordion-intro { padding: 0 78px; }

/* ### program ### */
.program { margin-bottom: 50px; }
.program h3 { margin-bottom: 28px; }
.program-intro { margin-bottom: 35px; }
.program .image-panel { margin-bottom: 20px; }
.program-bottom { margin-bottom: 42px; }
.program-link { color: var(--color-dark); }
.program-link:focus,
.program-link:hover { text-decoration: none; color: var(--color-primary); }
.program .accordion-item { margin-bottom: 20px; }
.program .accordion-intro { color: var(--color-dark); }

/* ### practical ### */
.practical { margin-bottom: 50px; }
.practical h3 { margin-bottom: 28px; }
.practical h5 { margin-bottom: 20px; }
.practical-intro { margin-bottom: 33px; }
.practical .accordion { margin-bottom: 39px; }

/* ### visit ### */

.visit h3 { margin-bottom: 25px; font-size: 32px; }
.visit-block { padding: 35px 20px; border: solid 1px var(--color-light); border-radius: 24px; background-color: var(--color-white); }
.visit-block p { margin-bottom: 23px; }
.formulier-form { margin-top: 30px; }
.visit-block p:last-of-type { margin-bottom: 0; }

/* ### member ### */

.member h5 { font-size: 22px; }
.member-block { margin-bottom: 10px; }
.member-image { margin-right: 18px; margin-bottom: 20px; display: flex; align-self: flex-start; width: 150px; border-radius: 100%; overflow: hidden; }
.member-image img { width: 100%; }
.member-intro { flex: 1; }

/* ### price ### */
.price { margin-bottom: 40px; }
.price h3 { margin-bottom: 28px; }
.price-intro { margin-bottom: 23px; }
.price-tag { margin-bottom: 28px; }
.price-tag span { display: block; }
.price-tag span strong { font-weight: var(--font-weight-bold); }
.price-include { margin-bottom: 31px; display: flex; flex-wrap: wrap; }
.price-list { margin-bottom: 30px; width: 100%; }
.price-exclusive li,
.price-list li { margin-bottom: 9px; padding-left: 15px; position: relative; }
.price-exclusive li:after,
.price-list li:after { position: absolute; top: 5px; left: 0; font-family: var(--font-family-icon), sans-serif; font-size: 9px; color: var(--color-green); content: '\e904'; }
.price-exclusive { width: 100%; }
.price-exclusive li:after { color: var(--color-dark); content: '\e90f'; }
.price-tour h5 { margin-bottom: 19px; }
.price-table { overflow-x: auto; }
.price-table-scroll { width: 780px; }
.price-thead { margin-bottom: 4px; display: grid; grid-template-columns: 47.5% 1fr; }
.price-thead-td { padding: 0 20px; font-weight: var(--font-weight-bold); color: var(--color-dark); }
.price-tbody-row { padding: 6px 22px 6px 18px; display: grid; grid-template-columns: 25% 25% 20% 25%; align-items: center; color: var(--color-grey-300); background-color: var(--color-bright); }
.price-tbody-row:nth-child(odd) { background-color: transparent; }
.price-tbody-td span { padding: 3px 8px; display: inline-block; font-size: 14px; font-weight: var(--font-weight-medium); color: var(--color-green-200); border-radius: 55px; background-color: var(--color-green-100); }
.price-tbody-td .button { width: 100%; min-height: 36px; }

/* ### content ### */
.content h2 { margin-bottom: 25px; }
.content p { margin-bottom: 15px; }
.content-block { padding: 40px 30px; border: solid 1px var(--color-light); border-radius: 24px; background-color: var(--color-white); }
.content-column { margin-bottom: 40px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 16px; row-gap: 16px; }
.content-column img { width: 100%; border-radius: 24px; }
.content-button { margin-bottom: 41px; display: flex; flex-wrap: wrap; gap: 16px; }
.content-button .button { width: 100%; }
.content-block > :last-child { margin-bottom: 0; }
.content-fotos { margin-bottom: 40px; display: grid; row-gap: 16px; }
.content-fotos .content-column { margin-bottom: 0; }
.content-fotos img { height: 220px; object-fit: cover; }
.content-block .social-media { margin-bottom: 24px; padding-top: 0; padding-bottom: 0; }
.content-block blockquote { margin-bottom: 24px; }

/* ### card-trip ### */
.card-trip { padding: 20px; display: flex; flex-direction: column; flex-wrap: wrap; text-decoration: none; color: var(--color-text); border-radius: 24px; background-color: rgba(81, 122, 240, 0.04); }
.card-trip-top { margin-bottom: 30px; display: flex; flex-wrap: wrap; gap: 11px; align-items: center; }
.card-trip-icon { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; font-size: 25px; color: var(--color-secondary); border-radius: 12px; background-color: rgba(81, 122, 240, 0.08); }
.card-trip-top span { font-weight: var(--font-weight-medium); color: var(--color-dark); }
.card-trip-image { margin-bottom: 20px; border-radius: var(--default-radius); overflow: hidden; }
.card-trip-image img { width: 100%; aspect-ratio: 540 / 290; object-fit: cover; transition: var(--duration); }
.card-trip-icon img { width: 25px; height: 25px; object-fit: contain; }
.card-trip p { margin-bottom: 23px; }
.card-trip-bottom { margin-top: auto; }
.card-trip-link { display: inline-flex; align-items: center; color: var(--color-secondary); transition: var(--duration); }
.card-trip-link i { margin-left: 5px; font-size: 8px; }
.card-trip-link span { text-decoration: underline; }
.card-trip:focus .card-trip-link span,
.card-trip:hover .card-trip-link span { text-decoration: none; }
.card-trip:hover .card-trip-image img { transform: scale(1.03); }

/* ### card-review ### */
.card-review { padding: 20px; display: flex; flex-direction: column; height: 100%; line-height: 1.6; color: var(--color-dark); border: solid 1px var(--color-light); border-radius: 24px; background-color: var(--color-white); }
.card-review-top { margin-bottom: 13px; display: flex; flex-wrap: wrap; align-items: center; }
.card-review-user { margin-right: 17px; position: relative; width: 50px; }
.card-review-user img { width: 100%; border: solid 1px var(--color-light); border-radius: 100%; }
.card-review-google { position: absolute; right: -6px; bottom: -6px; width: 32px; border-radius: 50%; background-color: var(--color-white); }
.card-review-google img { border: none; }
.card-review-name { padding-top: 8px; flex: 1; line-height: 1.4; color: var(--color-dark); }
.card-review-name strong { display: block; }
.card-review-name span { display: block; font-size: 12px; font-weight: var(--font-weight-light); color: var(--color-grey-100); }
.card-review ul { margin-bottom: 14px; display: flex; flex-wrap: wrap; }
.card-review li { margin-right: 2px; font-size: 15px; color: var(--color-yellow); }
.card-review p { margin-bottom: 33px; font-weight: var(--font-weight-light); }
.card-review-bottom { margin-top: auto; }
.card-review-link { font-weight: var(--font-weight-light); color: var(--color-dark); }
.card-review-link:focus,
.card-review-link:hover { text-decoration: none; }

/* ### card-blog ### */
.card-blog { display: flex; flex-direction: column; flex-wrap: wrap; text-decoration: none; color: var(--color-text); border: 1px solid var(--color-light); border-radius: 24px; background-color: var(--color-white); overflow: hidden; }
.card-blog-image { position: relative; width: 100%; overflow: hidden; }
.card-blog-image img { width: 100%; height: 100%; object-fit: cover; transition: var(--duration); }
.card-blog-image:after { position: absolute; bottom: -3px; left: 0; width: 100%; height: 30px; background: url('../images/grunge-divider.svg') no-repeat; background-size: 100% 100%; content: ''; }
.card-blog-tag { padding: 10px; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; }
.card-blog-tag span { padding: 3px 16px 1px 18px; font-size: 14px; font-weight: var(--font-weight-medium); color: var(--color-grey); border-radius: 55px; background-color: var(--color-light); }
.card-blog-tag span:nth-child(2) { color: var(--color-pink); background-color: var(--color-pink-100); }
.card-blog-info { padding: 0 20px; font-size: 14px; line-height: 1.5; }
.card-blog-title { margin-bottom: 22px; font-family: var(--font-family-heading), sans-serif; font-size: 20px; font-weight: var(--font-weight-medium); color: var(--color-dark); }
.card-blog-info p { margin-bottom: 25px; }
.card-blog-bottom { margin-top: auto; padding: 0 20px 20px; }
.card-blog-link { display: inline-flex; align-items: center; font-size: 14px; color: var(--color-secondary); transition: var(--duration); }
.card-blog-link i { margin-left: 5px; font-size: 8px; }
.card-blog-link span { text-decoration: underline; }
.card-blog:focus .card-blog-link span,
.card-blog:hover .card-blog-link span { text-decoration: none; }
.card-blog:hover .card-blog-image img { transform: scale(1.03); }

/* ### card-quote ### */
.card-quote { margin-bottom: 40px; padding: 32px 30px 30px; color: var(--color-white); border-radius: var(--default-radius); background-color: var(--color-primary); }
.card-quote h3 { margin-right: 39px; margin-bottom: 10px; color: var(--color-white); }
.card-quote-text { flex: 1; }
.card-quote-text p { margin-bottom: 0; }

/* ### card-proposal ### */
.card-proposal { padding: 20px 16px; border: solid 1px var(--color-light); border-radius: var(--default-radius); background-color: var(--color-white); }
.card-proposal h5 { margin-bottom: 12px; }
.card-proposal .card-travel-panel { margin-bottom: 22px; }
.card-proposal .card-travel-button .button { width: 100%; }
/* Tooltip zwaarte in de infokaart onder het icoon: erboven valt hij achter de sticky header */
.card-proposal .card-travel-mount em[data-uitleg]:hover:after { top: calc(100% + 8px); bottom: auto; z-index: 20; }

/* ### card-advice ### */
.card-advice { padding: 20px; border: solid 2px var(--color-light); border-radius: var(--default-radius); background-color: var(--color-white); }
.card-advice h3 { margin-bottom: 28px; }
.card-advice-top { margin-bottom: 20px; display: flex; flex-wrap: wrap; align-items: center; }
.card-advice-image { margin-bottom: 10px; display: flex; align-self: flex-start; width: 100%; border-radius: var(--default-radius); overflow: hidden; }
.card-advice-image img { width: 100%; }
.card-advice-text { flex: 1; }
.card-advice-text p { margin-bottom: 0; }
.card-advice-items { width: 100%; }
.card-advice .button { margin-bottom: 10px; width: 100%; text-align: center; }

/* ### card-base ### */
.card-base { display: flex; flex-wrap: wrap; text-decoration: none; color: var(--color-text); border: 1px solid var(--color-light); border-radius: 24px; overflow: hidden; background-color: var(--color-white); }
.card-base-image { position: relative; width: 100%; }
.card-base-image img { width: 100%; height: 100%; object-fit: cover; }
.card-base-tag { padding: 10px; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; }
.card-base-tag span { padding: 3px 16px 1px 18px; font-size: 14px; font-weight: var(--font-weight-medium); color: var(--color-grey); border-radius: 55px; background-color: var(--color-light); }
.card-base-tag span:nth-child(2) { color: var(--color-pink); background-color: var(--color-pink-100); }
.card-base-info { padding: 16px 20px 29px; flex: 1; }
.card-base-title { margin-bottom: 9px; font-family: var(--font-family-heading), sans-serif; font-size: 20px; font-weight: var(--font-weight-medium); color: var(--color-dark); }
.card-base-mount { margin-bottom: 16px; display: flex; flex-wrap: wrap; align-items: center; }
.card-base-mount em { margin-left: 10px; display: flex; align-items: center; justify-content: center; width: 11px; height: 11px; font-size: 8px; font-weight: var(--font-weight-bold); font-style: normal; color: var(--color-white); border-radius: 55px; background-color: var(--color-dark); }
.card-base-info p { margin-bottom: 17px; font-size: 14px; line-height: 1.2; }
.card-base-info ul { margin-bottom: 25px; }
.card-base-info li { padding-left: 15px; position: relative; color: var(--color-text); }
.card-base-info li:before { position: absolute; top: 6px; left: -1px; font-family: var(--font-family-icon), sans-serif; font-size: 9px; color: var(--color-green); content: '\e904'; }
.card-base-info li:not(:last-child) { margin-bottom: 9px; }
.card-base-info h6 { margin-bottom: 2px; font-weight: var(--font-weight-bold); text-align: center; }
.card-base-middle { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; }
.card-base-panel { margin-bottom: 19px; padding: 7px 10px; display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; border-top: 1px solid var(--color-light); border-bottom: 1px solid var(--color-light); }
.card-base-departure { width: 100%; }
.card-base-date { display: flex; font-size: 14px; color: var(--color-grey); }
.card-base-date i { margin-right: 5px; font-size: 15px; color: var(--color-secondary); }
.card-base-data { margin-bottom: 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: center; }
.card-base-data span { padding: 6px 6px 3px; font-family: var(--font-family-avenir), sans-serif; font-size: 12px; font-weight: var(--font-weight-heavy); line-height: var(--heading-lineheight); color: var(--color-bronze); border-radius: 6px; background-color: rgba(242, 183, 4, 0.2); }
.card-base-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.card-base-price { margin-bottom: 10px; font-size: 14px; text-align: center; }
.card-base-price strong { font-size: 20px; font-weight: var(--font-weight-bold); color: var(--color-grey-300); }
.card-base-bottom button { width: 100%; }
.card-base:focus .card-base-info .button,
.card-base:hover .card-base-info .button { background-color: var(--color-button-hover); }

/* ### card-filter ### */
.card-filter { margin-bottom: 29px; display: flex; flex-wrap: wrap; column-gap: 16px; row-gap: 10px; }
.card-filter select { padding: 8px; width: 100%; font-size: 14px; font-weight: var(--font-weight-regular); color: var(--color-text); border: solid 1px var(--color-light); background-position: center right 9px; }
.card-filter .button { width: 100%; }

/* ### card-offer ### */
.card-offer { text-align: center; }
.card-offer strong { margin-bottom: 14px; display: block; font-weight: var(--font-weight-medium); }
.card-offer-icon { margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; font-size: 26px; color: inherit; border-radius: var(--default-radius); background-color: rgba(255, 255, 255, 0.15); }
.card-offer-icon img { width: 26px; height: 26px; object-fit: contain; }
.card-offer p { margin-bottom: 0; }

/* ### scroll-links ### */
.scroll-links { position: sticky; top: 70px; z-index: 5; width: 100%; margin-bottom: 37px; }
.scroll-links .container { transition: var(--duration); }
.scroll-links .custom-select { padding: 10px 15px; height: 55px; font-size: 17px; font-weight: var(--font-weight-bold); color: var(--color-text);
border: 0; border-radius: var(--default-radius); background: var(--color-light) url('../images/select-arrow.png') no-repeat center right 15px;
transition: var(--duration); -webkit-appearance: none; cursor: pointer; }

/* ### swiper ### */
.swiper-button-prev:after,
.swiper-button-next:after { display: none; }
.swiper-button-prev,
.swiper-button-next { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; font-size: 16px; color: var(--color-white); border-radius: 75px; background-color: var(--color-text); transition: var(--duration); }
.swiper-button-prev:hover,
.swiper-button-next:hover { color: var(--color-white); background-color: var(--color-primary); }

/* ### footer ### */
.footer { padding-top: 118px; padding-bottom: 27px; position: relative; font-size: var(--font-size-base); color: var(--color-blue-100); background-color: var(--color-grey-300); }
.footer:after { position: absolute; top: 0; left: 0; width: 100%; height: 60px; background: url('../images/footer-seperator.png') repeat-x left top; background-size: 1920px 60px; content: ''; }
.footer-holder { margin-bottom: 20px; display: grid; grid-template-columns: repeat(1, 1fr); column-gap: 20px; row-gap: 20px; }
.footer-info { margin-bottom: 15px; line-height: 1.65; }
.footer-info p { margin-bottom: 24px; }
.footer-logo { margin-bottom: 14px; width: 59px; }
.footer-logo img { width: 100%; }
.footer-list { margin-bottom: 30px; }
.footer-list li { margin-bottom: 0; }
.footer-list li a { text-decoration: none; color: var(--color-blue-100); }
.footer-list li a:focus,
.footer-list li a:hover { text-decoration: underline; color: var(--color-primary); }
.footer-social ul { display: flex; flex-wrap: wrap; }
.footer-social li a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; text-decoration: none; color: var(--color-blue-100); border-radius: 55px; background-color: var(--color-text); }
.footer-social li a i { font-size: 20px; }
.footer-social li a:hover { color: var(--color-white); background-color: var(--color-primary); }
.footer-social li:not(:last-child) { margin-right: 10px; }
.footer-title { padding-bottom: 12px; position: relative; font-size: var(--font-size-base); font-weight: var(--font-weight-bold); text-transform: uppercase; color: var(--color-blue-100); border-bottom: solid 1px var(--color-text); }
.footer-title:after { position: absolute; top: 3px; right: 7px; font-family: var(--font-family-icon), sans-serif; font-size: 14px; color: var(--color-blue-100); transition: var(--duration); content: '\e901'; }
.footer-title.active:after { transform: rotate(-180deg); }
.footer-menu strong { margin-bottom: 5px; display: block; }
.footer-menu ul { margin-bottom: 28px; }
.footer-menu li { margin-bottom: 5px; }
.footer-menu li a { text-decoration: none; color: var(--color-blue-100); }
.footer-menu li a:focus,
.footer-menu li a:hover { text-decoration: underline; color: var(--color-primary); }
.footer-link { font-weight: var(--font-weight-bold); color: var(--color-blue-100); }
.footer-link:focus,
.footer-link:hover { text-decoration: none; color: var(--color-primary); }
.footer-copyright { font-size: 14px; }
.footer-copyright ul { display: flex; flex-wrap: wrap; justify-content: center; }
.footer-copyright li { position: relative; }
.footer-copyright li a { text-decoration: none; color: var(--color-blue-100); }
.footer-copyright li a:focus,
.footer-copyright li a:hover { text-decoration: underline; color: var(--color-primary); }
.footer-copyright li:not(:last-child):after { margin: 0 10px; display: inline-block; vertical-align: middle; content: '/'; }
.footer .hidden-menu { padding-top: 10px; max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }

/* #Media Queries
================================================== */

@media only screen and (min-width: 576px) {
	.seo,
	.usp-block,
	.offer-column,
	.blogs-column,
	.popular-column,
	.reviews-wrap,
	.location,
	.support-column,
	.trips-column { grid-template-columns: repeat(2, 1fr); }
	.contact-check button { max-width: 205px; }
	.support-top { grid-template-columns: repeat(3, 1fr); }
	.price-list { width: 53%; }
	.price-exclusive { width: 40%; }
	.price-thead { grid-template-columns: 61% 1fr; }
	.price-tbody-row { grid-template-columns: 41% 23.2% 16% 20%; }
	.member-block { display: flex; flex-wrap: wrap; }
	.member-image { margin-bottom: 0; width: 24%; }
	.content-column { grid-template-columns: repeat(6, 1fr); }
	.content-column img { width: 100%; border-radius: 24px; }
	.content-column img:nth-child(1),
	.content-column img:nth-child(2) { grid-column: span 3; }
	.content-column img:nth-child(3),
	.content-column img:nth-child(4),
	.content-column img:nth-child(5) { grid-column: span 2; }
	.content-button .button { max-width: 232px; }
	.content-column.is-2 { grid-template-columns: repeat(2, 1fr); }
	.content-column.is-3 { grid-template-columns: repeat(3, 1fr); }
	.content-column.is-2 img:nth-child(n),
	.content-column.is-3 img:nth-child(n) { grid-column: auto; }
	.content-fotos img { height: 300px; }
	.card-base-departure { margin-top: -8px; width: 37%; }
	.card-base-price { margin-bottom: 0; }
	.card-base-bottom { justify-content: space-between; }
	.card-base-bottom button { max-width: 200px; }
	.card-advice { padding: 20px 28px 18px; }
	.card-advice-top { margin-bottom: 30px; }
	.card-advice-image { margin-right: 9px; margin-bottom: 0; width: 43.5%; }
	.card-filter select { flex: 1; }
	.card-filter .button { max-width: fit-content; }
	.card-quote { display: flex; flex-wrap: wrap; align-items: center; }
	.card-quote h3 { margin-bottom: 0; }
	.card-quote-text { padding-left: 30px; border-left: solid 1px var(--color-white); }

}

@media only screen and (min-width: 768px) {
	.travel-grid { grid-template-columns: repeat(2, 1fr); }
	.blogs-filter { flex-wrap: nowrap; }
	.blogs-filter select { flex: 1 1 auto; }
	.blogs-filter .button { flex: 0 0 220px; }
	:root {
		--font-size-h1: 45px;
	}
	blockquote { padding: 25px 30px; }
	.header.sticky { padding-top: 10px; padding-bottom: 10px; }
	.header.sticky .header-menu li a { color: var(--color-dark); }
	.header.sticky .header-menu > ul > li > .menu-kopje { color: var(--color-dark); }
	.hero.is-alt .hero-intro,
	.hero.inner .hero-intro { margin-bottom: 82px; max-width: 650px; }
	.hero.inner .hero-form { max-width: 850px; }
	.hero.is-alt .hero-intro { margin-bottom: 103px; }
	.usp-block { padding-bottom: 50px; grid-template-columns: repeat(4, 1fr); }
	.travel-table table { width: 100%; }
	.travel-table-row { padding: 7px 10px; }
	.travel-table-head { padding: 0 10px 2px; }
	.travel-table-item { font-size: 16px; }
	.travel-table-item.is-tablet { display: flex; }
	.travel-table tr td strong,
	.travel-table-item strong { font-size: 14px; }
	.card-travel-image { height: 250px; }
	.card-travel-info { padding: 2px 28px 29px; }
	.card-proposal { padding: 22px 30px 19px 30px; }
	.ebook-form-input { grid-template-columns: repeat(3, 1fr); }
	.ebook-magazine { margin: 0 0 30px; max-width: 180px; }
	.trips-column { grid-template-columns: repeat(2, 1fr); }
	.card-trip { padding: 30px 30px 27px; }
	.card-review { padding: 29px 29px 20px; }
	.over-image { margin-right: 30px; margin-bottom: 0; width: 49.4%; }
	.over.reverse .over-image { margin-right: 0; margin-left: 30px; }
	.cta-block { padding: 71px 20px 80px; }
	.banner-intro { min-height: 295px; }
	.contact { display: flex; flex-wrap: wrap; gap: 30px; justify-content: space-between; }
	.contact-intro { margin-bottom: 0; width: 45%; }
	.contact-right { padding-top: 7px; width: 49.3%; }
	.social-media-block { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
	.social-media h5 { margin-bottom: 0; }
	.social-media ul { justify-content: unset; }
	.information .nav-tabs { display: block; }
	.information-column { display: flex; flex-wrap: wrap; }
	.information .nav-tabs li:not(:last-child) { margin-right: 10px; }
	.scroll-links { top: 80px; }
	.scroll-links .custom-select { display: none; }
	.support-top { row-gap: 37px; grid-template-columns: repeat(4, 1fr); }
	.accordion-outline .accordion-title { font-size: 20px; }
	.price-table-scroll { width: 100%; }
	.image-panel-photo { margin-right: 30px; margin-bottom: 0; width: 37%; }
	.image-panel.reverse .image-panel-photo { margin-right: 0; margin-left: 30px; }
	.image-panel.large .image-panel-photo { margin-right: 42px; width: 49.3%; }
	.image-panel.large.reverse .image-panel-photo { margin-right: 0; margin-left: 42px; }
	.image-panel.is-omloop .image-panel-photo { margin: 6px 30px 16px 0; float: left; }
	.image-panel.is-omloop.reverse .image-panel-photo { margin: 6px 0 16px 30px; float: right; }
	.card-base-image { width: 36.8%; }
	.card-base-info { padding: 16px 24px 29px 31px; flex: 1; }
	.card-base-middle { flex-wrap: unset; }
}

@media only screen and (min-width: 1025px) {
	/* Desktop: alleen de actieve tab. De eerste tab heeft is-active al vanuit PHP,
	 * zodat dit ook zonder JS klopt (bv. in de editor); main.js wisselt de class. */
	.information .tab_content { display: none; }
	.information .tab_content.is-active { display: block; }
	.travel-grid { grid-template-columns: repeat(3, 1fr); }
	:root {
		--blok-ruimte: 40px;
		--font-size-h1: 72px;
		--font-size-h2: 32px;
		--font-size-h3: 24px;
		--font-size-h4: 20px;
	}
	.hero-form select { background: url('../images/select-arrow.png') no-repeat bottom 10px right 15px; }
	.header-logo { width: 90px; }
	.header.sticky .header-logo { width: 65px; }
	.header-menu { display: flex; }
	.header-menu li:not(:last-child) { margin-right: 30px; }
	.header-menu .button { margin-left: 30px; }
	.mobile-menu { display: none; }
	.hero { padding-top: 160px; padding-bottom: 192px; min-height: 840px; }
	.hero h1 { margin-bottom: 35px; }
	.hero-intro { max-width: 850px; }
	.hero-intro p { line-height: 1.75; }
	.hero-form { padding: 10px 10px 10px 30px; display: flex; justify-content: space-between; column-gap: 20px; border-radius: 24px; }
	.hero-group { padding-bottom: 0; }
	.hero-form .button { margin-top: 0; }
	.hero-group:not(:last-child) { border-right: solid 1px var(--color-light); border-bottom: none; }
	.hero:after { height: 102px; }
	.hero.inner { min-height: 640px; }
	.hero.is-alt { padding-bottom: 150px; min-height: 720px; }
	.banner { padding-bottom: 150px; min-height: 720px; }
	.banner:after { height: 102px; }

	.usp-block { padding-bottom: 76px; }

	.travel h2 { margin-bottom: 24px; }
	.travel-table-row { gap: 49px; padding: 7px 20px; }
	.travel-table-head { padding: 0 20px 2px; }
	.travel .swiper { overflow: hidden; }
	.travel-table tbody tr td { padding: 6px 7px; }
	.travel-table tr td .button { font-size: 12px; }
	.reviews { padding-top: 80px; padding-bottom: 80px; }
	.reviews h2 { margin-bottom: 25px; }
	.reviews .swiper { overflow: hidden; }

	.ebook h2 { margin-bottom: 25px; }
	.ebook-block { padding: 70px 50px; }
	.ebook-intro { max-width: 620px; }
	.ebook-magazine { margin: 0; position: absolute; right: 10px; bottom: 43px; max-width: 250px; }

	.trips h2 { margin-bottom: 26px; }
	.trips-column { grid-template-columns: repeat(3, 1fr); }
	.card-trip-image { margin-bottom: 31px; border-radius: 24px; }
	.card-trip-icon { width: 60px; height: 60px; font-size: 27px; }
	.offer { padding-top: 80px; padding-bottom: 136px; }
	.offer h2 { margin-bottom: 26px; }
	.offer-block { padding-left: 150px; }
	.offer-column { column-gap: 45px; row-gap: 45px; grid-template-columns: repeat(3, 1fr); }
	.offer-logo { display: block; }
	.card-filter select { flex: unset; width: 24%; }
	.card-filter .button { max-width: 180px; }

	.blogs h2 { margin-bottom: 25px; }
	.blogs-holder { padding-bottom: 80px; }
	.blogs-column { grid-template-columns: repeat(3, 1fr); }
	.card-blog-image { height: 252px; }
	.card-blog-info { padding: 0 29px; }
	.card-blog-bottom { padding: 0 29px 22px; }

	.over-image { margin-right: 65px; }
	.over.reverse .over-image { margin-right: 0; margin-left: 70px; }
	.popular { margin-bottom: 80px; }
	.popular-column { grid-template-columns: repeat(3, 1fr); }
	.seo { column-gap: 56px; row-gap: 40px; }
	.contact-image { max-width: 206px; }
	.contact-info li:not(:last-child) { margin-bottom: 10px; }
	.contact-row { row-gap: 16px; grid-template-columns: repeat(2, 1fr); }

	.social-media-block { padding: 19px 84px; }

	.information .nav-tabs li { padding: 15px 20px; }
	.information-right { margin-top: calc(-560px - var(--blok-ruimte)); margin-left: 30px; width: 32.5%; } /* blokruimte boven .information compenseren: kaart staat even hoog als in het ontwerp */
	.information.is-alt .information-right { margin-top: 0; }
	.information.is-alt .nav-tabs li { padding: 15px 25px; }
	.scroll-links { top: 85px; }
	.support,
	.program { margin-bottom: 80px; }
	.support.is-alt { margin-bottom: 0; }
	.price { margin-bottom: 80px; }

	.visit-block { padding: 69px 90px 76px; }
	.footer-holder { margin-bottom: 69px; grid-template-columns: repeat(4, 1fr); }
	.footer-title { margin-bottom: 18px; }
	.footer-title:after { display: none; }
	.footer .hidden-menu { padding-top: 0; max-height: inherit; overflow: inherit; transition: unset; }
	.footer-copyright-top { padding-top: 28px; border-top: solid 1px var(--color-text); }
}

@media only screen and (min-width: 1200px) {
	.header { padding-top: 20px; padding-bottom: 20px; }
	.header-logo { width: 111px; }
	.header-menu li:not(:last-child) { margin-right: 52px; }
	.header-menu .button { margin-left: 50px; }
	.hero:after { width: 100%; }
	.hero-form .button { margin-top: 0; max-width: 180px; }
	.travel-table-head-item { width: 22.2%; }
	.travel-table-head-item.is-hide { display: block; }
	.travel-table-head-item:nth-child(2) { width: 10.1%; }
	.travel-table-head-item:nth-child(3) { width: 8.3%; }
	.travel-table-head-item:nth-child(4) { width: 8.1%; }
	.travel-table-head-item:nth-child(5) { width: 10.4%; }
	.travel-table-head-item:nth-child(6) { width: 19.8%; }
	.travel-table-head-item:nth-child(7) { width: 10.4%; }
	.travel-table-item span.is-mobile {display: none; }
	.travel-table tr td .button { font-size: var(--font-size-base); }
	.travel-table-row { gap: 0; }
	.travel-table-item { width: 21.9%; display: flex; flex-wrap: wrap; align-items: center; }
	.travel-table-item:nth-child(2) { width: 9.8%; }
	.travel-table-item:nth-child(3) { width: 8.3%; }
	.travel-table-item:nth-child(4) { width: 8.2%; }
	.travel-table-item:nth-child(5) { width: 10%; }
	.travel-table-item:nth-child(6) { width: 6%; }
	.travel-table-item:nth-child(7) { margin-right: 16px; width: 11.6%; }
	.travel-table-item:nth-child(8) { width: 10.2%; }
	.travel-table-item:nth-child(9) { width: 12.2%; }
	.travel-table-item span { display: none; }
	.travel-table-item.is-hide { display: inline-flex; }
	.travel-table-item strong.is-phone { display: none; }
	.travel-table-item .button { padding: 7px 12px; width: 100%; min-height: 36px; font-size: var(--font-size-base); border-radius: 55px; }
	.travel-table-item .button em { display: block; }
	.travel-table-item .button i { display: none; }
	.reviews .swiper-button-prev,
	.reviews .swiper-button-next { left: -20px; }
	.reviews .swiper-button-next { right: -20px; left: unset; }
	.ebook-intro { max-width: 710px; }
	.ebook-block { padding: 70px 80px 75px; }
	.ebook-magazine { right: 103px; width: 22.4%; max-width: unset; }
	.offer-block { padding-left: 333px; }
	.offer-column { column-gap: 120px; }
	.content-block { padding: 69px 84px 40px; }
	.card-base-departure { width: 36%; }
	.card-travel-panel { justify-content: space-between; }
	.information .nav-tabs li { padding: 15px 30px; }
	.information .nav-tabs li:not(:last-child) { margin-right: 20px; }
	.information.is-alt .nav-tabs li { padding: 15px 40px; }
}

@media only screen and (min-width: 1400px) {
	.centered { padding-right: calc((100% - var(--width-base)) / 2); padding-left: calc((100% - var(--width-base)) / 2); }
	.header-menu .button { margin-left: 126px; }

}