{"id":3370,"date":"2026-03-15T17:55:27","date_gmt":"2026-03-15T17:55:27","guid":{"rendered":"https:\/\/www.spoorlijn73.be\/WP\/?page_id=3370"},"modified":"2026-04-01T11:07:30","modified_gmt":"2026-04-01T11:07:30","slug":"uitleg","status":"publish","type":"page","link":"https:\/\/spoorlijn73.be\/WP\/uitleg\/","title":{"rendered":"Uitleg"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3370\" class=\"elementor elementor-3370\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1b49f67 e-flex e-con-boxed e-con e-parent\" data-id=\"1b49f67\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c3e9deb elementor-widget elementor-widget-html\" data-id=\"c3e9deb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n  .nostalbus-hero-box {\r\n    border-left: 6px solid #FEB930; \/* Het gele lijntje *\/\r\n    padding-left: 25px;            \/* Ruimte tussen lijn en tekst *\/\r\n    margin: 20px 0;                \/* Ruimte boven en onder *\/\r\n    display: inline-block;         \/* Zorgt dat het lijntje niet de hele paginahoogte pakt *\/\r\n  }\r\n\r\n  .nostalbus-hero-box h1 {\r\n    margin: 0 !important;\r\n    padding: 0 !important;\r\n    font-family: Urbanist;       \/* Of je eigen font-naam *\/\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    color: #FFFFFF;                \/* Witte tekst *\/\r\n    text-transform: uppercase;\r\n    font-size: 3rem;               \/* Pas dit aan naar wens *\/\r\n    text-shadow: 2px 2px 15px rgba(0,0,0,0.5);\r\n    hyphens: none; \r\nfont-size: clamp(1rem, 8vw, 3rem);\r\n  }\r\n\r\n  .nostalbus-hero-box span {\r\n    display: block;\r\n    font-family: Urbanist;\r\n    font-size: 1.2rem;\r\n    font-weight: 400;\r\n    margin-top: 10px;\r\n    letter-spacing: 2px;\r\n  }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0950efc elementor-widget elementor-widget-heading\" data-id=\"0950efc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\"><div class=\"nostalbus-hero-box\">\n  <span>SPOORLIJN73<\/span><h1>\n    Uitleg<br>\n  \n  <\/h1>\n<\/div><\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-378fe38 elementor-widget elementor-widget-text-editor\" data-id=\"378fe38\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Wat uitleg over de lijn en de website.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c35d76c e-flex e-con-boxed e-con e-parent\" data-id=\"c35d76c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-42a9435 elementor-widget elementor-widget-html\" data-id=\"42a9435\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n\/* 1. Import Rubik *\/\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Rubik:wght@400;700&display=swap');\n\n\/* 2. De container: geforceerde weergave *\/\n.s73-scene {\n  display: flex !important;\n  flex-wrap: wrap !important;\n  justify-content: center !important;\n  gap: 20px !important;\n  margin: 40px auto !important;\n  width: 100% !important;\n  min-height: 400px !important; \/* Forceert dat er ruimte is *\/\n  perspective: 1000px !important;\n  font-family: 'Urbanist', sans-serif !important;\n}\n\n\/* 3. De kaart: vaste afmetingen *\/\n.s73-card {\n  position: relative !important;\n  width: 240px !important;\n  height: 350px !important;\n  cursor: pointer !important;\n  transition: transform 0.8s !important;\n  transform-style: preserve-3d !important;\n  display: block !important; \/* Zorgt dat het geen inline element is *\/\n}\n\n.s73-card:hover {\n  transform: rotateY(180deg) !important;\n}\n\n\/* 4. Voor- en achterkant *\/\n.s73-face {\n  position: absolute !important;\n  top: 0 !important;\n  left: 0 !important;\n  width: 100% !important;\n  height: 100% !important;\n  backface-visibility: hidden !important;\n  -webkit-backface-visibility: hidden !important;\n  border-radius: 10px !important;\n  overflow: hidden !important;\n  background-color: #333 !important; \/* Als de foto niet laadt, zie je grijs ipv wit *\/\n}\n\n.s73-face img {\n  width: 100% !important;\n  height: 100% !important;\n  object-fit: cover !important;\n  display: block !important;\n}\n\n\/* 5. De tekstlaag *\/\n.s73-content {\n  position: absolute !important;\n  top: 0 !important;\n  left: 0 !important;\n  width: 100% !important;\n  height: 100% !important;\n  background: rgba(0, 0, 0, 0.6) !important;\n  display: flex !important;\n  flex-direction: column !important;\n  justify-content: center !important;\n  align-items: center !important;\n  padding: 15px !important;\n  box-sizing: border-box !important;\n  color: white !important;\n  z-index: 2 !important;\n}\n\n.s73-content h3 {\n color: white !important;\n}\n\n\/* De kaart basis *\/\n.s73-card {\n  position: relative !important;\n  width: 240px !important;\n  height: 350px !important;\n  cursor: pointer !important;\n  transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1) !important;\n  transform-style: preserve-3d !important;\n}\n\n\/* De draai: we voegen een hogere z-index toe aan de kaart zelf bij hover *\/\n.s73-card:hover {\n  transform: rotateY(180deg) !important;\n  z-index: 100 !important;\n}\n\n\/* Voor- en achterkant basis *\/\n.s73-face {\n  position: absolute !important;\n  top: 0 !important;\n  left: 0 !important;\n  width: 100% !important;\n  height: 100% !important;\n  backface-visibility: hidden !important;\n  -webkit-backface-visibility: hidden !important;\n  border-radius: 12px !important;\n  overflow: hidden !important;\n}\n\n\/* DE CRUCIALE FIX: \n   Zorg dat de achterkant 'bovenop' de voorkant komt te liggen na het draaien *\/\n.s73-face--back {\n  transform: rotateY(180deg) !important;\n  z-index: 2 !important; \n}\n\n\/* De knop hover fix *\/\n.s73-btn {\n  position: relative !important;\n  z-index: 10 !important; \/* Forceert de knop naar de allerhoogste laag *\/\n  display: inline-block !important;\n  margin-top: 15px !important;\n  padding: 10px 25px !important;\n  background-color: #FEB930 !important;\n  color: #000000 !important;\n  text-decoration: none !important;\n  font-weight: 700 !important;\n  border-radius: 30px !important;\n  transition: all 0.3s ease-in-out !important;\n}\n\n.s73-btn:hover {\n  background-color: #284A4C !important;\n  color: #ffffff !important;\n  transform: scale(1.1) !important;\n}\n\n\/* De knop in ruststand *\/\n.s73-btn {\n  display: inline-block !important;\n  margin-top: 15px !important;\n  padding: 10px 20px !important;\n  background-color: #FEB930 !important;\n  color: #000000 !important; \/* Tekst is zwart in rust *\/\n  text-decoration: none !important;\n  font-weight: 700 !important;\n  border-radius: 30px !important;\n  font-size: 14px !important;\n  transition: all 0.3s ease-in-out !important;\n  border: none !important;\n}\n\n\/* De knop bij hover - specifiek de tekst naar wit *\/\n.s73-btn:hover {\n  background-color: #284A4C !important;\n  color: #ffffff !important; \/* Forceert witte tekst *\/\n  transform: scale(1.05) !important;\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e288774 e-flex e-con-boxed e-con e-parent\" data-id=\"e288774\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d1e859f elementor-widget elementor-widget-html\" data-id=\"d1e859f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"s73-scene\">\r\n  <div class=\"s73-card\">\r\n    <div class=\"s73-face\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73LijnFront.jpg\">\r\n      <div class=\"s73-content\"><h3>De Spoorlijn<\/h3><\/div>\r\n    <\/div>\r\n    <div class=\"s73-face s73-face--back\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73LijnBack.jpg\">\r\n      <div class=\"s73-content\">\r\n        <p>Wat info over lijn 73.<\/p>\r\n        <a href=\"https:\/\/spoorlijn73.be\/WP\/uitleg\/uitleg-technisch\" class=\"s73-btn\">Lees meer<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n  <div class=\"s73-card\">\r\n    <div class=\"s73-face\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73SiteFront.jpg\" \/>\r\n      <div class=\"s73-content\">\r\n        <h3>De website<\/h3>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"s73-face s73-face--back\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73SiteBack.jpg\" \/>\r\n      <div class=\"s73-content\">\r\n        <p>Wat achtergrondinfo over deze website.<\/p>\r\n        <a href=\"https:\/\/spoorlijn73.be\/WP\/uitleg-website\" class=\"s73-btn\">Lees meer<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"s73-card\">\r\n    <div class=\"s73-face\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73MaterieelFront.jpg\" \/>\r\n      <div class=\"s73-content\">\r\n        <h3>Het materieel<\/h3>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"s73-face s73-face--back\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73MaterieelBack.jpg\" \/>\r\n      <div class=\"s73-content\">\r\n        <p>Informatie over treinen op deze lijn.<\/p>\r\n        <a href=\"https:\/\/spoorlijn73.be\/WP\/uitleg-materieel\" class=\"s73-btn\">Lees meer<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"s73-card\">\r\n    <div class=\"s73-face\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73DisclaimerFront.jpg\" \/>\r\n      <div class=\"s73-content\">\r\n        <h3>Disclaimer<\/h3>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"s73-face s73-face--back\">\r\n      <img decoding=\"async\" src=\"https:\/\/spoorlijn73.be\/Uitleg\/UitlegS73DisclaimerBack.jpg\" \/>\r\n      <div class=\"s73-content\">\r\n        <p>Omdat het nu eenmaal nodig is: de kleine lettertjes.<\/p>\r\n        <a href=\"https:\/\/spoorlijn73.be\/WP\/uitleg-disclaimer\" class=\"s73-btn\">Lees meer<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>SPOORLIJN73 Uitleg Wat uitleg over de lijn en de website. De Spoorlijn Wat info over lijn 73. Lees meer De website Wat achtergrondinfo over deze website. Lees meer Het materieel Informatie over treinen op deze lijn. Lees meer Disclaimer Omdat het nu eenmaal nodig is: de kleine lettertjes. Lees meer<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"","_kad_post_title":"hide","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"wf_page_folders":[19],"class_list":["post-3370","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/pages\/3370","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/comments?post=3370"}],"version-history":[{"count":77,"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/pages\/3370\/revisions"}],"predecessor-version":[{"id":6151,"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/pages\/3370\/revisions\/6151"}],"wp:attachment":[{"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/media?parent=3370"}],"wp:term":[{"taxonomy":"wf_page_folders","embeddable":true,"href":"https:\/\/spoorlijn73.be\/WP\/wp-json\/wp\/v2\/wf_page_folders?post=3370"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}