19:I[58424,["/_next/static/immutable/chunks/2o5yxk9qcd3ab.js","/_next/static/immutable/chunks/14ijc8jfbscck.js","/_next/static/immutable/chunks/2qk9st3mjlwfm.js","/_next/static/immutable/chunks/3g7y3c-b_ienp.js","/_next/static/immutable/chunks/26w3e6hz6vja6.js","/_next/static/immutable/chunks/1pjbv61tk0utd.js","/_next/static/immutable/chunks/16xgae_qhmm8c.js","/_next/static/immutable/chunks/14ftv084j-ppy.js","/_next/static/immutable/chunks/0auirpb-xjfr_.js"],"default"] 1b:I[61690,["/_next/static/immutable/chunks/2o5yxk9qcd3ab.js","/_next/static/immutable/chunks/14ijc8jfbscck.js","/_next/static/immutable/chunks/2qk9st3mjlwfm.js","/_next/static/immutable/chunks/3g7y3c-b_ienp.js","/_next/static/immutable/chunks/26w3e6hz6vja6.js","/_next/static/immutable/chunks/1pjbv61tk0utd.js","/_next/static/immutable/chunks/16xgae_qhmm8c.js","/_next/static/immutable/chunks/14ftv084j-ppy.js","/_next/static/immutable/chunks/0auirpb-xjfr_.js"],"default"] 1a:T50c,

Waar krijg jij energie van? Van bewegen, goed slapen, lekker eten, tijd voor jezelf of juist van contact met anderen? Tijdens de Week van de Vitaliteit ontdek je wat jou helpt om je goed te voelen en met meer energie je dag door te gaan.

Van maandag 21 tot en met vrijdag 25 september vindt de Week van de Vitaliteit plaats. Die week is er volop inspiratie rondom thema's als mentale veerkracht, werkgeluk, slaap, voeding, financiën en een gezonde leefstijl. Kies wat bij jou past, probeer iets nieuws en geef jezelf een moment. Doe mee aan een inspirerende workshop, leer iets nieuws of neem juist even tijd om te ontspannen. Er zijn online activiteiten én activiteiten op onze locaties in Schiedam, Rotterdam, Amsterdam, Schijndel, Willemswerf en Zwolle. Zo kun je makkelijk iets kiezen dat bij jou en jouw werkdag past.

Bekijk het programma en ontdek welke activiteiten jou aanspreken.

Voor sommige activiteiten is het aantal plaatsen beperkt. Wacht dus niet te lang met inschrijven. Kun je onverwacht toch niet komen? Meld je dan af, zodat een andere collega jouw plek kan innemen. Heb je vragen? Stuur dan een mail naar vitaliteit@facilicom.nl.

Energie voor nu, kracht voor later!

1c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }1d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }1e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }1f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }20:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }21:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }22:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }23:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }24:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }25:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }26:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }27:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }28:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }29:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }2a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }2b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }2c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }2d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 08:30 – 17:15"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }2e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }2f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }30:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }31:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }32:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }33:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }34:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }35:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }36:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }37:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }38:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }39:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }3a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }3b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }3c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }3d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }3e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }3f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }40:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }41:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }42:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }43:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }44:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }45:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }46:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }47:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }48:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }49:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }4a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }4b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }4c:T3bb7,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; } /* ── PERSOONLIJKE GEZONDHEIDSCHECK: datum → weekbereik ── */ /* Alleen deze pagina: gescoped via de unieke hero-afbeelding van dit event. */ /* Vervalt automatisch (originele datum komt terug) als die afbeelding wordt vervangen. */ .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span { font-size: 0 !important; letter-spacing: 0 !important; /* anders blijft de verborgen tekst 25 × 1.3px breed */ } .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span::after { content: "Maandag 21 september t/m vrijdag 25 september"; font-size: 24px; letter-spacing: 1.3px; white-space: nowrap; } /* Eventnaam op eigen regel zodat de datum niet afbreekt */ .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy:has(.gap-sm.me-lg) { flex-wrap: wrap !important; } /* Mobiel: iets kleiner zodat de regel binnen het scherm past */ @media (max-width: 767px) { .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span::after { font-size: 18px; } }4d:T3bb7,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; } /* ── PERSOONLIJKE GEZONDHEIDSCHECK: datum → weekbereik ── */ /* Alleen deze pagina: gescoped via de unieke hero-afbeelding van dit event. */ /* Vervalt automatisch (originele datum komt terug) als die afbeelding wordt vervangen. */ .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span { font-size: 0 !important; letter-spacing: 0 !important; /* anders blijft de verborgen tekst 25 × 1.3px breed */ } .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span::after { content: "Maandag 21 september t/m vrijdag 25 september"; font-size: 24px; letter-spacing: 1.3px; white-space: nowrap; } /* Eventnaam op eigen regel zodat de datum niet afbreekt */ .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy:has(.gap-sm.me-lg) { flex-wrap: wrap !important; } /* Mobiel: iets kleiner zodat de regel binnen het scherm past */ @media (max-width: 767px) { .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span::after { font-size: 18px; } }4e:T3bb7,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; } /* ── PERSOONLIJKE GEZONDHEIDSCHECK: datum → weekbereik ── */ /* Alleen deze pagina: gescoped via de unieke hero-afbeelding van dit event. */ /* Vervalt automatisch (originele datum komt terug) als die afbeelding wordt vervangen. */ .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span { font-size: 0 !important; letter-spacing: 0 !important; /* anders blijft de verborgen tekst 25 × 1.3px breed */ } .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span::after { content: "Maandag 21 september t/m vrijdag 25 september"; font-size: 24px; letter-spacing: 1.3px; white-space: nowrap; } /* Eventnaam op eigen regel zodat de datum niet afbreekt */ .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy:has(.gap-sm.me-lg) { flex-wrap: wrap !important; } /* Mobiel: iets kleiner zodat de regel binnen het scherm past */ @media (max-width: 767px) { .hero--event:has([style*="01M11AAF8F319DBD1FQDEJ8GR5"]) .font-francy .gap-sm.me-lg span::after { font-size: 18px; } }4f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }50:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }51:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }52:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }53:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }54:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }55:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }56:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }57:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }58:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }59:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }5a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }5b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }5c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }5d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }5e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }5f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }60:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }61:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }62:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }63:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }64:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }65:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }66:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }67:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }68:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }69:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }6a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }6b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }6c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }6d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }6e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }6f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }70:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }71:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }72:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }73:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }74:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }75:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }76:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }77:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }78:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }79:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }7a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }7b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }7c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }7d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }7e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }7f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }80:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }81:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }82:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }83:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }84:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }85:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }86:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }87:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }88:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }89:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }8a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }8b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }8c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }8d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }8e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }8f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }90:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }91:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }92:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }93:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }94:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }95:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }96:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }97:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }98:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }99:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }9a:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }9b:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }9c:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }9d:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }9e:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }9f:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a0:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a1:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a2:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a3:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a4:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a5:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a6:T502,

Gezond ouder worden is niet voor iedereen vanzelfsprekend. Je lichaam verandert en je voelt je soms minder vitaal en energiek.

De wereld om je heen gaat gewoon door, maar jij hebt daar niet altijd meer zin in. Misschien wil je je juist richten op wat jij écht belangrijk vindt. Maar waar begin je? Hoe zorg je dat je sterk en gezond blijft, in je hoofd én in je lijf? Wat wil je eigenlijk nog allemaal in het leven?

Als je boven de 60 bent, heb je veel ervaring. Je weet beter wie je bent en wat bij je past. Door al die ervaring kun je mensen en situaties vaak goed aanvoelen. Toch vraag je je soms af: wat kan ik doen met alles wat ik weet en heb geleerd? Hoe geef ik richting aan de laatste jaren van mijn werkende leven?

In deze workshop gaan we samen aan de slag met dit soort vragen. We praten over:

Welke fases er zijn bij het ouder worden.
Hoe je keuzes maakt die goed voelen voor de toekomst.
Hoe je goed omgaat met stress en je energie.
Wat jouw passies zijn en hoe je die kunt gebruiken.

In de workshop ontmoet je mensen die in dezelfde fase zitten als jij. Je leert van elkaar én van de trainer. Je ontvangt praktische tips waar je meteen iets mee kunt, op je werk en in je dagelijks leven.

a7:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }a8:T502,

Gezond ouder worden is niet voor iedereen vanzelfsprekend. Je lichaam verandert en je voelt je soms minder vitaal en energiek.

In deze workshop gaan we samen aan de slag met dit soort vragen. We praten over:

Welke fases er zijn bij het ouder worden.
Hoe je keuzes maakt die goed voelen voor de toekomst.
Hoe je goed omgaat met stress en je energie.
Wat jouw passies zijn en hoe je die kunt gebruiken.

a9:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%; } .react-calendar__tile:hover:not(.has-events) { background-color: #e8f1f8 !important; color: #004077 !important; border-radius: 50%; } /* ── CARDS ───────────────────────────────────── */ a.event-item.event-item--portal { border: 1px solid #dde8f0 !important; border-left: none !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 2px 10px rgba(0, 40, 80, 0.07) !important; transition: box-shadow 0.25s ease, transform 0.22s ease !important; overflow: hidden !important; position: relative !important; } a.event-item.event-item--portal::before { content: '' !important; display: block !important; height: 5px !important; background: #004077 !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; } a.event-item.event-item--portal:hover { box-shadow: 0 10px 36px rgba(0, 64, 119, 0.15) !important; transform: translateY(-4px) !important; border-color: #b0cde3 !important; } @media (max-width: 1023px) { a.event-item.event-item--portal:hover { transform: none !important; } } /* ── CATEGORIE BADGES ────────────────────────── */ .event-item--portal .inline-block.border.border-tertiary-300 { color: #004077 !important; border-color: #b0cde3 !important; background-color: #e8f1f8 !important; border-radius: 20px !important; font-weight: 600 !important; font-size: 13px !important; } /* ── CARD TITEL ──────────────────────────────── */ .event-item--portal h3 { color: #003260 !important; font-weight: 400 !important; line-height: 1.25 !important; } /* ── DATUM ───────────────────────────────────── */ .event-item--portal .text-neutral-500 { color: #8a9ab0 !important; font-size: 14px !important; } /* ── KNOP: "Meld je aan" ─────────────────────── */ .button.button--primary.button--inline { background-color: #E52A1F !important; border-radius: 8px !important; font-size: 0 !important; color: transparent !important; padding: 10px 22px !important; box-shadow: 0 2px 8px rgba(229, 42, 31, 0.22) !important; transition: background-color 0.2s, transform 0.15s !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; } .button.button--primary.button--inline::before { content: 'Meld je aan'; font-size: 16px !important; color: #ffffff !important; font-weight: 700 !important; } .button.button--primary.button--inline svg { display: inline-block !important; width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .button.button--primary.button--inline:hover { background-color: #c0221a !important; transform: scale(1.03) !important; } /* ── FOOTER ──────────────────────────────────── */ footer.text-neutral-100.bg-primary-400 { background: #004077 !important; } footer a { color: #b8d0e8 !important; transition: color 0.2s; } footer a:hover { color: #ffffff !important; } /* ── TIJD OP CARDS (per event-id) ───────────── */ #event-9597e389-713f-4d02-8cc1-efd0b492d495 .text-neutral-500::after { content: " · 07:00 – 08:00"; color: #8a9ab0; font-size: 14px; } #event-917a1372-e29c-4d33-9dcd-e486117c665a .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-2108ce1f-bf8b-426d-8775-4c8cc1d698cb .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-af95c465-1d26-4650-8139-e0cbd9cf73b8 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-0e60e16e-b87f-48b0-892a-8fa8c6c3e12d .text-neutral-500::after { content: " · 10:00 – 11:00"; color: #8a9ab0; font-size: 14px; } #event-6b589f90-fac3-4fea-a257-c45e2bab406a .text-neutral-500::after { content: " · 12:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-0050ea3d-4c6c-4724-b67a-c3a3716ef390 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-c1f10674-8182-453a-94c7-0188c37c7e65 .text-neutral-500::after { content: " · 16:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-4922671b-5056-4eb9-8029-37e451b70af8 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-8df5e528-2be4-46f5-a54b-3108ed4bb452 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-787a05ad-0371-4b85-9283-7d15ffcd5ad8 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fae61639-0874-43cb-bbf2-3316e90c8575 .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-dc9aebba-ba6a-4049-aa31-ad9bcab1cf27 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-26af9634-ce81-4424-94ab-8f4acf3057f0 .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-a71cf5a1-5a6c-4300-9b38-7a8c12ebf81a .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a01fad24-fbc0-4043-9e31-3d52b98f50ac .text-neutral-500::after { content: " · 13:00 – 14:00"; color: #8a9ab0; font-size: 14px; } #event-db6e488a-ca42-42dd-9015-6b1632d9f880 .text-neutral-500::after { content: " · 13:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-d15bc2d9-9517-4a51-ba34-1abb80ab8752 .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-ea6394df-eeee-49b2-9ca2-adff75e67b75 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-1e1eeb70-ccc0-404d-890a-fb359e01b6c2 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-9158c00c-6ad7-4dad-b3ae-08c11349e1ea .text-neutral-500::after { content: " · 16:00 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-4dab9f2d-b360-4d76-819e-9c246d0c55f0 .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-f0d16bc7-12e3-4eaa-8a3e-e6d0299acc30 .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-033d4443-b380-4d90-b95d-58d6164db5fd .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-217c8f46-1731-4c2d-a428-d18a4cde049c .text-neutral-500::after { content: " · 09:00 – 17:00"; color: #8a9ab0; font-size: 14px; } #event-49a345ae-bc07-4f38-a1aa-f158863834da .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-fe0eefba-b006-4b50-a478-d170c512643a .text-neutral-500::after { content: " · 09:00 – 13:00"; color: #8a9ab0; font-size: 14px; } #event-486986c6-65a2-433b-9671-ca6807e8243d .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-5c80c948-94ec-4d06-8ecd-c8f03349806a .text-neutral-500::after { content: " · 09:30 – 16:30"; color: #8a9ab0; font-size: 14px; } #event-3487f4e2-6b37-48c1-abce-87ce4f6439d5 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } #event-3035a169-e44e-4619-9ec3-e2503ff1d603 .text-neutral-500::after { content: " · 15:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-44da8752-a972-41c1-934d-3a017f5ba1e9 .text-neutral-500::after { content: " · 17:00 – 18:00"; color: #8a9ab0; font-size: 14px; } #event-79722682-fd8c-4cda-896f-668581525f09 .text-neutral-500::after { content: " · 18:00 – 19:00"; color: #8a9ab0; font-size: 14px; } #event-4bf5f98c-33fd-4371-8e3f-524e85c82d65 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-e7b83391-55b3-40c5-be12-d4f8b8c1e746 .text-neutral-500::after { content: " · 19:00 – 20:00"; color: #8a9ab0; font-size: 14px; } #event-1ffbf5d9-9d8d-44b2-86c4-54e39aa34232 .text-neutral-500::after { content: " · 20:00 – 21:00"; color: #8a9ab0; font-size: 14px; } #event-4094731a-66ff-48c6-9fbb-9908d9ffe22f .text-neutral-500::after { content: " · 09:00 – 10:00"; color: #8a9ab0; font-size: 14px; } #event-86575fbb-4a14-4a43-9609-0c0481fcc4a3 .text-neutral-500::after { content: " · 11:00 – 12:00"; color: #8a9ab0; font-size: 14px; } #event-a3d26984-fd94-4986-836b-74cb396135ab .text-neutral-500::after { content: " · 14:00 – 15:00"; color: #8a9ab0; font-size: 14px; } #event-89278304-a24b-4b25-b20a-1794d2c78a88 .text-neutral-500::after { content: " · 15:00 – 16:00"; color: #8a9ab0; font-size: 14px; } /* ── GRATIS MULTI-MOMENT TICKETS: verberg "0 excl. servicekosten" ── */ /* Card-layout (meerdere tijdsloten): prijsregel zonder €-bedrag verbergen */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child:not(:has(.font-bold)) { display: none !important; } /* ── GRATIS SINGLE-TICKET: verberg "excl. servicekosten" ── */ .section-without-map p.text-neutral-400.mb-lg { display: none !important; } /* ── Single-ticket: verberg alleen prijs "0", behoud +/- knoppen ── */ .flex.justify-between.items-start > .text-right.ml-4 { display: block !important; font-size: 0 !important; color: transparent !important; line-height: 0 !important; } .flex.justify-between.items-start > .text-right.ml-4 > * { font-size: 1rem !important; color: inherit !important; line-height: normal !important; } .flex.justify-between.items-start > .text-right.ml-4 .plus-minus { display: flex !important; } /* ── Multi-ticket cards: verberg prijsregel met kale 0 ── */ .col-12.col-md-6.col-xl-4 .flex.justify-between.items-center.mt-lg > div:first-child { display: none !important; } /* ── Verberg ticketcategorie-kop + icoon onder Tickets ── */ .title.flex.items-center.gap-3 { display: none !important; } /* ── Britt feedback Aug 2026 ─────────────────── */ /* Verberg klein portal-logo (terug naar home) op event/workshop-pagina's */ .hero.hero--event a[href="/weekvandevitaliteit-facilicom-groep"] { display: none !important; } /* Neutraal ticket-icoon i.p.v. vervoersmiddel (trein/auto/etc.) */ .section-without-map .icon-circle svg, .category-tickets .icon-circle svg { display: none !important; } .section-without-map .icon-circle::after, .category-tickets .icon-circle::after { content: "" !important; display: block !important; width: 10px !important; height: 10px !important; border-radius: 50% !important; background: currentColor !important; margin: 0 auto !important; } /* Bulletlists in beschrijvingen */ .hero.hero--event ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .hero.hero--event ul li { display: list-item !important; margin: 0.3rem 0 !important; } .section-text ul, .section-text-image ul, .formatted-text ul { list-style: disc !important; padding-left: 1.35rem !important; margin: 0.75rem 0 1rem !important; } .section-text ul li, .section-text-image ul li, .formatted-text ul li { display: list-item !important; margin: 0.3rem 0 !important; }aa:T502,

Gezond ouder worden is niet voor iedereen vanzelfsprekend. Je lichaam verandert en je voelt je soms minder vitaal en energiek.

In deze workshop gaan we samen aan de slag met dit soort vragen. We praten over:

Welke fases er zijn bij het ouder worden.
Hoe je keuzes maakt die goed voelen voor de toekomst.
Hoe je goed omgaat met stress en je energie.
Wat jouw passies zijn en hoe je die kunt gebruiken.

ab:T3794,/* ================================================ FACILICOM HUISSTIJL — Week van de Vitaliteit Event&Go Navy: #004077 | Rood: #E52A1F ================================================ */ /* ── HERO ────────────────────────────────────── */ .hero.hero--portal.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--portal .fill-primary-600 { fill: #003260 !important; } .hero.hero--event.bg-primary-400 { background: linear-gradient(160deg, #004077 0%, #005fa3 100%) !important; } .hero--event .fill-primary-600 { fill: #003260 !important; } /* ── HERO AFBEELDING (te groot) ──────────────── */ /* De hero-rij is flex: kolommen worden even hoog als de tekstkolom (~1063px). */ /* De achtergrond-afbeelding met cover schaalt daardoor enorm op. */ /* Oplossing: kolom verticaal centreren + vaste hoogte + contain. */ .hero--portal .col-xl-5, .hero--portal .col-lg-4 { align-self: center !important; } .hero--portal .col-xl-5 .rounded-lg, .hero--portal .col-lg-4 .rounded-lg { height: 420px !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; } /* ── HEADER NAV PILL ─────────────────────────── */ /* Alleen de header-balk — niet header .bg-white/80 (matcht het mobiele menu). */ /* Geen backdrop-filter op .header-content: dat breekt position:fixed van het mobiele menu. */ header > .container > .header-content { background-color: rgba(255, 255, 255, 0.95) !important; } header nav a { color: #004077 !important; } header nav a:hover { color: #E52A1F !important; } /* ── MAAND TABS (JUL / AUG) ──────────────────── */ .month-navigation .month { color: #004077 !important; font-weight: 700; letter-spacing: 1px; } .month-navigation .month-item.active .month, .month-navigation .swiper-slide-active .month { color: #004077 !important; opacity: 1; } .month-navigation .month-item:not(.active) .month { opacity: 0.4; } .month-navigation .swiper-slide-active { border-bottom: 2px solid #E52A1F !important; } /* ── KALENDER ────────────────────────────────── */ .react-calendar__navigation button { color: #004077 !important; font-weight: 700; } .react-calendar__tile { color: #555 !important; } .react-calendar__tile.has-events { background-color: #004077 !important; color: #ffffff !important; border-radius: 50%