{"id":966,"date":"2026-02-13T01:25:51","date_gmt":"2026-02-13T01:25:51","guid":{"rendered":"https:\/\/withifi.muhubonurture.nl\/?page_id=966"},"modified":"2026-08-29T04:43:47","modified_gmt":"2026-08-29T04:43:47","slug":"oefenen-met-enkelvoud-meervoud","status":"publish","type":"page","link":"https:\/\/withifi.muhubonurture.nl\/?page_id=966","title":{"rendered":"Oefenen Met Enkelvoud &amp; Meervoud"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"966\" class=\"elementor elementor-966\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2a64a5f e-con-full e-flex e-con e-parent\" data-id=\"2a64a5f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-23eb2d9 elementor-widget elementor-widget-html\" data-id=\"23eb2d9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================\r\n     WITH IFI \u2014 EEN OF MEER?\r\n     3 LEVELS + IFI ALS BEGELEIDER\r\n========================================= -->\r\n\r\n<style>\r\nbody{\r\n  margin:0;\r\n  font-family:'Inter',sans-serif;\r\n}\r\n\r\n.em-page{\r\n  min-height:100vh;\r\n  padding:6rem 6vw 5rem;\r\n  color:#3A2B24;\r\n\r\n  background:\r\n    radial-gradient(circle at 16% 18%, rgba(255,255,255,.88) 0%, transparent 31%),\r\n    radial-gradient(circle at 86% 22%, rgba(255,231,239,.46) 0%, transparent 31%),\r\n    radial-gradient(circle at 50% 86%, rgba(230,244,237,.55) 0%, transparent 38%),\r\n    linear-gradient(135deg,#F9FBF8 0%,#EEF7F3 48%,#FFF8EF 100%);\r\n}\r\n\r\n.em-wrap{\r\n  max-width:1180px;\r\n  margin:0 auto;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   HERO\r\n========================================= *\/\r\n\r\n.em-hero{\r\n  max-width:980px;\r\n  margin:0 auto 3.5rem;\r\n  padding:3.2rem;\r\n\r\n  border-radius:42px;\r\n\r\n  background:rgba(255,255,255,.64);\r\n  border:1px solid rgba(255,255,255,.96);\r\n\r\n  box-shadow:0 16px 42px rgba(90,70,55,.08);\r\n\r\n  backdrop-filter:blur(16px);\r\n  -webkit-backdrop-filter:blur(16px);\r\n\r\n  text-align:center;\r\n}\r\n\r\n.em-label{\r\n  display:inline-flex;\r\n  align-items:center;\r\n  gap:.45rem;\r\n\r\n  padding:11px 20px;\r\n  margin-bottom:1.2rem;\r\n\r\n  border-radius:999px;\r\n\r\n  background:rgba(255,255,255,.78);\r\n  border:1px solid rgba(255,255,255,.96);\r\n\r\n  color:#8B6B55;\r\n\r\n  font-size:15px;\r\n  font-weight:900;\r\n}\r\n\r\n.em-title{\r\n  margin:0 0 1.2rem;\r\n\r\n  font-size:clamp(42px,6vw,72px);\r\n  line-height:1.05;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-weight:950;\r\n}\r\n\r\n.em-intro{\r\n  max-width:790px;\r\n  margin:0 auto;\r\n\r\n  font-size:19px;\r\n  line-height:1.9;\r\n\r\n  color:#7A6455;\r\n\r\n  font-weight:650;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   LEVEL ROUTE\r\n========================================= *\/\r\n\r\n.em-level-route{\r\n  max-width:1000px;\r\n  margin:0 auto 3rem;\r\n\r\n  display:grid;\r\n  grid-template-columns:repeat(3,1fr);\r\n\r\n  gap:1.2rem;\r\n}\r\n\r\n.em-route-level{\r\n  position:relative;\r\n  overflow:hidden;\r\n\r\n  padding:1.6rem;\r\n\r\n  border-radius:30px;\r\n\r\n  border:1px solid rgba(255,255,255,.95);\r\n\r\n  box-shadow:0 10px 28px rgba(90,70,55,.06);\r\n\r\n  transition:.25s ease;\r\n}\r\n\r\n.em-route-level:nth-child(1){\r\n  background:linear-gradient(135deg,#FFF4E3,#FFF9EF);\r\n}\r\n\r\n.em-route-level:nth-child(2){\r\n  background:linear-gradient(135deg,#EAF7F1,#F7FFFB);\r\n}\r\n\r\n.em-route-level:nth-child(3){\r\n  background:linear-gradient(135deg,#FFEAF1,#FFF7FA);\r\n}\r\n\r\n.em-route-level::after{\r\n  content:\"\";\r\n\r\n  position:absolute;\r\n\r\n  width:120px;\r\n  height:120px;\r\n\r\n  right:-42px;\r\n  top:-42px;\r\n\r\n  border-radius:50%;\r\n\r\n  background:rgba(255,255,255,.5);\r\n}\r\n\r\n.em-route-level.active{\r\n  transform:translateY(-5px);\r\n\r\n  box-shadow:0 18px 38px rgba(90,70,55,.11);\r\n}\r\n\r\n.em-route-level.done{\r\n  opacity:.72;\r\n}\r\n\r\n.em-route-icon{\r\n  position:relative;\r\n  z-index:2;\r\n\r\n  width:52px;\r\n  height:52px;\r\n\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n\r\n  margin-bottom:.9rem;\r\n\r\n  border-radius:18px;\r\n\r\n  background:rgba(255,255,255,.78);\r\n\r\n  font-size:1.45rem;\r\n}\r\n\r\n.em-route-level h3{\r\n  position:relative;\r\n  z-index:2;\r\n\r\n  margin:0 0 .4rem;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-size:1.15rem;\r\n  font-weight:950;\r\n}\r\n\r\n.em-route-level p{\r\n  position:relative;\r\n  z-index:2;\r\n\r\n  margin:0;\r\n\r\n  color:#7A6455;\r\n\r\n  font-size:.96rem;\r\n  line-height:1.6;\r\n  font-weight:650;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   SUPPORT \u2014 LEVEL 1\r\n========================================= *\/\r\n\r\n.em-support{\r\n  max-width:900px;\r\n  margin:0 auto 2.3rem;\r\n\r\n  text-align:center;\r\n}\r\n\r\n.em-support-title{\r\n  margin-bottom:1rem;\r\n\r\n  color:#7A6455;\r\n\r\n  font-size:.95rem;\r\n  font-weight:850;\r\n}\r\n\r\n.em-support-grid{\r\n  display:grid;\r\n  grid-template-columns:repeat(2,1fr);\r\n\r\n  gap:1rem;\r\n}\r\n\r\n.em-support-card{\r\n  padding:1.3rem 1.4rem;\r\n\r\n  border-radius:24px;\r\n\r\n  border:1px solid rgba(255,255,255,.96);\r\n\r\n  box-shadow:0 8px 20px rgba(90,70,55,.06);\r\n}\r\n\r\n.em-support-card.one{\r\n  background:linear-gradient(135deg,#FFF4E8,#FFF9F3);\r\n}\r\n\r\n.em-support-card.more{\r\n  background:linear-gradient(135deg,#EAF7F1,#F8FFFB);\r\n}\r\n\r\n.em-support-icon{\r\n  display:block;\r\n\r\n  margin-bottom:.55rem;\r\n\r\n  font-size:2rem;\r\n}\r\n\r\n.em-support-card strong{\r\n  display:block;\r\n\r\n  margin-bottom:.35rem;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-size:1.08rem;\r\n  font-weight:950;\r\n}\r\n\r\n.em-support-card span{\r\n  color:#7A6455;\r\n\r\n  font-size:.95rem;\r\n  line-height:1.6;\r\n  font-weight:700;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   OEFENKAART\r\n========================================= *\/\r\n\r\n.em-oefen-box{\r\n  max-width:1120px;\r\n\r\n  margin:0 auto;\r\n\r\n  padding:2.4rem;\r\n\r\n  border-radius:42px;\r\n\r\n  background:rgba(255,255,255,.68);\r\n\r\n  border:1px solid rgba(255,255,255,.96);\r\n\r\n  box-shadow:0 18px 46px rgba(90,70,55,.09);\r\n\r\n  backdrop-filter:blur(14px);\r\n  -webkit-backdrop-filter:blur(14px);\r\n}\r\n\r\n.em-oefen-layout{\r\n  display:grid;\r\n\r\n  grid-template-columns:minmax(0,1fr) 235px;\r\n\r\n  gap:2.2rem;\r\n\r\n  align-items:center;\r\n}\r\n\r\n.em-oefen-main{\r\n  min-width:0;\r\n\r\n  text-align:center;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   TOP\r\n========================================= *\/\r\n\r\n.em-oefen-top{\r\n  display:flex;\r\n\r\n  justify-content:space-between;\r\n\r\n  align-items:center;\r\n\r\n  gap:1rem;\r\n\r\n  margin-bottom:1.4rem;\r\n}\r\n\r\n.em-level-pill,\r\n.em-vraag-pill{\r\n  padding:10px 16px;\r\n\r\n  border-radius:999px;\r\n\r\n  background:rgba(255,255,255,.88);\r\n\r\n  color:#8B6B55;\r\n\r\n  font-size:.9rem;\r\n  font-weight:900;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   PROGRESS\r\n========================================= *\/\r\n\r\n.em-progress-wrap{\r\n  width:100%;\r\n  height:9px;\r\n\r\n  margin-bottom:2.5rem;\r\n\r\n  overflow:hidden;\r\n\r\n  border-radius:999px;\r\n\r\n  background:#F4EFEA;\r\n}\r\n\r\n.em-progress-bar{\r\n  width:0%;\r\n  height:100%;\r\n\r\n  border-radius:999px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      #F4CFE0 0%,\r\n      #DDEFE6 55%,\r\n      #DDEEFF 100%\r\n    );\r\n\r\n  transition:width .35s ease;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   VRAAG\r\n========================================= *\/\r\n\r\n.em-vraag-type{\r\n  display:inline-block;\r\n\r\n  margin-bottom:.8rem;\r\n\r\n  padding:7px 13px;\r\n\r\n  border-radius:999px;\r\n\r\n  background:#FFF3E8;\r\n\r\n  color:#8B6B55;\r\n\r\n  font-size:.82rem;\r\n  font-weight:900;\r\n}\r\n\r\n.em-vraag-title{\r\n  margin-bottom:.65rem;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-size:clamp(1.5rem,3vw,2rem);\r\n\r\n  font-weight:950;\r\n}\r\n\r\n.em-helper{\r\n  max-width:650px;\r\n\r\n  margin:0 auto 1.6rem;\r\n\r\n  color:#7A6455;\r\n\r\n  font-size:1rem;\r\n\r\n  line-height:1.7;\r\n\r\n  font-weight:700;\r\n}\r\n\r\n.em-stimulus{\r\n  margin:1.2rem auto 2rem;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-size:clamp(2.5rem,6vw,4.5rem);\r\n\r\n  line-height:1.15;\r\n\r\n  font-weight:950;\r\n\r\n  word-break:break-word;\r\n}\r\n\r\n.em-stimulus.pair{\r\n  font-size:clamp(1.8rem,4vw,3rem);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   ANTWOORDEN\r\n========================================= *\/\r\n\r\n.em-antwoorden{\r\n  display:flex;\r\n\r\n  justify-content:center;\r\n\r\n  flex-wrap:wrap;\r\n\r\n  gap:.9rem;\r\n}\r\n\r\n.em-answer{\r\n  min-width:145px;\r\n\r\n  padding:1rem 1.45rem;\r\n\r\n  border:none;\r\n\r\n  border-radius:999px;\r\n\r\n  background:#FFF9F4;\r\n\r\n  color:#3A2B24 !important;\r\n\r\n  box-shadow:0 8px 20px rgba(90,70,55,.07);\r\n\r\n  font-family:inherit;\r\n\r\n  font-size:1rem;\r\n\r\n  font-weight:900;\r\n\r\n  cursor:pointer;\r\n\r\n  transition:.22s ease;\r\n}\r\n\r\n.em-answer:hover{\r\n  transform:translateY(-2px);\r\n\r\n  background:#FFF0DE;\r\n}\r\n\r\n.em-answer.correct{\r\n  background:#DDF5E4 !important;\r\n\r\n  color:#315D43 !important;\r\n}\r\n\r\n.em-answer.try-again{\r\n  background:#FFF0E8 !important;\r\n\r\n  color:#8A5D4C !important;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   INPUT\r\n========================================= *\/\r\n\r\n.em-input-wrap{\r\n  max-width:440px;\r\n\r\n  margin:0 auto;\r\n}\r\n\r\n.em-input{\r\n  width:100%;\r\n\r\n  box-sizing:border-box;\r\n\r\n  padding:1rem 1.25rem;\r\n\r\n  border:2px solid #E7DAD0;\r\n\r\n  border-radius:20px;\r\n\r\n  outline:none;\r\n\r\n  background:#FFFDFC;\r\n\r\n  color:#3A2B24;\r\n\r\n  text-align:center;\r\n\r\n  font-family:inherit;\r\n\r\n  font-size:1.3rem;\r\n\r\n  font-weight:900;\r\n\r\n  transition:.2s ease;\r\n}\r\n\r\n.em-input:focus{\r\n  border-color:#C9DED5;\r\n\r\n  box-shadow:\r\n    0 0 0 5px rgba(207,234,214,.35);\r\n}\r\n\r\n.em-input.correct{\r\n  background:#F0FAF3;\r\n\r\n  border-color:#C4E4CF;\r\n}\r\n\r\n.em-input.try-again{\r\n  background:#FFF7F2;\r\n\r\n  border-color:#F1D7C9;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   BUTTONS\r\n========================================= *\/\r\n\r\n.em-check-btn,\r\n.em-next-btn,\r\n.em-restart-btn{\r\n  margin-top:1.4rem;\r\n\r\n  padding:1rem 1.8rem;\r\n\r\n  border:none;\r\n\r\n  border-radius:999px;\r\n\r\n  background:#FFD6A8;\r\n\r\n  color:#3A2B24;\r\n\r\n  box-shadow:0 9px 22px rgba(90,70,55,.08);\r\n\r\n  font-family:inherit;\r\n\r\n  font-size:1rem;\r\n\r\n  font-weight:950;\r\n\r\n  cursor:pointer;\r\n\r\n  transition:.22s ease;\r\n}\r\n\r\n.em-check-btn:hover,\r\n.em-next-btn:hover,\r\n.em-restart-btn:hover{\r\n  transform:translateY(-2px);\r\n\r\n  background:#FFF0DE;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   FEEDBACK\r\n========================================= *\/\r\n\r\n.em-feedback{\r\n  min-height:34px;\r\n\r\n  margin-top:1.5rem;\r\n\r\n  color:#7A6455;\r\n\r\n  font-size:1rem;\r\n\r\n  line-height:1.7;\r\n\r\n  font-weight:800;\r\n}\r\n\r\n.em-feedback.good{\r\n  color:#47735A;\r\n}\r\n\r\n.em-feedback.retry{\r\n  color:#8A6555;\r\n}\r\n\r\n.em-next-wrap{\r\n  display:none;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   IFI RECHTS\r\n========================================= *\/\r\n\r\n.em-ifi-side{\r\n  align-self:stretch;\r\n\r\n  display:flex;\r\n\r\n  flex-direction:column;\r\n\r\n  justify-content:center;\r\n\r\n  align-items:center;\r\n\r\n  gap:1rem;\r\n\r\n  padding:.5rem 0;\r\n}\r\n\r\n.em-ifi-side-avatar{\r\n  display:block;\r\n\r\n  width:205px;\r\n\r\n  max-width:100%;\r\n  max-height:330px;\r\n\r\n  height:auto;\r\n\r\n  object-fit:contain;\r\n\r\n  filter:\r\n    drop-shadow(\r\n      0 14px 24px rgba(90,70,55,.10)\r\n    );\r\n\r\n  transition:\r\n    opacity .25s ease,\r\n    transform .25s ease;\r\n}\r\n\r\n.em-ifi-side-bubble{\r\n  width:100%;\r\n\r\n  box-sizing:border-box;\r\n\r\n  padding:1rem 1.15rem;\r\n\r\n  border-radius:24px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle at 18% 18%,\r\n      rgba(255,255,255,.94) 0%,\r\n      transparent 40%\r\n    ),\r\n    linear-gradient(\r\n      135deg,\r\n      #FFF8EF 0%,\r\n      #F3FBF8 100%\r\n    );\r\n\r\n  border:1px solid rgba(255,255,255,.96);\r\n\r\n  box-shadow:0 10px 26px rgba(90,70,55,.07);\r\n\r\n  text-align:center;\r\n}\r\n\r\n.em-ifi-name{\r\n  display:inline-block;\r\n\r\n  margin-bottom:.5rem;\r\n\r\n  padding:6px 11px;\r\n\r\n  border-radius:999px;\r\n\r\n  background:rgba(255,255,255,.82);\r\n\r\n  color:#8B6B55;\r\n\r\n  font-size:.82rem;\r\n  font-weight:900;\r\n}\r\n\r\n.em-ifi-message{\r\n  margin:0;\r\n\r\n  color:#5F4B3F;\r\n\r\n  font-size:.95rem;\r\n  line-height:1.65;\r\n\r\n  font-weight:750;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   LEVEL TRANSITION\r\n========================================= *\/\r\n\r\n.em-level-transition{\r\n  display:none;\r\n\r\n  padding:2.2rem;\r\n\r\n  border-radius:30px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #FFF8EF,\r\n      #F3FBF8\r\n    );\r\n\r\n  text-align:center;\r\n}\r\n\r\n.em-level-transition h3{\r\n  margin:0 0 .7rem;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-size:1.6rem;\r\n\r\n  font-weight:950;\r\n}\r\n\r\n.em-level-transition p{\r\n  max-width:620px;\r\n\r\n  margin:0 auto;\r\n\r\n  color:#7A6455;\r\n\r\n  line-height:1.8;\r\n\r\n  font-weight:700;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   FINISH\r\n========================================= *\/\r\n\r\n.em-finish{\r\n  display:none;\r\n\r\n  text-align:center;\r\n}\r\n\r\n.em-finish-avatar{\r\n  width:180px;\r\n\r\n  max-height:250px;\r\n\r\n  object-fit:contain;\r\n\r\n  margin:0 auto 1rem;\r\n\r\n  filter:\r\n    drop-shadow(\r\n      0 12px 22px rgba(90,70,55,.10)\r\n    );\r\n}\r\n\r\n.em-finish h2{\r\n  margin:.5rem 0 .8rem;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-size:clamp(2rem,4vw,3rem);\r\n\r\n  font-weight:950;\r\n}\r\n\r\n.em-finish p{\r\n  max-width:620px;\r\n\r\n  margin:0 auto;\r\n\r\n  color:#7A6455;\r\n\r\n  font-size:1.05rem;\r\n  line-height:1.8;\r\n\r\n  font-weight:700;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   NOTE\r\n========================================= *\/\r\n\r\n.em-note{\r\n  max-width:760px;\r\n\r\n  margin:3rem auto 0;\r\n\r\n  padding:1.7rem;\r\n\r\n  border-radius:28px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle at 12% 18%,\r\n      rgba(255,255,255,.88),\r\n      transparent 34%\r\n    ),\r\n    linear-gradient(\r\n      135deg,\r\n      #FFF8EF,\r\n      #F3FBF8 52%,\r\n      #EEF7FE\r\n    );\r\n\r\n  border:1px solid rgba(255,255,255,.96);\r\n\r\n  box-shadow:0 14px 34px rgba(90,70,55,.07);\r\n\r\n  text-align:center;\r\n\r\n  color:#7A6455;\r\n\r\n  font-size:1rem;\r\n  line-height:1.8;\r\n\r\n  font-weight:700;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   TABLET\r\n========================================= *\/\r\n\r\n@media(max-width:950px){\r\n\r\n  .em-oefen-layout{\r\n    grid-template-columns:minmax(0,1fr) 175px;\r\n\r\n    gap:1.2rem;\r\n  }\r\n\r\n  .em-ifi-side-avatar{\r\n    width:155px;\r\n  }\r\n\r\n  .em-ifi-message{\r\n    font-size:.88rem;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* =========================================\r\n   MOBILE\r\n========================================= *\/\r\n\r\n@media(max-width:700px){\r\n\r\n  .em-page{\r\n    padding:4rem 5vw;\r\n  }\r\n\r\n  .em-hero{\r\n    padding:2.3rem 1.7rem;\r\n  }\r\n\r\n  .em-level-route{\r\n    grid-template-columns:1fr;\r\n  }\r\n\r\n  .em-support-grid{\r\n    grid-template-columns:1fr;\r\n  }\r\n\r\n  .em-oefen-box{\r\n    padding:1.5rem 1.15rem;\r\n  }\r\n\r\n  .em-oefen-layout{\r\n    grid-template-columns:1fr;\r\n  }\r\n\r\n  .em-oefen-top{\r\n    justify-content:center;\r\n\r\n    flex-wrap:wrap;\r\n  }\r\n\r\n  .em-ifi-side{\r\n    order:-1;\r\n\r\n    flex-direction:row;\r\n\r\n    align-items:center;\r\n\r\n    justify-content:center;\r\n\r\n    gap:1rem;\r\n\r\n    padding:.2rem 0 1rem;\r\n  }\r\n\r\n  .em-ifi-side-avatar{\r\n    width:95px;\r\n\r\n    flex-shrink:0;\r\n  }\r\n\r\n  .em-ifi-side-bubble{\r\n    text-align:left;\r\n  }\r\n\r\n  .em-answer{\r\n    width:100%;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* =========================================\r\n   EXTRA KLEIN MOBIEL\r\n========================================= *\/\r\n\r\n@media(max-width:480px){\r\n\r\n  .em-ifi-side{\r\n    flex-direction:column;\r\n\r\n    text-align:center;\r\n  }\r\n\r\n  .em-ifi-side-bubble{\r\n    text-align:center;\r\n  }\r\n\r\n}\r\n<\/style>\r\n\r\n\r\n<section class=\"kl-page\" data-withifi-world=\"woordenwereld\">\r\n\r\n  <div class=\"em-wrap\">\r\n\r\n\r\n    <!-- =====================================\r\n         HERO\r\n    ====================================== -->\r\n\r\n    <div class=\"em-hero\">\r\n\r\n      <div class=\"em-label\">\r\n        \ud83c\udf4e Woordenwereld\r\n      <\/div>\r\n\r\n      <h1 class=\"em-title\">\r\n        E\u00e9n of meer?\r\n      <\/h1>\r\n\r\n      <p class=\"em-intro\">\r\n        Soms hebben we het over <strong>\u00e9\u00e9n<\/strong> ding.\r\n        Soms zijn het er <strong>meer<\/strong>.\r\n        Dan kan een woord veranderen.\r\n        We gaan eerst rustig kijken naar het verschil en daarna steeds meer zelf oefenen.\r\n      <\/p>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- =====================================\r\n         LEVEL ROUTE\r\n    ====================================== -->\r\n\r\n    <div class=\"em-level-route\">\r\n\r\n      <div\r\n        class=\"em-route-level active\"\r\n        id=\"emRoute1\">\r\n\r\n        <div class=\"em-route-icon\">\r\n          \ud83c\udf31\r\n        <\/div>\r\n\r\n        <h3>\r\n          Level 1 \u00b7 Herkennen\r\n        <\/h3>\r\n\r\n        <p>\r\n          Kijken of een woord over \u00e9\u00e9n of meer gaat.\r\n        <\/p>\r\n\r\n      <\/div>\r\n\r\n\r\n      <div\r\n        class=\"em-route-level\"\r\n        id=\"emRoute2\">\r\n\r\n        <div class=\"em-route-icon\">\r\n          \ud83c\udf3f\r\n        <\/div>\r\n\r\n        <h3>\r\n          Level 2 \u00b7 Vergelijken\r\n        <\/h3>\r\n\r\n        <p>\r\n          Enkelvoud en meervoud naast elkaar herkennen.\r\n        <\/p>\r\n\r\n      <\/div>\r\n\r\n\r\n      <div\r\n        class=\"em-route-level\"\r\n        id=\"emRoute3\">\r\n\r\n        <div class=\"em-route-icon\">\r\n          \ud83c\udf33\r\n        <\/div>\r\n\r\n        <h3>\r\n          Level 3 \u00b7 Zelf doen\r\n        <\/h3>\r\n\r\n        <p>\r\n          Zelf het meervoud zoeken en vormen.\r\n        <\/p>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- =====================================\r\n         SUPPORT \u2014 LEVEL 1\r\n    ====================================== -->\r\n\r\n    <div\r\n      class=\"em-support\"\r\n      id=\"emSupport\">\r\n\r\n      <div class=\"em-support-title\">\r\n        Kijk naar het verschil\r\n      <\/div>\r\n\r\n      <div class=\"em-support-grid\">\r\n\r\n\r\n        <div class=\"em-support-card one\">\r\n\r\n          <span class=\"em-support-icon\">\r\n            \ud83c\udf4e\r\n          <\/span>\r\n\r\n          <strong>\r\n            E\u00e9n\r\n          <\/strong>\r\n\r\n          <span>\r\n            \u00e9\u00e9n appel \u00b7 \u00e9\u00e9n boek \u00b7 \u00e9\u00e9n hond\r\n          <\/span>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"em-support-card more\">\r\n\r\n          <span class=\"em-support-icon\">\r\n            \ud83c\udf4e\ud83c\udf4e\ud83c\udf4e\r\n          <\/span>\r\n\r\n          <strong>\r\n            Meer\r\n          <\/strong>\r\n\r\n          <span>\r\n            appels \u00b7 boeken \u00b7 honden\r\n          <\/span>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- =====================================\r\n         OEFENSECTIE\r\n    ====================================== -->\r\n\r\n    <div class=\"em-oefen-box\">\r\n\r\n      <div class=\"em-oefen-layout\">\r\n\r\n\r\n        <!-- =================================\r\n             LINKERKANT\r\n        ================================== -->\r\n\r\n        <div class=\"em-oefen-main\">\r\n\r\n\r\n          <div id=\"emExerciseContent\">\r\n\r\n\r\n            <div class=\"em-oefen-top\">\r\n\r\n              <div\r\n                class=\"em-level-pill\"\r\n                id=\"emLevelPill\">\r\n\r\n                \ud83c\udf31 Level 1 \u00b7 Herkennen\r\n\r\n              <\/div>\r\n\r\n\r\n              <div\r\n                class=\"em-vraag-pill\"\r\n                id=\"emQuestionCounter\">\r\n\r\n                Vraag 1\r\n\r\n              <\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div class=\"em-progress-wrap\">\r\n\r\n              <div\r\n                class=\"em-progress-bar\"\r\n                id=\"emProgressBar\">\r\n              <\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div\r\n              class=\"em-vraag-type\"\r\n              id=\"emQuestionType\">\r\n\r\n              Herkennen\r\n\r\n            <\/div>\r\n\r\n\r\n            <div\r\n              class=\"em-vraag-title\"\r\n              id=\"emQuestionTitle\">\r\n            <\/div>\r\n\r\n\r\n            <div\r\n              class=\"em-helper\"\r\n              id=\"emHelper\">\r\n            <\/div>\r\n\r\n\r\n            <div\r\n              class=\"em-stimulus\"\r\n              id=\"emStimulus\">\r\n            <\/div>\r\n\r\n\r\n            <div id=\"emAnswerArea\">\r\n            <\/div>\r\n\r\n\r\n            <div\r\n              class=\"em-feedback\"\r\n              id=\"emFeedback\">\r\n            <\/div>\r\n\r\n\r\n            <div\r\n              class=\"em-next-wrap\"\r\n              id=\"emNextWrap\">\r\n\r\n              <button\r\n                type=\"button\"\r\n                class=\"em-next-btn\"\r\n                id=\"emNextBtn\">\r\n\r\n                Rustig verder \ud83c\udf3f\r\n\r\n              <\/button>\r\n\r\n            <\/div>\r\n\r\n          <\/div>\r\n\r\n\r\n          <!-- LEVEL OVERGANG -->\r\n\r\n          <div\r\n            class=\"em-level-transition\"\r\n            id=\"emTransition\">\r\n\r\n            <h3 id=\"emTransitionTitle\">\r\n            <\/h3>\r\n\r\n            <p id=\"emTransitionText\">\r\n            <\/p>\r\n\r\n            <button\r\n              type=\"button\"\r\n              class=\"em-next-btn\"\r\n              id=\"emStartNextLevel\">\r\n\r\n              Verder \ud83c\udf3f\r\n\r\n            <\/button>\r\n\r\n          <\/div>\r\n\r\n\r\n          <!-- EINDE -->\r\n\r\n          <div\r\n            class=\"em-finish\"\r\n            id=\"emFinish\">\r\n\r\n            <img decoding=\"async\"\r\n              class=\"em-finish-avatar\"\r\n              src=\"https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/06\/Goed-Gedaan.png\"\r\n              alt=\"Ifi zegt goed gedaan\">\r\n\r\n            <h2>\r\n              Goed geoefend \ud83c\udf38\r\n            <\/h2>\r\n\r\n            <p id=\"emResultText\">\r\n            <\/p>\r\n\r\n            <button\r\n              type=\"button\"\r\n              class=\"em-restart-btn\"\r\n              id=\"emRestartBtn\">\r\n\r\n              Nog een keer oefenen \ud83c\udf3f\r\n\r\n            <\/button>\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <!-- =================================\r\n             IFI RECHTS\r\n        ================================== -->\r\n\r\n        <aside class=\"em-ifi-side\">\r\n\r\n          <img decoding=\"async\"\r\n            id=\"emIfiAvatar\"\r\n            class=\"em-ifi-side-avatar\"\r\n            src=\"https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/06\/uitleg.png\"\r\n            alt=\"Ifi helpt bij de oefening\">\r\n\r\n          <div class=\"em-ifi-side-bubble\">\r\n\r\n            <div class=\"em-ifi-name\">\r\n              IFI helpt je \ud83c\udf3f\r\n            <\/div>\r\n\r\n            <p\r\n              class=\"em-ifi-message\"\r\n              id=\"emIfiMessage\">\r\n\r\n              Kijk rustig naar het woord.\r\n              Gaat het over \u00e9\u00e9n ding of over meer?\r\n\r\n            <\/p>\r\n\r\n          <\/div>\r\n\r\n        <\/aside>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- REMINDER -->\r\n\r\n    <div class=\"em-note\">\r\n\r\n      Kleine reminder \ud83c\udf38<br>\r\n\r\n      Je hoeft niet alle meervouden meteen uit je hoofd te kennen.\r\n      Eerst leren zien of het om \u00e9\u00e9n of meer gaat is al een belangrijke stap.\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\ndocument.addEventListener(\r\n  \"DOMContentLoaded\",\r\n  function(){\r\n\r\n    \"use strict\";\r\n\r\n\r\n    \/* =========================================\r\n       IFI\r\n    ========================================= *\/\r\n\r\n    const EM_IFI = {\r\n\r\n      uitleg:\r\n        \"https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/06\/uitleg.png\",\r\n\r\n      denken:\r\n        \"https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/06\/Samen-Nadenken.png\",\r\n\r\n      goed:\r\n        \"https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/06\/Goed-Gedaan.png\"\r\n\r\n    };\r\n\r\n\r\n    \/* =========================================\r\n       LEVELS\r\n    ========================================= *\/\r\n\r\n    const emLevels = [\r\n\r\n\r\n      \/* =======================================\r\n         LEVEL 1\r\n      ======================================= *\/\r\n\r\n      {\r\n\r\n        level:1,\r\n\r\n        title:\r\n          \"\ud83c\udf31 Level 1 \u00b7 Herkennen\",\r\n\r\n        questions:[\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"E\u00e9n of meer?\",\r\n\r\n            question:\r\n              \"Gaat dit woord over \u00e9\u00e9n of meer?\",\r\n\r\n            helper:\r\n              \"Kijk rustig naar het woord.\",\r\n\r\n            stimulus:\r\n              \"hond\",\r\n\r\n            answers:[\r\n              \"E\u00e9n\",\r\n              \"Meer\"\r\n            ],\r\n\r\n            correct:\r\n              \"E\u00e9n\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"E\u00e9n of meer?\",\r\n\r\n            question:\r\n              \"Gaat dit woord over \u00e9\u00e9n of meer?\",\r\n\r\n            helper:\r\n              \"Denk aan hoeveel dieren het woord bedoelt.\",\r\n\r\n            stimulus:\r\n              \"katten\",\r\n\r\n            answers:[\r\n              \"E\u00e9n\",\r\n              \"Meer\"\r\n            ],\r\n\r\n            correct:\r\n              \"Meer\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Herkennen\",\r\n\r\n            question:\r\n              \"Is dit enkelvoud of meervoud?\",\r\n\r\n            helper:\r\n              \"Enkelvoud betekent: \u00e9\u00e9n.\",\r\n\r\n            stimulus:\r\n              \"boek\",\r\n\r\n            answers:[\r\n              \"Enkelvoud\",\r\n              \"Meervoud\"\r\n            ],\r\n\r\n            correct:\r\n              \"Enkelvoud\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Herkennen\",\r\n\r\n            question:\r\n              \"Is dit enkelvoud of meervoud?\",\r\n\r\n            helper:\r\n              \"Meervoud betekent: meer dan \u00e9\u00e9n.\",\r\n\r\n            stimulus:\r\n              \"stoelen\",\r\n\r\n            answers:[\r\n              \"Enkelvoud\",\r\n              \"Meervoud\"\r\n            ],\r\n\r\n            correct:\r\n              \"Meervoud\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"E\u00e9n of meer?\",\r\n\r\n            question:\r\n              \"Over hoeveel gaat dit woord?\",\r\n\r\n            helper:\r\n              \"Kijk goed naar het einde van het woord.\",\r\n\r\n            stimulus:\r\n              \"appels\",\r\n\r\n            answers:[\r\n              \"E\u00e9n\",\r\n              \"Meer\"\r\n            ],\r\n\r\n            correct:\r\n              \"Meer\"\r\n\r\n          }\r\n\r\n        ]\r\n\r\n      },\r\n\r\n\r\n      \/* =======================================\r\n         LEVEL 2\r\n      ======================================= *\/\r\n\r\n      {\r\n\r\n        level:2,\r\n\r\n        title:\r\n          \"\ud83c\udf3f Level 2 \u00b7 Vergelijken\",\r\n\r\n        questions:[\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Zoek het meervoud\",\r\n\r\n            question:\r\n              \"Welk woord betekent meer dan \u00e9\u00e9n?\",\r\n\r\n            helper:\r\n              \"Vergelijk de twee woorden.\",\r\n\r\n            stimulus:\r\n              \"hond \u00b7 honden\",\r\n\r\n            stimulusClass:\r\n              \"pair\",\r\n\r\n            answers:[\r\n              \"hond\",\r\n              \"honden\"\r\n            ],\r\n\r\n            correct:\r\n              \"honden\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Zoek het enkelvoud\",\r\n\r\n            question:\r\n              \"Welk woord betekent precies \u00e9\u00e9n?\",\r\n\r\n            helper:\r\n              \"Kijk rustig naar beide woorden.\",\r\n\r\n            stimulus:\r\n              \"boeken \u00b7 boek\",\r\n\r\n            stimulusClass:\r\n              \"pair\",\r\n\r\n            answers:[\r\n              \"boeken\",\r\n              \"boek\"\r\n            ],\r\n\r\n            correct:\r\n              \"boek\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Welk woord hoort erbij?\",\r\n\r\n            question:\r\n              \"Wat is het meervoud van \u2018stoel\u2019?\",\r\n\r\n            helper:\r\n              \"Welke vorm betekent meer dan \u00e9\u00e9n stoel?\",\r\n\r\n            stimulus:\r\n              \"stoel\",\r\n\r\n            answers:[\r\n              \"stoelen\",\r\n              \"stoels\",\r\n              \"stoelenen\"\r\n            ],\r\n\r\n            correct:\r\n              \"stoelen\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Welk woord hoort erbij?\",\r\n\r\n            question:\r\n              \"Wat is het meervoud van \u2018appel\u2019?\",\r\n\r\n            helper:\r\n              \"Denk aan: \u00e9\u00e9n appel, twee ...\",\r\n\r\n            stimulus:\r\n              \"appel\",\r\n\r\n            answers:[\r\n              \"appelen\",\r\n              \"appels\",\r\n              \"appeles\"\r\n            ],\r\n\r\n            correct:\r\n              \"appels\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Vergelijken\",\r\n\r\n            question:\r\n              \"Welke twee woorden horen bij elkaar?\",\r\n\r\n            helper:\r\n              \"Zoek \u00e9\u00e9n ding en meer van hetzelfde.\",\r\n\r\n            stimulus:\r\n              \"fiets\",\r\n\r\n            answers:[\r\n              \"fiets \u2013 fietsen\",\r\n              \"fiets \u2013 honden\",\r\n              \"fiets \u2013 boeken\"\r\n            ],\r\n\r\n            correct:\r\n              \"fiets \u2013 fietsen\"\r\n\r\n          }\r\n\r\n        ]\r\n\r\n      },\r\n\r\n\r\n      \/* =======================================\r\n         LEVEL 3\r\n      ======================================= *\/\r\n\r\n      {\r\n\r\n        level:3,\r\n\r\n        title:\r\n          \"\ud83c\udf33 Level 3 \u00b7 Zelf doen\",\r\n\r\n        questions:[\r\n\r\n\r\n          {\r\n\r\n            type:\"text\",\r\n\r\n            label:\r\n              \"Maak er meer van\",\r\n\r\n            question:\r\n              \"Typ het meervoud.\",\r\n\r\n            helper:\r\n              \"E\u00e9n hond. Meer ...\",\r\n\r\n            stimulus:\r\n              \"hond\",\r\n\r\n            correct:\r\n              \"honden\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"text\",\r\n\r\n            label:\r\n              \"Maak er meer van\",\r\n\r\n            question:\r\n              \"Typ het meervoud.\",\r\n\r\n            helper:\r\n              \"E\u00e9n boek. Meer ...\",\r\n\r\n            stimulus:\r\n              \"boek\",\r\n\r\n            correct:\r\n              \"boeken\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"text\",\r\n\r\n            label:\r\n              \"Maak er meer van\",\r\n\r\n            question:\r\n              \"Typ het meervoud.\",\r\n\r\n            helper:\r\n              \"E\u00e9n appel. Meer ...\",\r\n\r\n            stimulus:\r\n              \"appel\",\r\n\r\n            correct:\r\n              \"appels\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"choice\",\r\n\r\n            label:\r\n              \"Zelf herkennen\",\r\n\r\n            question:\r\n              \"Welk woord is meervoud?\",\r\n\r\n            helper:\r\n              \"Probeer eerst zelf te kijken.\",\r\n\r\n            stimulus:\r\n              \"boom \u00b7 bomen\",\r\n\r\n            stimulusClass:\r\n              \"pair\",\r\n\r\n            answers:[\r\n              \"boom\",\r\n              \"bomen\"\r\n            ],\r\n\r\n            correct:\r\n              \"bomen\"\r\n\r\n          },\r\n\r\n\r\n          {\r\n\r\n            type:\"text\",\r\n\r\n            label:\r\n              \"Zelf toepassen\",\r\n\r\n            question:\r\n              \"Maak van \u00e9\u00e9n fiets meer fietsen.\",\r\n\r\n            helper:\r\n              \"Typ alleen het nieuwe woord.\",\r\n\r\n            stimulus:\r\n              \"fiets\",\r\n\r\n            correct:\r\n              \"fietsen\"\r\n\r\n          }\r\n\r\n        ]\r\n\r\n      }\r\n\r\n    ];\r\n\r\n\r\n    \/* =========================================\r\n       STATE\r\n    ========================================= *\/\r\n\r\n    let emLevelIndex=0;\r\n\r\n    let emQuestionIndex=0;\r\n\r\n    let emCorrect=0;\r\n\r\n    let emAnswered=false;\r\n\r\n\r\n    const emTotal=\r\n      emLevels.reduce(\r\n        function(total,level){\r\n\r\n          return total+\r\n            level.questions.length;\r\n\r\n        },\r\n        0\r\n      );\r\n\r\n\r\n    \/* =========================================\r\n       DOM\r\n    ========================================= *\/\r\n\r\n    const emLevelPill=\r\n      document.getElementById(\r\n        \"emLevelPill\"\r\n      );\r\n\r\n    const emQuestionCounter=\r\n      document.getElementById(\r\n        \"emQuestionCounter\"\r\n      );\r\n\r\n    const emProgressBar=\r\n      document.getElementById(\r\n        \"emProgressBar\"\r\n      );\r\n\r\n    const emQuestionType=\r\n      document.getElementById(\r\n        \"emQuestionType\"\r\n      );\r\n\r\n    const emQuestionTitle=\r\n      document.getElementById(\r\n        \"emQuestionTitle\"\r\n      );\r\n\r\n    const emHelper=\r\n      document.getElementById(\r\n        \"emHelper\"\r\n      );\r\n\r\n    const emStimulus=\r\n      document.getElementById(\r\n        \"emStimulus\"\r\n      );\r\n\r\n    const emAnswerArea=\r\n      document.getElementById(\r\n        \"emAnswerArea\"\r\n      );\r\n\r\n    const emFeedback=\r\n      document.getElementById(\r\n        \"emFeedback\"\r\n      );\r\n\r\n    const emNextWrap=\r\n      document.getElementById(\r\n        \"emNextWrap\"\r\n      );\r\n\r\n    const emNextBtn=\r\n      document.getElementById(\r\n        \"emNextBtn\"\r\n      );\r\n\r\n    const emSupport=\r\n      document.getElementById(\r\n        \"emSupport\"\r\n      );\r\n\r\n    const emIfiAvatar=\r\n      document.getElementById(\r\n        \"emIfiAvatar\"\r\n      );\r\n\r\n    const emIfiMessage=\r\n      document.getElementById(\r\n        \"emIfiMessage\"\r\n      );\r\n\r\n    const emExerciseContent=\r\n      document.getElementById(\r\n        \"emExerciseContent\"\r\n      );\r\n\r\n    const emTransition=\r\n      document.getElementById(\r\n        \"emTransition\"\r\n      );\r\n\r\n    const emTransitionTitle=\r\n      document.getElementById(\r\n        \"emTransitionTitle\"\r\n      );\r\n\r\n    const emTransitionText=\r\n      document.getElementById(\r\n        \"emTransitionText\"\r\n      );\r\n\r\n    const emStartNextLevel=\r\n      document.getElementById(\r\n        \"emStartNextLevel\"\r\n      );\r\n\r\n    const emFinish=\r\n      document.getElementById(\r\n        \"emFinish\"\r\n      );\r\n\r\n    const emResultText=\r\n      document.getElementById(\r\n        \"emResultText\"\r\n      );\r\n\r\n\r\n    \/* =========================================\r\n       HELPERS\r\n    ========================================= *\/\r\n\r\n    function emNormalize(value){\r\n\r\n      return String(value)\r\n        .trim()\r\n        .toLowerCase()\r\n        .replace(\/\\s+\/g,\" \");\r\n\r\n    }\r\n\r\n\r\n    function emShuffle(array){\r\n\r\n      return array\r\n        .map(\r\n          function(item){\r\n\r\n            return{\r\n              item:item,\r\n              sort:Math.random()\r\n            };\r\n\r\n          }\r\n        )\r\n\r\n        .sort(\r\n          function(a,b){\r\n\r\n            return a.sort-b.sort;\r\n\r\n          }\r\n        )\r\n\r\n        .map(\r\n          function(entry){\r\n\r\n            return entry.item;\r\n\r\n          }\r\n        );\r\n\r\n    }\r\n\r\n\r\n    emLevels.forEach(\r\n      function(level){\r\n\r\n        level.questions=\r\n          emShuffle(\r\n            level.questions\r\n          );\r\n\r\n      }\r\n    );\r\n\r\n\r\n    function emCompletedCount(){\r\n\r\n      let amount=0;\r\n\r\n\r\n      for(\r\n        let i=0;\r\n        i<emLevelIndex;\r\n        i++\r\n      ){\r\n\r\n        amount+=\r\n          emLevels[i]\r\n            .questions\r\n            .length;\r\n\r\n      }\r\n\r\n\r\n      return amount+\r\n        emQuestionIndex;\r\n\r\n    }\r\n\r\n\r\n    function emUpdateRoute(){\r\n\r\n      for(\r\n        let i=1;\r\n        i<=3;\r\n        i++\r\n      ){\r\n\r\n        const node=\r\n          document.getElementById(\r\n            \"emRoute\"+i\r\n          );\r\n\r\n\r\n        node.classList.remove(\r\n          \"active\",\r\n          \"done\"\r\n        );\r\n\r\n\r\n        if(\r\n          i-1 <\r\n          emLevelIndex\r\n        ){\r\n\r\n          node.classList.add(\r\n            \"done\"\r\n          );\r\n\r\n        }\r\n\r\n\r\n        if(\r\n          i-1 ===\r\n          emLevelIndex\r\n        ){\r\n\r\n          node.classList.add(\r\n            \"active\"\r\n          );\r\n\r\n        }\r\n\r\n      }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       IFI\r\n    ========================================= *\/\r\n\r\n    function emSetIfi(\r\n      role,\r\n      message\r\n    ){\r\n\r\n      emIfiAvatar.style.opacity=\r\n        \"0\";\r\n\r\n\r\n      emIfiAvatar.style.transform=\r\n        \"translateY(6px)\";\r\n\r\n\r\n      setTimeout(\r\n        function(){\r\n\r\n          emIfiAvatar.src=\r\n            EM_IFI[role];\r\n\r\n\r\n          emIfiMessage.textContent=\r\n            message;\r\n\r\n\r\n          emIfiAvatar.style.opacity=\r\n            \"1\";\r\n\r\n\r\n          emIfiAvatar.style.transform=\r\n            \"translateY(0)\";\r\n\r\n        },\r\n        150\r\n      );\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       ADAPTIVE EVENT\r\n    ========================================= *\/\r\n\r\n    function emEmit(\r\n      name,\r\n      detail\r\n    ){\r\n\r\n      window.dispatchEvent(\r\n\r\n        new CustomEvent(\r\n          name,\r\n          {\r\n            detail:detail\r\n          }\r\n        )\r\n\r\n      );\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       RENDER\r\n    ========================================= *\/\r\n\r\n    function emRender(){\r\n\r\n      emAnswered=false;\r\n\r\n\r\n      const level=\r\n        emLevels[\r\n          emLevelIndex\r\n        ];\r\n\r\n\r\n      const question=\r\n        level.questions[\r\n          emQuestionIndex\r\n        ];\r\n\r\n\r\n      emExerciseContent.style.display=\r\n        \"block\";\r\n\r\n\r\n      emTransition.style.display=\r\n        \"none\";\r\n\r\n\r\n      emFinish.style.display=\r\n        \"none\";\r\n\r\n\r\n      emLevelPill.textContent=\r\n        level.title;\r\n\r\n\r\n      const overall=\r\n        emCompletedCount()+1;\r\n\r\n\r\n      emQuestionCounter.textContent=\r\n        \"Vraag \"+\r\n        overall+\r\n        \" van \"+\r\n        emTotal;\r\n\r\n\r\n      emProgressBar.style.width=\r\n        Math.round(\r\n          (\r\n            emCompletedCount() \/\r\n            emTotal\r\n          ) * 100\r\n        )+\"%\";\r\n\r\n\r\n      emQuestionType.textContent=\r\n        question.label;\r\n\r\n\r\n      emQuestionTitle.textContent=\r\n        question.question;\r\n\r\n\r\n      emHelper.textContent=\r\n        question.helper || \"\";\r\n\r\n\r\n      emStimulus.textContent=\r\n        question.stimulus || \"\";\r\n\r\n\r\n      emStimulus.className=\r\n        \"em-stimulus\" +\r\n        (\r\n          question.stimulusClass\r\n            ? \" \"+question.stimulusClass\r\n            : \"\"\r\n        );\r\n\r\n\r\n      emFeedback.textContent=\r\n        \"\";\r\n\r\n\r\n      emFeedback.className=\r\n        \"em-feedback\";\r\n\r\n\r\n      emNextWrap.style.display=\r\n        \"none\";\r\n\r\n\r\n      emAnswerArea.innerHTML=\r\n        \"\";\r\n\r\n\r\n      \/* SUPPORT ALLEEN LEVEL 1 *\/\r\n\r\n      emSupport.style.display=\r\n        emLevelIndex===0\r\n\r\n        ? \"block\"\r\n\r\n        : \"none\";\r\n\r\n\r\n      \/* IFI *\/\r\n\r\n      if(\r\n        emLevelIndex===0\r\n      ){\r\n\r\n        emSetIfi(\r\n\r\n          \"uitleg\",\r\n\r\n          \"Kijk rustig naar het woord. Gaat het over \u00e9\u00e9n ding of over meer dan \u00e9\u00e9n?\"\r\n\r\n        );\r\n\r\n      }\r\n\r\n      else if(\r\n        emLevelIndex===1\r\n      ){\r\n\r\n        emSetIfi(\r\n\r\n          \"denken\",\r\n\r\n          \"Nu vergelijken we woorden. Kijk wat er verandert wanneer er meer dan \u00e9\u00e9n is.\"\r\n\r\n        );\r\n\r\n      }\r\n\r\n      else{\r\n\r\n        emSetIfi(\r\n\r\n          \"denken\",\r\n\r\n          \"Je bent bij Level 3. Probeer eerst zelf te bedenken hoe het woord verandert wanneer het er meer zijn.\"\r\n\r\n        );\r\n\r\n      }\r\n\r\n\r\n      \/* CHOICE *\/\r\n\r\n      if(\r\n        question.type===\r\n        \"choice\"\r\n      ){\r\n\r\n        const wrap=\r\n          document.createElement(\r\n            \"div\"\r\n          );\r\n\r\n\r\n        wrap.className=\r\n          \"em-antwoorden\";\r\n\r\n\r\n        emShuffle(\r\n          question.answers\r\n        )\r\n        .forEach(\r\n          function(answer){\r\n\r\n            const button=\r\n              document.createElement(\r\n                \"button\"\r\n              );\r\n\r\n\r\n            button.type=\r\n              \"button\";\r\n\r\n\r\n            button.className=\r\n              \"em-answer\";\r\n\r\n\r\n            button.textContent=\r\n              answer;\r\n\r\n\r\n            button.addEventListener(\r\n\r\n              \"click\",\r\n\r\n              function(){\r\n\r\n                emSubmit(\r\n                  answer,\r\n                  button\r\n                );\r\n\r\n              }\r\n\r\n            );\r\n\r\n\r\n            wrap.appendChild(\r\n              button\r\n            );\r\n\r\n          }\r\n        );\r\n\r\n\r\n        emAnswerArea.appendChild(\r\n          wrap\r\n        );\r\n\r\n      }\r\n\r\n\r\n      \/* TEXT *\/\r\n\r\n      if(\r\n        question.type===\r\n        \"text\"\r\n      ){\r\n\r\n        const wrap=\r\n          document.createElement(\r\n            \"div\"\r\n          );\r\n\r\n\r\n        wrap.className=\r\n          \"em-input-wrap\";\r\n\r\n\r\n        wrap.innerHTML=`\r\n\r\n          <input\r\n            type=\"text\"\r\n            class=\"em-input\"\r\n            id=\"emTextInput\"\r\n            autocomplete=\"off\"\r\n            autocapitalize=\"off\"\r\n            spellcheck=\"false\"\r\n            placeholder=\"Typ hier...\"\r\n          >\r\n\r\n          <button\r\n            type=\"button\"\r\n            class=\"em-check-btn\"\r\n            id=\"emCheckText\">\r\n\r\n            Nakijken \ud83c\udf3f\r\n\r\n          <\/button>\r\n\r\n        `;\r\n\r\n\r\n        emAnswerArea.appendChild(\r\n          wrap\r\n        );\r\n\r\n\r\n        const input=\r\n          document.getElementById(\r\n            \"emTextInput\"\r\n          );\r\n\r\n\r\n        document\r\n          .getElementById(\r\n            \"emCheckText\"\r\n          )\r\n          .addEventListener(\r\n\r\n            \"click\",\r\n\r\n            function(){\r\n\r\n              emSubmit(\r\n                input.value,\r\n                input\r\n              );\r\n\r\n            }\r\n\r\n          );\r\n\r\n\r\n        input.addEventListener(\r\n\r\n          \"keydown\",\r\n\r\n          function(event){\r\n\r\n            if(\r\n              event.key===\r\n              \"Enter\"\r\n            ){\r\n\r\n              emSubmit(\r\n                input.value,\r\n                input\r\n              );\r\n\r\n            }\r\n\r\n          }\r\n\r\n        );\r\n\r\n      }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       ANTWOORD\r\n    ========================================= *\/\r\n\r\n    function emSubmit(\r\n      value,\r\n      node\r\n    ){\r\n\r\n      if(\r\n        emAnswered\r\n      ){\r\n\r\n        return;\r\n\r\n      }\r\n\r\n\r\n      emAnswered=true;\r\n\r\n\r\n      const question=\r\n        emLevels[\r\n          emLevelIndex\r\n        ]\r\n        .questions[\r\n          emQuestionIndex\r\n        ];\r\n\r\n\r\n      const correct=\r\n        emNormalize(value) ===\r\n        emNormalize(\r\n          question.correct\r\n        );\r\n\r\n\r\n      if(\r\n        correct\r\n      ){\r\n\r\n        emCorrect++;\r\n\r\n\r\n        node.classList.add(\r\n          \"correct\"\r\n        );\r\n\r\n\r\n        const successTexts=[\r\n\r\n          \"Mooi gezien.\",\r\n\r\n          \"Ja, precies.\",\r\n\r\n          \"Dat klopt.\",\r\n\r\n          \"Goed gekeken.\"\r\n\r\n        ];\r\n\r\n\r\n        emFeedback.textContent=\r\n          successTexts[\r\n            Math.floor(\r\n              Math.random() *\r\n              successTexts.length\r\n            )\r\n          ];\r\n\r\n\r\n        emFeedback.className=\r\n          \"em-feedback good\";\r\n\r\n\r\n        const ifiSuccess=[\r\n\r\n          \"Mooi gezien. Ga maar rustig verder.\",\r\n\r\n          \"Ja, precies. Je zag goed of het \u00e9\u00e9n of meer is.\",\r\n\r\n          \"Dat klopt. Goed gekeken.\",\r\n\r\n          \"Precies. Je begint het verschil steeds beter te herkennen.\"\r\n\r\n        ];\r\n\r\n\r\n        emSetIfi(\r\n\r\n          \"goed\",\r\n\r\n          ifiSuccess[\r\n            Math.floor(\r\n              Math.random() *\r\n              ifiSuccess.length\r\n            )\r\n          ]\r\n\r\n        );\r\n\r\n      }\r\n\r\n      else{\r\n\r\n        node.classList.add(\r\n          \"try-again\"\r\n        );\r\n\r\n\r\n        emFeedback.textContent=\r\n          \"Kijk nog eens rustig. Het goede antwoord is: \"+\r\n          question.correct+\r\n          \".\";\r\n\r\n\r\n        emFeedback.className=\r\n          \"em-feedback retry\";\r\n\r\n\r\n        emSetIfi(\r\n\r\n          \"denken\",\r\n\r\n          emLevelIndex===0\r\n\r\n          ? \"Dat geeft niet. Vraag jezelf af: bedoelt dit woord \u00e9\u00e9n ding of meer dan \u00e9\u00e9n?\"\r\n\r\n          : \"Kijk nog eens naar het beginwoord. Wat verandert er wanneer er meer van zijn?\"\r\n\r\n        );\r\n\r\n      }\r\n\r\n\r\n      emAnswerArea\r\n        .querySelectorAll(\r\n          \"button,input\"\r\n        )\r\n        .forEach(\r\n          function(item){\r\n\r\n            item.disabled=true;\r\n\r\n          }\r\n        );\r\n\r\n\r\n      emNextWrap.style.display=\r\n        \"block\";\r\n\r\n\r\n      emEmit(\r\n\r\n        \"withifi:een-of-meer-answer\",\r\n\r\n        {\r\n\r\n          level:\r\n            emLevelIndex+1,\r\n\r\n          questionType:\r\n            question.type,\r\n\r\n          question:\r\n            question.question,\r\n\r\n          answer:\r\n            value,\r\n\r\n          expected:\r\n            question.correct,\r\n\r\n          isCorrect:\r\n            correct\r\n\r\n        }\r\n\r\n      );\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       NEXT\r\n    ========================================= *\/\r\n\r\n    function emNext(){\r\n\r\n      const level=\r\n        emLevels[\r\n          emLevelIndex\r\n        ];\r\n\r\n\r\n      emQuestionIndex++;\r\n\r\n\r\n      if(\r\n        emQuestionIndex <\r\n        level.questions.length\r\n      ){\r\n\r\n        emRender();\r\n\r\n        return;\r\n\r\n      }\r\n\r\n\r\n      if(\r\n        emLevelIndex <\r\n        emLevels.length-1\r\n      ){\r\n\r\n        emShowTransition();\r\n\r\n        return;\r\n\r\n      }\r\n\r\n\r\n      emComplete();\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       LEVEL OVERGANG\r\n    ========================================= *\/\r\n\r\n    function emShowTransition(){\r\n\r\n      emExerciseContent.style.display=\r\n        \"none\";\r\n\r\n\r\n      emTransition.style.display=\r\n        \"block\";\r\n\r\n\r\n      if(\r\n        emLevelIndex===0\r\n      ){\r\n\r\n        emTransitionTitle.textContent=\r\n          \"\ud83c\udf3f Klaar voor Level 2\";\r\n\r\n\r\n        emTransitionText.textContent=\r\n          \"Je kunt al herkennen of een woord over \u00e9\u00e9n of meer gaat. Nu gaan we enkelvoud en meervoud naast elkaar vergelijken.\";\r\n\r\n\r\n        emSetIfi(\r\n\r\n          \"uitleg\",\r\n\r\n          \"Nu kijken we wat er met een woord gebeurt als \u00e9\u00e9n ding er ineens meer worden.\"\r\n\r\n        );\r\n\r\n      }\r\n\r\n      else{\r\n\r\n        emTransitionTitle.textContent=\r\n          \"\ud83c\udf33 Klaar voor Level 3\";\r\n\r\n\r\n        emTransitionText.textContent=\r\n          \"Je kunt enkelvoud en meervoud al herkennen en vergelijken. Nu mag je zelf woorden veranderen.\";\r\n\r\n\r\n        emSetIfi(\r\n\r\n          \"goed\",\r\n\r\n          \"Ik zie dat je er klaar voor bent. Nu ga jij zelf van \u00e9\u00e9n meer maken.\"\r\n\r\n        );\r\n\r\n      }\r\n\r\n    }\r\n\r\n\r\n    function emNextLevel(){\r\n\r\n      emLevelIndex++;\r\n\r\n      emQuestionIndex=0;\r\n\r\n\r\n      emUpdateRoute();\r\n\r\n      emRender();\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       KLAAR\r\n    ========================================= *\/\r\n\r\n    function emComplete(){\r\n\r\n      emExerciseContent.style.display=\r\n        \"none\";\r\n\r\n\r\n      emTransition.style.display=\r\n        \"none\";\r\n\r\n\r\n      emFinish.style.display=\r\n        \"block\";\r\n\r\n\r\n      emProgressBar.style.width=\r\n        \"100%\";\r\n\r\n\r\n      const percentage=\r\n        Math.round(\r\n          (\r\n            emCorrect \/\r\n            emTotal\r\n          ) * 100\r\n        );\r\n\r\n\r\n      emResultText.innerHTML=\r\n\r\n        \"Je hebt alle drie de levels doorlopen.<br>\" +\r\n\r\n        \"Je had <strong>\" +\r\n        emCorrect +\r\n        \" van de \" +\r\n        emTotal +\r\n        \"<\/strong> opdrachten goed (\" +\r\n        percentage +\r\n        \"%).<br><br>\" +\r\n\r\n        \"Je hebt geoefend met \u00e9\u00e9n en meer herkennen, enkelvoud en meervoud vergelijken en zelf meervouden maken.\";\r\n\r\n\r\n      emSetIfi(\r\n\r\n        \"goed\",\r\n\r\n        \"Goed gedaan. Je hebt vandaag ontdekt hoe woorden kunnen veranderen wanneer het er meer zijn.\"\r\n\r\n      );\r\n\r\n\r\n      emEmit(\r\n\r\n        \"withifi:een-of-meer-complete\",\r\n\r\n        {\r\n\r\n          topic:\r\n            \"Een of meer\",\r\n\r\n          levelsCompleted:\r\n            3,\r\n\r\n          correct:\r\n            emCorrect,\r\n\r\n          total:\r\n            emTotal,\r\n\r\n          percentage:\r\n            percentage\r\n\r\n        }\r\n\r\n      );\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       OPNIEUW\r\n    ========================================= *\/\r\n\r\n    function emRestart(){\r\n\r\n      emLevelIndex=0;\r\n\r\n      emQuestionIndex=0;\r\n\r\n      emCorrect=0;\r\n\r\n      emAnswered=false;\r\n\r\n\r\n      emLevels.forEach(\r\n        function(level){\r\n\r\n          level.questions=\r\n            emShuffle(\r\n              level.questions\r\n            );\r\n\r\n        }\r\n      );\r\n\r\n\r\n      emUpdateRoute();\r\n\r\n\r\n      emSetIfi(\r\n\r\n        \"uitleg\",\r\n\r\n        \"We beginnen gewoon opnieuw. Kijk rustig: gaat het over \u00e9\u00e9n of meer?\"\r\n\r\n      );\r\n\r\n\r\n      emRender();\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================\r\n       EVENTS\r\n    ========================================= *\/\r\n\r\n    emNextBtn.addEventListener(\r\n      \"click\",\r\n      emNext\r\n    );\r\n\r\n\r\n    emStartNextLevel.addEventListener(\r\n      \"click\",\r\n      emNextLevel\r\n    );\r\n\r\n\r\n    document\r\n      .getElementById(\r\n        \"emRestartBtn\"\r\n      )\r\n      .addEventListener(\r\n        \"click\",\r\n        emRestart\r\n      );\r\n\r\n\r\n    \/* =========================================\r\n       START\r\n    ========================================= *\/\r\n\r\n    emUpdateRoute();\r\n\r\n    emRender();\r\n\r\n  }\r\n);\r\n<\/script>\r\n\r\n<!-- With Ifi centrale Sprint 2-runtime: Custom Code 4038 -->\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>\ud83c\udf4e Woordenwereld E\u00e9n of meer? Soms hebben we het over \u00e9\u00e9n ding. Soms zijn het er meer. Dan kan een woord veranderen. We gaan eerst rustig kijken naar het verschil en daarna steeds meer zelf oefenen. \ud83c\udf31 Level 1 \u00b7 Herkennen Kijken of een woord over \u00e9\u00e9n of meer gaat. \ud83c\udf3f Level 2 \u00b7 Vergelijken [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-966","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/966","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=966"}],"version-history":[{"count":43,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/966\/revisions"}],"predecessor-version":[{"id":4368,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/966\/revisions\/4368"}],"wp:attachment":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=966"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}