{"id":94,"date":"2026-07-26T16:30:54","date_gmt":"2026-07-26T16:30:54","guid":{"rendered":"https:\/\/youthdirection.com\/?page_id=94"},"modified":"2026-08-04T15:19:41","modified_gmt":"2026-08-04T15:19:41","slug":"ungeradsoversigt","status":"publish","type":"page","link":"https:\/\/youthdirection.com\/en\/ungeradsoversigt\/","title":{"rendered":"Unger\u00e5dsoversigt"},"content":{"rendered":"\n<div class=\"wp-block-columns alignwide ext-animate--on is-layout-flex wp-container-core-columns-is-layout-cb0a7ccb wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<!DOCTYPE html>\n<html lang=\"da\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>Youth Direction \u2014 Kommunale Unger\u00e5d<\/title>\n\n<!--\n  ================================================================\n  HURTIG GUIDE \u2014 de ting du oftest skal \u00e6ndre\n  ================================================================\n\n  1) SKIFTE LOGO\n     Find <img decoding=\"async\" src=\"...\"> under \"LOGO\" i den r\u00e6kke du vil \u00e6ndre.\n     Skift kun teksten inde i src=\"...\":\n\n       <img decoding=\"async\" src=\"eksempel-ungeraad-logo.png\" alt=\"...\">\n       skift til filnavnet p\u00e5 det nye billede (skal ligge i samme\n       mappe som denne fil).\n\n  2) S\u00c6TTE EN VIDEO IND\n     Find \"VIDEO-MODAL\" for den r\u00e6kke du vil \u00e6ndre, og inds\u00e6t et\n     YouTube-link i iframens src=\"...\". Brug \"embed\"-formen:\n\n       almindeligt link:  https:\/\/youtu.be\/QOtEMBdOKKk\n       embed-link:        https:\/\/www.youtube.com\/embed\/QOtEMBdOKKk\n\n     Det er den ENESTE ting du skal \u00e6ndre for at skifte video.\n\n  3) TILF\u00d8JE ET NYT UNGER\u00c5D\n     Kopi\u00e9r en hel blok mellem \"KOPI\u00c9R HERFRA\" og \"KOPI\u00c9R HERTIL\",\n     s\u00e6t den ind i .council-list, og udfyld dine egne data.\n     Husk: data-video-trigger p\u00e5 knappen og id p\u00e5 modalen skal\n     matche hinanden, og id'et skal v\u00e6re UNIKT for hver r\u00e6kke.\n  ================================================================\n-->\n\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Space+Grotesk:wght@500;700&#038;family=Inter:wght@400;500;600&#038;display=swap\" rel=\"stylesheet\">\n\n<style>\n  \/* ============================================================\n     DESIGN TOKENS \u2014 ret farverne her, s\u00e5 opdateres hele siden\n     ============================================================ *\/\n  :root{\n    --surface:   #18160F;\n    --surface-2: #201D14;\n    --red:       #FFBF00;\n    --red-soft:  #FFCD3C;\n    --red-dim:   rgba(255,191,0,0.16);\n    --cream:     #F6F2E7;\n    --muted:     #B3A79F;\n    --border:    rgba(246,242,231,0.08);\n\n    --font-display: 'Space Grotesk', sans-serif;\n    --font-body:    'Inter', sans-serif;\n  }\n\n  *{ box-sizing: border-box; }\n\n  body{\n    margin: 0;\n    font-family: var(--font-body);\n    color: var(--cream);\n  }\n\n  \/* Wrapper omkring listen \u2014 s\u00e6t baggrund\/luft HER i stedet for p\u00e5\n     <body>, s\u00e5 koden ikke p\u00e5virker resten af jeres side. Baggrunden\n     er gennemsigtig, s\u00e5 den passer ind i en eksisterende side. *\/\n  .council-section{\n    background: transparent;\n    padding: 64px 24px;\n  }\n\n  .council-section__header{\n    max-width: 860px;\n    margin: 0 auto 40px;\n    text-align: center;\n  }\n  .council-section__eyebrow{\n    font-family: var(--font-display);\n    font-size: 11px;\n    font-weight: 700;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    color: var(--red-soft);\n    margin: 0 0 10px;\n  }\n  .council-section__title{\n    font-family: var(--font-display);\n    font-size: 28px;\n    font-weight: 700;\n    color: var(--cream);\n    margin: 0 0 12px;\n  }\n  .council-section__intro{\n    font-size: 15px;\n    line-height: 1.6;\n    color: var(--muted);\n    margin: 0;\n  }\n\n  \/* Listen er vandret opbygget (r\u00e6kke for hvert unger\u00e5d) i stedet\n     for et kortgitter, s\u00e5 den adskiller sig fra samarbejdspartner-\n     oversigten. *\/\n  .council-list{\n    max-width: 860px;\n    margin: 0 auto;\n    display: flex;\n    flex-direction: column;\n    gap: 18px;\n  }\n\n  \/* ============================================================\n     ===========  KOPI\u00c9R HERFRA \u2014 \u00c9T UNGER\u00c5D  =====================\n     ============================================================ *\/\n  .council-row{\n    display: flex;\n    align-items: center;\n    gap: 20px;\n    background: var(--surface);\n    border: 1px solid var(--border);\n    border-radius: 14px;\n    padding: 20px 24px;\n    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;\n  }\n  .council-row:hover{\n    transform: translateX(4px);\n    border-color: var(--red-dim);\n    box-shadow: 0 18px 40px -22px rgba(0,0,0,0.65);\n  }\n\n  .council-row__logo{\n    flex: 0 0 auto;\n    width: 64px;\n    height: 64px;\n    border-radius: 12px;\n    background: #FFFFFF;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    border: 1px solid var(--border);\n  }\n  .council-row__logo img{\n    width: 100%;\n    height: 100%;\n    object-fit: contain;\n    padding: 8px;\n  }\n\n  .council-row__body{\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n  .council-row__eyebrow{\n    font-family: var(--font-display);\n    font-size: 10px;\n    font-weight: 700;\n    letter-spacing: 0.09em;\n    text-transform: uppercase;\n    color: var(--red-soft);\n    margin: 0 0 4px;\n  }\n  .council-row__name{\n    font-family: var(--font-display);\n    font-size: 17px;\n    font-weight: 700;\n    color: var(--cream);\n    margin: 0 0 6px;\n  }\n  .council-row__desc{\n    font-size: 13.5px;\n    line-height: 1.5;\n    color: var(--muted);\n    margin: 0 0 10px;\n  }\n  .council-row__tags{\n    display: flex;\n    flex-wrap: wrap;\n    gap: 6px;\n  }\n  .council-row__tags span{\n    font-size: 11px;\n    font-weight: 500;\n    color: var(--red-soft);\n    background: var(--red-dim);\n    border: 1px solid rgba(255,191,0,0.28);\n    padding: 4px 10px;\n    border-radius: 999px;\n    white-space: nowrap;\n  }\n\n  .council-row__actions{\n    flex: 0 0 auto;\n    display: flex;\n    flex-direction: column;\n    align-items: stretch;\n    gap: 8px;\n  }\n  .council-row__site{\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 6px;\n    font-family: var(--font-body);\n    font-weight: 600;\n    font-size: 12.5px;\n    color: #2A0808;\n    background: var(--red);\n    padding: 9px 14px;\n    border-radius: 999px;\n    text-decoration: none;\n    white-space: nowrap;\n    transition: background .25s ease;\n  }\n  .council-row__site:hover{ background: var(--red-soft); }\n  .council-row__site svg{ width: 12px; height: 12px; flex-shrink: 0; }\n\n  .council-row__video-btn{\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 6px;\n    font-family: var(--font-body);\n    font-weight: 600;\n    font-size: 12.5px;\n    color: var(--red-soft);\n    background: transparent;\n    border: 1px solid var(--red-dim);\n    padding: 8px 14px;\n    border-radius: 999px;\n    cursor: pointer;\n    white-space: nowrap;\n    transition: border-color .25s ease, background .25s ease;\n  }\n  .council-row__video-btn:hover{\n    border-color: var(--red);\n    background: var(--red-dim);\n  }\n  .council-row__video-btn svg{ width: 11px; height: 11px; flex-shrink: 0; }\n\n  @media (max-width: 560px){\n    .council-row{\n      flex-wrap: wrap;\n    }\n    .council-row__actions{\n      flex-direction: row;\n      width: 100%;\n      padding-top: 12px;\n      border-top: 1px solid var(--border);\n    }\n    .council-row__site,\n    .council-row__video-btn{ flex: 1; }\n  }\n  \/* ============================================================\n     ===========  KOPI\u00c9R HERTIL  ===============\n     ============================================================ *\/\n\n  \/* ============================================================\n     VIDEO-MODAL \u2014 f\u00e6lles for alle r\u00e6kker, skal kun med \u00c9N gang\n     ============================================================ *\/\n  .video-modal-overlay{\n    position: fixed;\n    inset: 0;\n    background: rgba(8,7,4,0.8);\n    backdrop-filter: blur(6px);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 24px;\n    opacity: 0;\n    pointer-events: none;\n    transition: opacity .3s ease;\n    z-index: 999;\n  }\n  .video-modal-overlay.is-open{\n    opacity: 1;\n    pointer-events: auto;\n  }\n  .video-modal{\n    width: 100%;\n    max-width: 720px;\n    background: var(--surface);\n    border: 1px solid var(--border);\n    border-radius: 18px;\n    overflow: hidden;\n    transform: scale(.94);\n    transition: transform .3s ease;\n  }\n  .video-modal-overlay.is-open .video-modal{\n    transform: scale(1);\n  }\n  .video-modal__header{\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 14px 18px;\n    border-bottom: 1px solid var(--border);\n  }\n  .video-modal__title{\n    font-family: var(--font-display);\n    font-weight: 700;\n    font-size: 14px;\n    color: var(--cream);\n    margin: 0;\n  }\n  .video-modal__close{\n    width: 32px;\n    height: 32px;\n    border-radius: 50%;\n    border: 1px solid var(--border);\n    background: var(--surface-2);\n    color: var(--muted);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    transition: color .2s ease, border-color .2s ease;\n  }\n  .video-modal__close:hover{\n    color: var(--red-soft);\n    border-color: var(--red);\n  }\n  .video-modal__close svg{ width: 14px; height: 14px; }\n  .video-modal__body{\n    position: relative;\n    width: 100%;\n    aspect-ratio: 16 \/ 9;\n    background: #000;\n  }\n  .video-modal__body video,\n  .video-modal__body iframe{\n    width: 100%;\n    height: 100%;\n    display: block;\n    border: 0;\n  }\n\n<\/style>\n<\/head>\n<body>\n\n  <div class=\"council-section\">\n\n    <div class=\"council-section__header\">\n      <p class=\"council-section__eyebrow\">Kommunale Unger\u00e5d<\/p>\n      <h2 class=\"council-section__title\">Unger\u00e5d vi samarbejder med<\/h2>\n      <p class=\"council-section__intro\">\n        Kommunale unger\u00e5d er unges taler\u00f8r ind i kommunalpolitik. Herunder finder du en oversigt over de unger\u00e5d, Youth Direction samarbejder med.\n      <\/p>\n    <\/div>\n\n    <div class=\"council-list\">\n\n      <!-- ============================================================\n           UNGER\u00c5D #1 \u2014 kopi\u00e9r denne <article>...<\/article>-blok for\n           hvert unger\u00e5d og udfyld dine egne data.\n           ============================================================ -->\n      <article class=\"council-row\">\n        <div class=\"council-row__logo\">\n          <!-- \ud83d\udc49 LOGO -->\n          <img decoding=\"async\" src=\"eksempel-ungeraad-logo.png\" alt=\"Eksempel Kommunes Unger\u00e5d logo\">\n        <\/div>\n\n        <div class=\"council-row__body\">\n          <p class=\"council-row__eyebrow\">Kommunalt Unger\u00e5d<\/p>\n          <!-- NAVN -->\n          <h3 class=\"council-row__name\">Eksempel Kommunes Unger\u00e5d<\/h3>\n          <!-- BESKRIVELSE -->\n          <p class=\"council-row__desc\">\n            Taler\u00f8r for kommunens unge, som r\u00e5dgiver kommunalbestyrelsen om ungdomsrelaterede beslutninger.\n          <\/p>\n          <!-- INTERESSER: tilf\u00f8j\/fjern <span> efter behov -->\n          <div class=\"council-row__tags\">\n            <span>Medborgerskab<\/span>\n            <span>Ungdomspolitik<\/span>\n            <span>Lokaldemokrati<\/span>\n          <\/div>\n        <\/div>\n\n        <div class=\"council-row__actions\">\n          <!-- skift href til unger\u00e5dets hjemmeside -->\n          <a class=\"council-row__site\" href=\"https:\/\/eksempel-ungeraad.dk\" target=\"_blank\" rel=\"noopener\">\n            Hjemmeside\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M7 17L17 7\"\/><path d=\"M8 7h9v9\"\/><\/svg>\n          <\/a>\n          <!-- data-video-trigger skal matche id'et p\u00e5 modalen nedenfor -->\n          <button class=\"council-row__video-btn\" type=\"button\" data-video-trigger=\"video-eksempel-ungeraad\" aria-label=\"Se video om Eksempel Kommunes Unger\u00e5d\">\n            <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M8 5v14l11-7L8 5z\"\/><\/svg>\n            Video\n          <\/button>\n        <\/div>\n      <\/article>\n\n      <!-- VIDEO-MODAL til dette unger\u00e5d \u2014 id skal v\u00e6re UNIKT -->\n      <div class=\"video-modal-overlay\" id=\"video-eksempel-ungeraad\">\n        <div class=\"video-modal\">\n          <div class=\"video-modal__header\">\n            <p class=\"video-modal__title\">Eksempel Kommunes Unger\u00e5d<\/p>\n            <button class=\"video-modal__close\" type=\"button\" aria-label=\"Luk video\">\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\"><path d=\"M6 6l12 12M18 6L6 18\"\/><\/svg>\n            <\/button>\n          <\/div>\n          <div class=\"video-modal__body\">\n            <!-- \ud83d\udc49 VIDEO: inds\u00e6t YouTube-embed-link her -->\n            <iframe src=\"https:\/\/www.youtube.com\/embed\/DIN_VIDEO_ID\" title=\"Eksempel Kommunes Unger\u00e5d video\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n          <\/div>\n        <\/div>\n      <\/div>\n      <!-- ============================================================\n           SLUT P\u00c5 UNGER\u00c5D #1\n           ============================================================ -->\n\n\n      <!-- Eksempel #2, s\u00e5 du kan se listen med flere r\u00e6kker under hinanden -->\n      <article class=\"council-row\">\n        <div class=\"council-row__logo\">\n          <img decoding=\"async\" src=\"anden-kommune-ungeraad-logo.png\" alt=\"Anden Kommunes Unger\u00e5d logo\">\n        <\/div>\n\n        <div class=\"council-row__body\">\n          <p class=\"council-row__eyebrow\">Kommunalt Unger\u00e5d<\/p>\n          <h3 class=\"council-row__name\">Anden Kommunes Unger\u00e5d<\/h3>\n          <p class=\"council-row__desc\">\n            R\u00e5dgiver kommunalbestyrelsen og arrangerer aktiviteter for kommunens unge.\n          <\/p>\n          <div class=\"council-row__tags\">\n            <span>Deltagelse<\/span>\n            <span>Unges trivsel<\/span>\n          <\/div>\n        <\/div>\n\n        <div class=\"council-row__actions\">\n          <a class=\"council-row__site\" href=\"https:\/\/anden-ungeraad.dk\" target=\"_blank\" rel=\"noopener\">\n            Hjemmeside\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M7 17L17 7\"\/><path d=\"M8 7h9v9\"\/><\/svg>\n          <\/a>\n          <button class=\"council-row__video-btn\" type=\"button\" data-video-trigger=\"video-anden-ungeraad\" aria-label=\"Se video om Anden Kommunes Unger\u00e5d\">\n            <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M8 5v14l11-7L8 5z\"\/><\/svg>\n            Video\n          <\/button>\n        <\/div>\n      <\/article>\n\n      <div class=\"video-modal-overlay\" id=\"video-anden-ungeraad\">\n        <div class=\"video-modal\">\n          <div class=\"video-modal__header\">\n            <p class=\"video-modal__title\">Anden Kommunes Unger\u00e5d<\/p>\n            <button class=\"video-modal__close\" type=\"button\" aria-label=\"Luk video\">\n              <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\"><path d=\"M6 6l12 12M18 6L6 18\"\/><\/svg>\n            <\/button>\n          <\/div>\n          <div class=\"video-modal__body\">\n            <iframe src=\"https:\/\/www.youtube.com\/embed\/dQw4w9WgXcQ\" title=\"Anden Kommunes Unger\u00e5d video\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n\n  <script>\n    \/\/ \u00c5bn modal ved klik p\u00e5 videoikon\n    document.querySelectorAll('[data-video-trigger]').forEach(function(btn){\n      btn.addEventListener('click', function(){\n        var modal = document.getElementById(btn.dataset.videoTrigger);\n        if(!modal) return;\n        modal.classList.add('is-open');\n        document.body.style.overflow = 'hidden';\n      });\n    });\n\n    \/\/ Luk modal (krydset, klik udenfor, eller Escape) + stop video\n    document.querySelectorAll('.video-modal-overlay').forEach(function(overlay){\n      function closeModal(){\n        overlay.classList.remove('is-open');\n        document.body.style.overflow = '';\n        var video = overlay.querySelector('video');\n        if(video){ video.pause(); video.currentTime = 0; }\n        var iframe = overlay.querySelector('iframe');\n        if(iframe){ iframe.src = iframe.src; } \/\/ genindl\u00e6s for at stoppe YouTube-afspilning\n      }\n      overlay.querySelector('.video-modal__close').addEventListener('click', closeModal);\n      overlay.addEventListener('click', function(e){\n        if(e.target === overlay) closeModal();\n      });\n      document.addEventListener('keydown', function(e){\n        if(e.key === 'Escape') closeModal();\n      });\n    });\n  <\/script>\n\n<\/body>\n<\/html>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:37px\" aria-hidden=\"true\" class=\"wp-block-spacer ext-animate--on\"><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Youth Direction \u2014 Kommunale Unger\u00e5d Kommunale Unger\u00e5d Unger\u00e5d vi samarbejder med Kommunale unger\u00e5d er unges taler\u00f8r ind i kommunalpolitik. Herunder finder du en oversigt over de unger\u00e5d, Youth Direction samarbejder med. Kommunalt Unger\u00e5d Eksempel Kommunes Unger\u00e5d Taler\u00f8r for kommunens unge, som r\u00e5dgiver kommunalbestyrelsen om ungdomsrelaterede beslutninger. Medborgerskab Ungdomspolitik Lokaldemokrati Hjemmeside Video Eksempel Kommunes Unger\u00e5d Kommunalt [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-with-title","meta":{"inline_featured_image":false,"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-94","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/pages\/94","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/comments?post=94"}],"version-history":[{"count":6,"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/pages\/94\/revisions"}],"predecessor-version":[{"id":349,"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/pages\/94\/revisions\/349"}],"wp:attachment":[{"href":"https:\/\/youthdirection.com\/en\/wp-json\/wp\/v2\/media?parent=94"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}