{"id":938,"date":"2026-07-18T19:19:23","date_gmt":"2026-07-18T19:19:23","guid":{"rendered":"https:\/\/dt4dp.eu\/?page_id=938"},"modified":"2026-08-15T14:53:12","modified_gmt":"2026-08-15T14:53:12","slug":"gallery","status":"publish","type":"page","link":"https:\/\/dt4dp.eu\/?page_id=938","title":{"rendered":"Gallery"},"content":{"rendered":"\n<style data-wp-block-html=\"css\">\n\/* =====================================================\n   DT4DP - VIDEO GALLERY\n===================================================== *\/\n\n.dt4dp-gallery {\n    --petrol:#183f46;\n    --petrol2:#285d65;\n    --blue:#2589c9;\n    --lightblue:#5bc0de;\n    --terracotta:#b7654a;\n    --gold:#d5ad5c;\n    --cream:#fbf8f2;\n    --soft:#f5f1e9;\n    --text:#354249;\n    --muted:#6e797d;\n    --line:#e7dfd2;\n\n    max-width:1180px;\n    margin:0 auto 50px;\n\n    color:var(--text);\n    font-family:inherit;\n}\n\n.dt4dp-gallery *,\n.dt4dp-gallery *::before,\n.dt4dp-gallery *::after {\n    box-sizing:border-box;\n}\n\n\n\/* HERO *\/\n\n.dt4dp-gallery-hero {\n    position:relative;\n    overflow:hidden;\n\n    margin-bottom:24px;\n    padding:58px 52px;\n\n    border-radius:24px;\n\n    background:\n        radial-gradient(\n            circle at 88% 12%,\n            rgba(91,192,222,.25),\n            transparent 30%\n        ),\n        radial-gradient(\n            circle at 10% 100%,\n            rgba(213,173,92,.16),\n            transparent 30%\n        ),\n        linear-gradient(\n            135deg,\n            #183f46 0%,\n            #285d65 100%\n        );\n\n    box-shadow:0 16px 42px rgba(24,63,70,.15);\n}\n\n.dt4dp-gallery-hero::after {\n    content:\"VIDEO\";\n\n    position:absolute;\n    right:20px;\n    bottom:-18px;\n\n    color:rgba(255,255,255,.045);\n\n    font-size:100px;\n    line-height:1;\n    font-weight:900;\n}\n\n.dt4dp-gallery-kicker {\n    position:relative;\n    z-index:2;\n\n    display:inline-block;\n\n    margin-bottom:16px;\n    padding:6px 11px;\n\n    border:1px solid rgba(255,255,255,.22);\n    border-radius:999px;\n\n    background:rgba(255,255,255,.08);\n    color:#fff;\n\n    font-size:10px;\n    font-weight:800;\n    letter-spacing:1px;\n}\n\n.dt4dp-gallery-hero h1 {\n    position:relative;\n    z-index:2;\n\n    margin:0 0 18px !important;\n\n    color:#fff !important;\n\n    font-size:clamp(38px,5vw,56px) !important;\n    line-height:1.08 !important;\n    font-weight:850 !important;\n}\n\n.dt4dp-gallery-hero h1 span {\n    color:#8ed8f8;\n}\n\n.dt4dp-gallery-hero p {\n    position:relative;\n    z-index:2;\n\n    max-width:900px;\n    margin:0 !important;\n\n    color:rgba(255,255,255,.86) !important;\n\n    font-size:16px !important;\n    line-height:1.75 !important;\n}\n\n\n\/* INTRO *\/\n\n.dt4dp-gallery-intro {\n    margin-bottom:24px;\n    padding:30px 32px;\n\n    border:1px solid var(--line);\n    border-radius:20px;\n\n    background:var(--cream);\n}\n\n.dt4dp-gallery-intro > span {\n    display:block;\n\n    margin-bottom:7px;\n\n    color:var(--terracotta);\n\n    font-size:10px;\n    font-weight:850;\n    letter-spacing:1px;\n}\n\n.dt4dp-gallery-intro h2 {\n    margin:0 0 9px !important;\n\n    color:var(--petrol) !important;\n\n    font-size:29px !important;\n    font-weight:850 !important;\n}\n\n.dt4dp-gallery-intro p {\n    margin:0 !important;\n\n    color:var(--muted) !important;\n\n    font-size:14.5px !important;\n    line-height:1.7 !important;\n}\n\n\n\/* VIDEO GRID *\/\n\n.dt4dp-video-grid {\n    display:grid;\n    grid-template-columns:repeat(2,minmax(0,1fr));\n    gap:18px;\n\n    margin-bottom:24px;\n}\n\n\n\/* CARD *\/\n\n.dt4dp-video-card {\n    overflow:hidden;\n\n    border:1px solid var(--line);\n    border-radius:18px;\n\n    background:#ffffff;\n\n    box-shadow:0 8px 22px rgba(24,63,70,.06);\n\n    transition:\n        transform .2s ease,\n        box-shadow .2s ease;\n}\n\n.dt4dp-video-card:hover {\n    transform:translateY(-4px);\n\n    box-shadow:0 14px 30px rgba(24,63,70,.11);\n}\n\n\n\/* VIDEO *\/\n\n.dt4dp-video-frame {\n    position:relative;\n\n    width:100%;\n    padding-top:56.25%;\n\n    overflow:hidden;\n\n    background:#101820;\n}\n\n.dt4dp-video-frame iframe {\n    position:absolute;\n    inset:0;\n\n    width:100%;\n    height:100%;\n\n    border:0;\n}\n\n\n\/* VIDEO INFO *\/\n\n.dt4dp-video-info {\n    padding:18px 20px 20px;\n}\n\n.dt4dp-video-info span {\n    display:block;\n\n    margin-bottom:5px;\n\n    color:var(--blue);\n\n    font-size:9px;\n    font-weight:850;\n    letter-spacing:1px;\n}\n\n.dt4dp-video-info h3 {\n    margin:0 !important;\n\n    color:var(--petrol) !important;\n\n    font-size:17px !important;\n    font-weight:850 !important;\n}\n\n\n\/* CLOSING *\/\n\n.dt4dp-gallery-closing {\n    padding:35px;\n\n    border-radius:20px;\n\n    background:\n        radial-gradient(\n            circle at 90% 15%,\n            rgba(91,192,222,.20),\n            transparent 30%\n        ),\n        var(--petrol);\n}\n\n.dt4dp-gallery-closing h2 {\n    margin:0 0 10px !important;\n\n    color:#ffffff !important;\n\n    font-size:28px !important;\n    font-weight:850 !important;\n}\n\n.dt4dp-gallery-closing p {\n    max-width:920px;\n\n    margin:0 !important;\n\n    color:rgba(255,255,255,.84) !important;\n\n    font-size:15px !important;\n    line-height:1.7 !important;\n}\n\n\n\/* TABLET *\/\n\n@media screen and (max-width:850px) {\n\n    .dt4dp-video-grid {\n        grid-template-columns:1fr;\n    }\n\n}\n\n\n\/* MOBILE *\/\n\n@media screen and (max-width:600px) {\n\n    .dt4dp-gallery-hero {\n        padding:38px 22px;\n        border-radius:18px;\n    }\n\n    .dt4dp-gallery-hero h1 {\n        font-size:35px !important;\n    }\n\n    .dt4dp-gallery-intro,\n    .dt4dp-gallery-closing {\n        padding:23px 20px;\n    }\n\n    .dt4dp-video-card {\n        border-radius:15px;\n    }\n\n    .dt4dp-video-info {\n        padding:15px 16px 17px;\n    }\n\n}\n<\/style>\n\n<div class=\"dt4dp-gallery\">\n\n    <section class=\"dt4dp-gallery-hero\">\n\n        <span class=\"dt4dp-gallery-kicker\">\n            DT4DP \u00b7 VIDEO GALLERY\n        <\/span>\n\n        <h1>\n            Explore the\n            <span>DT4DP Journey<\/span>\n        <\/h1>\n\n        <p>\n            Discover moments from the DT4DP project through videos highlighting\n            learning activities, collaboration, creative practice and the use\n            of digital technologies in vocational education.\n        <\/p>\n\n    <\/section>\n\n\n    <section class=\"dt4dp-gallery-intro\">\n\n        <span>PROJECT MOMENTS<\/span>\n\n        <h2>Watch the DT4DP activities<\/h2>\n\n        <p>\n            Browse the video gallery to explore project experiences,\n            workshops, learning activities and the connection between\n            decorative painting and digital innovation.\n        <\/p>\n\n    <\/section>\n\n\n    <section class=\"dt4dp-video-grid\">\n\n        <!-- 1 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/teSLZP-v9hE\"\n                    title=\"DT4DP Video 1\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 01<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 2 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/GGBjNQAukSE\"\n                    title=\"DT4DP Video 2\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 02<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 3 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/HjHO9iQ_ebQ\"\n                    title=\"DT4DP Video 3\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 03<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 4 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/gWzNvZb6hOU\"\n                    title=\"DT4DP Video 4\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 04<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 5 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/YQ3pX0fJZzE\"\n                    title=\"DT4DP Video 5\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 05<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 6 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/u3EeAS0mFZk\"\n                    title=\"DT4DP Video 6\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 06<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 7 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/vs2DmPqBSsM\"\n                    title=\"DT4DP Video 7\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 07<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 8 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/T6a8E0yYtW0\"\n                    title=\"DT4DP Video 8\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 08<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 9 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/w9m3Wn6UUb4\"\n                    title=\"DT4DP Video 9\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 09<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 10 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/hYi276cy4Gg\"\n                    title=\"DT4DP Video 10\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 10<\/h3>\n            <\/div>\n        <\/article>\n\n\n        <!-- 11 -->\n        <article class=\"dt4dp-video-card\">\n            <div class=\"dt4dp-video-frame\">\n                <iframe\n                    src=\"https:\/\/www.youtube.com\/embed\/0Rew55qGulQ\"\n                    title=\"DT4DP Video 11\"\n                    allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n                    allowfullscreen>\n                <\/iframe>\n            <\/div>\n            <div class=\"dt4dp-video-info\">\n                <span>DT4DP VIDEO<\/span>\n                <h3>Project Activity 11<\/h3>\n            <\/div>\n        <\/article>\n\n    <\/section>\n\n\n    <section class=\"dt4dp-gallery-closing\">\n\n        <h2>Craftsmanship \u00b7 Collaboration \u00b7 Digital Innovation<\/h2>\n\n        <p>\n            The DT4DP video gallery documents the project\u2019s learning journey\n            and showcases how hands-on vocational education can connect\n            traditional decorative arts with emerging digital technologies.\n        <\/p>\n\n    <\/section>\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>DT4DP \u00b7 VIDEO GALLERY Explore the DT4DP Journey Discover moments from the DT4DP project through videos highlighting learning activities, collaboration, creative practice and the use of digital technologies in vocational education. PROJECT MOMENTS Watch the DT4DP activities Browse the video<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-938","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dt4dp.eu\/index.php?rest_route=\/wp\/v2\/pages\/938","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dt4dp.eu\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dt4dp.eu\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dt4dp.eu\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dt4dp.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=938"}],"version-history":[{"count":4,"href":"https:\/\/dt4dp.eu\/index.php?rest_route=\/wp\/v2\/pages\/938\/revisions"}],"predecessor-version":[{"id":1025,"href":"https:\/\/dt4dp.eu\/index.php?rest_route=\/wp\/v2\/pages\/938\/revisions\/1025"}],"wp:attachment":[{"href":"https:\/\/dt4dp.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=938"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}