{"id":465530,"date":"2026-09-18T19:39:45","date_gmt":"2026-09-18T11:39:45","guid":{"rendered":"https:\/\/library.usj.edu.mo\/?p=465530"},"modified":"2026-09-29T19:47:30","modified_gmt":"2026-09-29T11:47:30","slug":"mangrove-painting-workshop","status":"publish","type":"post","link":"https:\/\/library.usj.edu.mo\/zh\/mangrove-painting-workshop\/","title":{"rendered":"Mangrove Painting Workshop"},"content":{"rendered":"<!-- =========================================================\n     USJ LIBRARY\n     MANGROVE PAINTING WORKSHOP\n     SECTION 1 \u2014 HERO + EVENT INFORMATION\n     ========================================================= -->\n\n\n\n\n<section class=\"usj-mangrove-hero\">\n\n    <div class=\"usj-mangrove-hero-main\">\n\n        <div class=\"usj-mangrove-container\">\n\n            <div class=\"usj-mangrove-hero-grid\">\n\n\n                <!-- =================================================\n                     LEFT \u2014 EVENT BRANDING\n                     ================================================= -->\n\n                <div>\n\n                    <div class=\"usj-mangrove-brand\">\n\n                        <span class=\"usj-mangrove-brand-name\">\n                            \u8056\u82e5\u745f\u5927\u5b78\u5716\u66f8\u9928\n                        <\/span>\n\n                        <span class=\"usj-mangrove-brand-line\" aria-hidden=\"true\">\n                        <\/span>\n\n                    <\/div>\n\n\n                    <div class=\"usj-mangrove-eyebrow\">\n\n                        \ud83c\udf3f\n                        Mangrove Guardians\n\n                    <\/div>\n\n\n                    <h1>\n                        Mangrove\n                        <br>\n                        Painting\n                        <br>\n                        Workshop\n                    <\/h1>\n\n\n                    <div class=\"usj-mangrove-title-cn\">\n                        \u7d05\u6a39\u6797\u5b88\u8b77\u8005\n                    <\/div>\n\n\n                    <div class=\"usj-mangrove-workshop-title\">\n\n                        3D MODEL PAINTING WORKSHOP\n\n                    <\/div>\n\n\n                    <p class=\"usj-mangrove-hero-description\">\n\n                        Unwind, create and connect with nature.\n                        Join us for a hands-on painting session\n                        inspired by the unique beauty and biodiversity\n                        of mangrove ecosystems.\n\n                    <\/p>\n\n                <\/div>\n\n\n                <!-- =================================================\n                     RIGHT \u2014 EVENT DETAILS\n                     ================================================= -->\n\n                <div class=\"usj-mangrove-info-card\">\n\n\n                    <div class=\"usj-mangrove-date\">\n\n                        <span class=\"usj-mangrove-date-label\">\n                            Event Date\n                        <\/span>\n\n                        September 23, 2026\n\n                    <\/div>\n\n\n                    <div class=\"usj-mangrove-info-row\">\n\n                        <div class=\"usj-mangrove-info-icon\" aria-hidden=\"true\">\n\n                            \ud83d\udd50\n\n                        <\/div>\n\n                        <div>\n\n                            <span class=\"usj-mangrove-info-label\">\n                                \u300a\u6642\u4ee3\u300b\n                            <\/span>\n\n                            <div class=\"usj-mangrove-info-value\">\n                                16:00 \u2013 17:00\n                            <\/div>\n\n                        <\/div>\n\n                    <\/div>\n\n\n                    <div class=\"usj-mangrove-info-row\">\n\n                        <div class=\"usj-mangrove-info-icon\" aria-hidden=\"true\">\n\n                            \ud83d\udccd\n\n                        <\/div>\n\n                        <div>\n\n                            <span class=\"usj-mangrove-info-label\">\n                                \u5730\u5740\n                            <\/span>\n\n                            <div class=\"usj-mangrove-info-value\">\n\n                                \u9752\u6d32\u6821\u5340\n                                <br>\n                                Classroom 101\n\n                            <\/div>\n\n                        <\/div>\n\n                    <\/div>\n\n\n                    <div class=\"usj-mangrove-info-row\">\n\n                        <div class=\"usj-mangrove-info-icon\" aria-hidden=\"true\">\n\n                            \ud83c\udf93\n\n                        <\/div>\n\n                        <div>\n\n                            <span class=\"usj-mangrove-info-label\">\n                                Target Audience\n                            <\/span>\n\n                            <div class=\"usj-mangrove-info-value\">\n                                USJ Students\n                            <\/div>\n\n                        <\/div>\n\n                    <\/div>\n\n\n                    <a class=\"usj-mangrove-register\" href=\"https:\/\/forms.gle\/egGwP66vVXH3M8ox8\" target=\"_blank\" rel=\"noopener\">\n\n                        REGISTER NOW \u2192\n\n                    <\/a>\n\n\n                <\/div>\n\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n\n<!-- =========================================================\n     USJ LIBRARY\n     MANGROVE PAINTING WORKSHOP\n     SECTION 2 \u2014 OVERVIEW + WHAT TO EXPECT\n     ========================================================= -->\n\n\n\n\n<section class=\"usj-mangrove-content\">\n\n    <div class=\"usj-mangrove-content-inner\">\n\n\n        <!-- =================================================\n             OVERVIEW\n             ================================================= -->\n\n        <div class=\"usj-mangrove-label\">\n            About the workshop\n        <\/div>\n\n\n        <h2>\n            Create. Relax. Connect with nature.\n        <\/h2>\n\n\n        <p class=\"usj-mangrove-intro\">\n\n            Take a break from your studies and express your creativity\n            through art inspired by the mangrove ecosystem.\n\n        <\/p>\n\n\n        <div class=\"usj-mangrove-overview\">\n\n\n            <div class=\"usj-mangrove-overview-main\">\n\n                <h3>\n                    What is the workshop about?\n                <\/h3>\n\n                <p>\n\n                    Unwind and express your creativity at the\n                    Mangrove Painting Workshop. Designed specifically\n                    for students, this hands-on session combines\n                    artistic expression with an appreciation for\n                    coastal ecosystems.\n\n                    <br><br>\n\n                    Participants will learn basic painting techniques\n                    to capture the unique roots, vibrant foliage,\n                    and rich biodiversity of mangrove habitats.\n\n                <\/p>\n\n            <\/div>\n\n\n            <div class=\"usj-mangrove-fact\">\n\n                <h3>\n                    \ud83c\udf3f Inspired by the mangrove\n                <\/h3>\n\n                <p>\n\n                    Explore the textures, shapes and colours of\n                    mangrove landscapes while creating your own\n                    artwork to take home.\n\n                <\/p>\n\n            <\/div>\n\n\n        <\/div>\n\n\n        <!-- =================================================\n             WHAT TO EXPECT\n             ================================================= -->\n\n        <div class=\"usj-mangrove-expect\">\n\n\n            <div class=\"usj-mangrove-label\">\n                Your workshop experience\n            <\/div>\n\n\n            <h2>\n                What to expect\n            <\/h2>\n\n\n            <div class=\"usj-mangrove-expect-grid\">\n\n\n                <!-- CARD 1 -->\n\n                <article class=\"usj-mangrove-expect-card\">\n\n                    <div\n                        class=\"usj-mangrove-expect-icon\"\n                        aria-hidden=\"true\">\n\n                        \ud83c\udfa8\n\n                    <\/div>\n\n\n                    <h3>\n                        Guided Instruction\n                    <\/h3>\n\n\n                    <p>\n\n                        Follow step-by-step guidance on blending\n                        colours, capturing textures and painting\n                        mangrove landscapes.\n\n                    <\/p>\n\n                <\/article>\n\n\n                <!-- CARD 2 -->\n\n                <article class=\"usj-mangrove-expect-card\">\n\n                    <div\n                        class=\"usj-mangrove-expect-icon\"\n                        aria-hidden=\"true\">\n\n                        \ud83d\udd8c\ufe0f\n\n                    <\/div>\n\n\n                    <h3>\n                        All Materials Provided\n                    <\/h3>\n\n\n                    <p>\n\n                        Canvas, paints, brushes and aprons will\n                        be available at the venue.\n\n                    <\/p>\n\n                <\/article>\n\n\n                <!-- CARD 3 -->\n\n                <article class=\"usj-mangrove-expect-card\">\n\n                    <div\n                        class=\"usj-mangrove-expect-icon\"\n                        aria-hidden=\"true\">\n\n                        \ud83c\udfe0\n\n                    <\/div>\n\n\n                    <h3>\n                        Take-Home Art\n                    <\/h3>\n\n\n                    <p>\n\n                        Complete your own custom painting\n                        and take your artwork home at the\n                        end of the session.\n\n                    <\/p>\n\n                <\/article>\n\n\n            <\/div>\n\n        <\/div>\n\n\n    <\/div>\n\n<\/section>\n\n\n\n<!-- =========================================================\n     USJ LIBRARY\n     MANGROVE PAINTING WORKSHOP\n     SECTION 3 \u2014 REGISTRATION + PREPARATION\n     ========================================================= -->\n\n\n\n\n<section class=\"usj-mangrove-registration\">\n\n    <div class=\"usj-mangrove-registration-inner\">\n\n\n        <div class=\"usj-mangrove-registration-grid\">\n\n\n            <!-- =================================================\n                 REGISTER\n                 ================================================= -->\n\n            <div class=\"usj-mangrove-registration-card\">\n\n                <h2>\n                    Ready to paint?\n                <\/h2>\n\n\n                <p>\n\n                    The workshop is free for registered students,\n                    but seats are limited.\n\n                    <br><br>\n\n                    Register in advance and arrive 10 minutes early\n                    so you have enough time to settle in and get ready.\n\n                <\/p>\n\n\n                <a\n                    class=\"usj-mangrove-big-button\"\n                    href=\"https:\/\/forms.gle\/egGwP66vVXH3M8ox8\"\n                    target=\"_blank\"\n                    rel=\"noopener\">\n\n                    REGISTER NOW \u2192\n\n                <\/a>\n\n            <\/div>\n\n\n            <!-- =================================================\n                 PREPARATION\n                 ================================================= -->\n\n            <div class=\"usj-mangrove-preparation\">\n\n                <h3>\n                    Before you come\n                <\/h3>\n\n\n                <div class=\"usj-mangrove-prep-item\">\n\n                    <div\n                        class=\"usj-mangrove-prep-icon\"\n                        aria-hidden=\"true\">\n\n                        \ud83d\udcb0\n\n                    <\/div>\n\n                    <div>\n\n                        <strong>\n                            Cost\n                        <\/strong>\n\n                        <span>\n                            Free for all registered students.\n                        <\/span>\n\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"usj-mangrove-prep-item\">\n\n                    <div\n                        class=\"usj-mangrove-prep-icon\"\n                        aria-hidden=\"true\">\n\n                        \ud83d\udc55\n                    <\/div>\n\n                    <div>\n\n                        <strong>\n                            What to wear\n                        <\/strong>\n\n                        <span>\n                            Wear clothes you don&#8217;t mind getting\n                            a little paint on.\n                        <\/span>\n\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"usj-mangrove-prep-item\">\n\n                    <div\n                        class=\"usj-mangrove-prep-icon\"\n                        aria-hidden=\"true\">\n\n                        \u23f0\n\n                    <\/div>\n\n                    <div>\n\n                        <strong>\n                            Arrive early\n                        <\/strong>\n\n                        <span>\n                            Please arrive 10 minutes early to\n                            secure your spot and set up.\n                        <\/span>\n\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"usj-mangrove-prep-item\">\n\n                    <div\n                        class=\"usj-mangrove-prep-icon\"\n                        aria-hidden=\"true\">\n\n                        \ud83c\udf92\n\n                    <\/div>\n\n                    <div>\n\n                        <strong>\n                            Bring\n                        <\/strong>\n\n                        <span>\n                            Just bring yourself \u2014 all painting\n                            materials are provided.\n                        <\/span>\n\n                    <\/div>\n\n                <\/div>\n\n\n            <\/div>\n\n\n        <\/div>\n\n\n        <div class=\"usj-mangrove-bottom-note\">\n\n            <strong>\n                \ud83d\udccd Event location:\n            <\/strong>\n\n            Ilha Verde Campus \u00b7 Classroom 101\n\n            &nbsp; \u00b7 &nbsp;\n\n            <strong>\n                \ud83d\uddd3 September 23, 2026\n            <\/strong>\n\n            &nbsp; \u00b7 &nbsp;\n\n            <strong>\n                \ud83d\udd50 16:00\u201317:00\n            <\/strong>\n\n        <\/div>\n\n\n    <\/div>\n\n<\/section>\n<style class=\"advgb-styles-renderer\">\n\n\/* =========================================================\n   FULL WIDTH FOUNDATION\n   ========================================================= *\/\n\n.usj-mangrove-hero {\n\n    --green-dark:#355f2d;\n    --green:#6f9f35;\n    --green-light:#a9cf3a;\n    --green-pale:#eef6df;\n\n    --blue:#386983;\n    --navy:#264758;\n\n    --text:#243447;\n    --muted:#687789;\n\n    width:100;\n    max-width:none;\n    overflow:hidden;\n\n    font-family:\n        -apple-system,\n        BlinkMacSystemFont,\n        \"Segoe UI\",\n        Roboto,\n        Helvetica,\n        Arial,\n        sans-serif;\n\n    color:var(--text);\n\n    box-sizing:border-box;\n}\n\n\n\/* =========================================================\n   HERO\n   ========================================================= *\/\n\n.usj-mangrove-hero-main {\n\n    position:relative;\n\n    width:100%;\n\n    min-height:540px;\n\n    display:flex;\n    align-items:center;\n\n    padding:\n        80px 0\n        110px;\n\n    background-image:\n        linear-gradient(\n            90deg,\n            rgba(20,55,18,.88) 0%,\n            rgba(35,76,25,.78) 42%,\n            rgba(35,76,25,.48) 68%,\n            rgba(20,55,18,.28) 100%\n        ),\n        url(\"https:\/\/library.usj.edu.mo\/wp-content\/uploads\/2026\/09\/Screenshot-2026-09-18-at-7.39.29-PM.png\");\n\n    background-size:cover;\n\n    background-position:center;\n\n    background-repeat:no-repeat;\n\n    color:#fff;\n\n    box-sizing:border-box;\n\n}\n \n\n    color:#fff;\n\n    box-sizing:border-box;\n\n}\n\n\n\/* subtle organic texture *\/\n\n.usj-mangrove-hero-main::before {\n\n    content:\"\";\n\n    position:absolute;\n\n    inset:0;\n\n    opacity:.12;\n\n    background-image:\n        radial-gradient(\n            circle,\n            #fff 1px,\n            transparent 1.5px\n        );\n\n    background-size:18px 18px;\n\n    pointer-events:none;\n\n}\n\n\n.usj-mangrove-container {\n\n    position:relative;\n    z-index:2;\n\n    width:100%;\n    max-width:1440px;\n\n    margin:0 auto;\n\n    padding:\n        0 40px;\n\n    box-sizing:border-box;\n\n}\n\n\n\/* =========================================================\n   HERO GRID\n   ========================================================= *\/\n\n.usj-mangrove-hero-grid {\n\n    display:grid;\n\n    grid-template-columns:\n        minmax(0,1.15fr)\n        minmax(360px,.85fr);\n\n    align-items:center;\n\n    gap:70px;\n\n}\n\n\n\/* =========================================================\n   BRAND\n   ========================================================= *\/\n\n.usj-mangrove-brand {\n\n    display:flex;\n\n    align-items:center;\n\n    gap:15px;\n\n    margin-bottom:34px;\n\n}\n\n\n.usj-mangrove-brand-name {\n\n    font-size:21px;\n\n    font-weight:700;\n\n    letter-spacing:-.02em;\n\n}\n\n\n.usj-mangrove-brand-line {\n\n    width:90px;\n    height:2px;\n\n    background:\n        rgba(255,255,255,.9);\n\n}\n\n\n\/* =========================================================\n   EYEBROW\n   ========================================================= *\/\n\n.usj-mangrove-eyebrow {\n\n    display:inline-flex;\n\n    align-items:center;\n\n    gap:8px;\n\n    margin-bottom:18px;\n\n    padding:\n        7px 13px;\n\n    border:\n        1px solid\n        rgba(255,255,255,.30);\n\n    border-radius:999px;\n\n    background:\n        rgba(255,255,255,.12);\n\n    color:#fff;\n\n    font-size:11px;\n\n    font-weight:800;\n\n    letter-spacing:.09em;\n\n    text-transform:uppercase;\n\n}\n\n\n\/* =========================================================\n   TITLE\n   ========================================================= *\/\n\n.usj-mangrove-hero h1 {\n\n    margin:0;\n\n    color:#fff !important;\n\n    font-size:\n        clamp(42px,6vw,76px);\n\n    line-height:.98;\n\n    letter-spacing:-.045em;\n\n    font-weight:900;\n\n}\n\n\n.usj-mangrove-title-cn {\n\n    margin-top:16px;\n\n    color:#fff;\n\n    font-size:\n        clamp(27px,3.2vw,43px);\n\n    line-height:1.1;\n\n    font-weight:800;\n\n}\n\n\n.usj-mangrove-workshop-title {\n\n    display:inline-block;\n\n    margin-top:28px;\n\n    padding:\n        9px 15px;\n\n    background:#111;\n\n    color:#fff;\n\n    font-size:\n        clamp(17px,2vw,25px);\n\n    line-height:1.2;\n\n    font-weight:900;\n\n    letter-spacing:.02em;\n\n}\n\n\n\/* =========================================================\n   HERO DESCRIPTION\n   ========================================================= *\/\n\n.usj-mangrove-hero-description {\n\n    max-width:680px;\n\n    margin:\n        25px 0 0;\n\n    color:\n        rgba(255,255,255,.90);\n\n    font-size:16px;\n\n    line-height:1.65;\n\n}\n\n\n\/* =========================================================\n   EVENT INFO CARD\n   ========================================================= *\/\n\n.usj-mangrove-info-card {\n\n    position:relative;\n\n    padding:32px;\n\n    border-radius:22px;\n\n    background:\n        rgba(255,255,255,.96);\n\n    color:var(--text);\n\n    box-shadow:\n        0 25px 65px\n        rgba(35,74,21,.22);\n\n    box-sizing:border-box;\n\n}\n\n\n\/* DATE *\/\n\n.usj-mangrove-date {\n\n    margin-bottom:26px;\n\n    color:var(--green-dark);\n\n    font-size:\n        clamp(34px,4vw,50px);\n\n    line-height:1;\n\n    font-weight:900;\n\n    letter-spacing:-.04em;\n\n}\n\n\n.usj-mangrove-date-label {\n\n    display:block;\n\n    margin-bottom:8px;\n\n    color:#7b8a68;\n\n    font-size:11px;\n\n    font-weight:800;\n\n    letter-spacing:.10em;\n\n    text-transform:uppercase;\n\n}\n\n\n\/* INFO ROW *\/\n\n.usj-mangrove-info-row {\n\n    display:flex;\n\n    gap:14px;\n\n    padding:\n        17px 0;\n\n    border-top:\n        1px solid\n        #e5ebdf;\n\n}\n\n\n.usj-mangrove-info-icon {\n\n    flex:0 0 38px;\n\n    width:38px;\n    height:38px;\n\n    display:grid;\n\n    place-items:center;\n\n    border-radius:10px;\n\n    background:#eef6df;\n\n    font-size:17px;\n\n}\n\n\n.usj-mangrove-info-label {\n\n    display:block;\n\n    margin-bottom:3px;\n\n    color:#7b8a68;\n\n    font-size:10px;\n\n    font-weight:800;\n\n    letter-spacing:.08em;\n\n    text-transform:uppercase;\n\n}\n\n\n.usj-mangrove-info-value {\n\n    color:var(--navy);\n\n    font-size:15px;\n\n    line-height:1.45;\n\n    font-weight:750;\n\n}\n\n\n\/* =========================================================\n   CTA\n   ========================================================= *\/\n\n.usj-mangrove-register {\n\n    display:flex;\n\n    align-items:center;\n\n    justify-content:center;\n\n    width:100%;\n\n    min-height:52px;\n\n    margin-top:20px;\n\n    padding:\n        0 20px;\n\n    border-radius:11px;\n\n    background:\n        var(--green-dark);\n\n    color:#fff !important;\n\n    text-decoration:none !important;\n\n    font-size:14px;\n\n    font-weight:900;\n\n    letter-spacing:.02em;\n\n    box-sizing:border-box;\n\n    transition:\n        transform .2s ease,\n        background .2s ease;\n\n}\n\n\n.usj-mangrove-register:hover {\n\n    transform:translateY(-2px);\n\n    background:#274b22;\n\n}\n\n\n\/* =========================================================\n   TABLET\n   ========================================================= *\/\n\n@media(max-width:950px){\n\n    .usj-mangrove-hero-grid {\n\n        grid-template-columns:1fr;\n\n        gap:40px;\n\n    }\n\n    .usj-mangrove-info-card {\n\n        max-width:680px;\n\n    }\n\n}\n\n\n\/* =========================================================\n   MOBILE\n   ========================================================= *\/\n\n@media(max-width:600px){\n\n    .usj-mangrove-container {\n\n        padding:\n            0 16px;\n\n    }\n\n    .usj-mangrove-hero-main {\n\n        min-height:auto;\n\n        padding:\n            48px 0\n            82px;\n\n    }\n\n    .usj-mangrove-brand {\n\n        margin-bottom:27px;\n\n    }\n\n    .usj-mangrove-brand-name {\n\n        font-size:18px;\n\n    }\n\n    .usj-mangrove-brand-line {\n\n        width:55px;\n\n    }\n\n    .usj-mangrove-hero h1 {\n\n        font-size:43px;\n\n    }\n\n    .usj-mangrove-title-cn {\n\n        font-size:27px;\n\n    }\n\n    .usj-mangrove-workshop-title {\n\n        font-size:16px;\n\n    }\n\n    .usj-mangrove-hero-description {\n\n        font-size:14px;\n\n    }\n\n    .usj-mangrove-info-card {\n\n        padding:23px;\n\n        border-radius:17px;\n\n    }\n\n    .usj-mangrove-date {\n\n        font-size:35px;\n\n    }\n\n}\n\n\n\n.usj-mangrove-content {\n\n    --green-dark:#355f2d;\n    --green:#6f9f35;\n    --green-light:#a9cf3a;\n\n    --navy:#264758;\n    --text:#243447;\n    --muted:#687789;\n\n    --border:#dfe7ef;\n    --bg:#f7f9fc;\n\n    width:100;\n    background:#fff;\n\n    font-family:\n        -apple-system,\n        BlinkMacSystemFont,\n        \"Segoe UI\",\n        Roboto,\n        Helvetica,\n        Arial,\n        sans-serif;\n\n    color:var(--text);\n\n    box-sizing:border-box;\n\n}\n\n\n.usj-mangrove-content-inner {\n\n    width:100%;\n    max-width:1440px;\n\n    margin:0 auto;\n\n    padding:\n        76px 40px\n        82px;\n\n    box-sizing:border-box;\n\n}\n\n\n\/* =========================================================\n   SECTION HEADER\n   ========================================================= *\/\n\n.usj-mangrove-label {\n\n    margin-bottom:9px;\n\n    color:var(--green-dark);\n\n    font-size:11px;\n\n    font-weight:900;\n\n    letter-spacing:.10em;\n\n    text-transform:uppercase;\n\n}\n\n\n.usj-mangrove-content h2 {\n\n    margin:0 0 13px;\n\n    color:var(--navy) !important;\n\n    font-size:\n        clamp(30px,4vw,43px);\n\n    line-height:1.12;\n\n    letter-spacing:-.03em;\n\n    font-weight:850;\n\n}\n\n\n.usj-mangrove-intro {\n\n    max-width:760px;\n\n    margin:0;\n\n    color:var(--muted) !important;\n\n    font-size:15px;\n\n    line-height:1.7;\n\n}\n\n\n\/* =========================================================\n   OVERVIEW\n   ========================================================= *\/\n\n.usj-mangrove-overview {\n\n    display:grid;\n\n    grid-template-columns:\n        minmax(0,1.1fr)\n        minmax(280px,.9fr);\n\n    gap:20px;\n\n    margin-top:42px;\n\n}\n\n\n.usj-mangrove-overview-main {\n\n    padding:32px;\n\n    border-radius:19px;\n\n    background:\n        #f2f7e8;\n\n    box-sizing:border-box;\n\n}\n\n\n.usj-mangrove-overview-main h3 {\n\n    margin:0 0 13px;\n\n    color:var(--green-dark) !important;\n\n    font-size:22px;\n\n    font-weight:850;\n\n}\n\n\n.usj-mangrove-overview-main p {\n\n    margin:0;\n\n    color:#506151 !important;\n\n    font-size:15px;\n\n    line-height:1.75;\n\n}\n\n\n\/* =========================================================\n   MANGROVE FACT\n   ========================================================= *\/\n\n.usj-mangrove-fact {\n\n    position:relative;\n\n    padding:32px;\n\n    border-radius:19px;\n\n    background:\n        linear-gradient(\n            140deg,\n            #355f2d,\n            #6f9f35\n        );\n\n    color:#fff;\n\n    overflow:hidden;\n\n}\n\n\n.usj-mangrove-fact::after {\n\n    content:\"\ud83c\udf3f\";\n\n    position:absolute;\n\n    right:20px;\n    bottom:-12px;\n\n    font-size:95px;\n\n    opacity:.13;\n\n}\n\n\n.usj-mangrove-fact h3 {\n\n    margin:0 0 12px;\n\n    color:#fff !important;\n\n    font-size:20px;\n\n    font-weight:850;\n\n}\n\n\n.usj-mangrove-fact p {\n\n    position:relative;\n    z-index:2;\n\n    margin:0;\n\n    color:\n        rgba(255,255,255,.88) !important;\n\n    font-size:14px;\n\n    line-height:1.7;\n\n}\n\n\n\/* =========================================================\n   WHAT TO EXPECT\n   ========================================================= *\/\n\n.usj-mangrove-expect {\n\n    margin-top:65px;\n\n}\n\n\n.usj-mangrove-expect-grid {\n\n    display:grid;\n\n    grid-template-columns:\n        repeat(3,minmax(0,1fr));\n\n    gap:16px;\n\n    margin-top:30px;\n\n}\n\n\n.usj-mangrove-expect-card {\n\n    padding:27px;\n\n    border:\n        1px solid\n        var(--border);\n\n    border-radius:17px;\n\n    background:#fff;\n\n    box-sizing:border-box;\n\n    transition:\n        transform .2s ease,\n        box-shadow .2s ease;\n\n}\n\n\n.usj-mangrove-expect-card:hover {\n\n    transform:translateY(-3px);\n\n    box-shadow:\n        0 12px 30px\n        rgba(36,52,71,.08);\n\n}\n\n\n.usj-mangrove-expect-icon {\n\n    width:46px;\n    height:46px;\n\n    display:grid;\n\n    place-items:center;\n\n    margin-bottom:19px;\n\n    border-radius:12px;\n\n    background:#edf5df;\n\n    font-size:21px;\n\n}\n\n\n.usj-mangrove-expect-card h3 {\n\n    margin:0 0 9px;\n\n    color:var(--navy) !important;\n\n    font-size:18px;\n\n    line-height:1.3;\n\n    font-weight:850;\n\n}\n\n\n.usj-mangrove-expect-card p {\n\n    margin:0;\n\n    color:var(--muted) !important;\n\n    font-size:14px;\n\n    line-height:1.65;\n\n}\n\n\n\/* =========================================================\n   TABLET\n   ========================================================= *\/\n\n@media(max-width:900px){\n\n    .usj-mangrove-content-inner {\n\n        padding:\n            62px 30px\n            68px;\n\n    }\n\n    .usj-mangrove-overview {\n\n        grid-template-columns:1fr;\n\n    }\n\n    .usj-mangrove-expect-grid {\n\n        grid-template-columns:1fr;\n\n    }\n\n}\n\n\n\/* =========================================================\n   MOBILE\n   ========================================================= *\/\n\n@media(max-width:600px){\n\n    .usj-mangrove-content-inner {\n\n        padding:\n            50px 16px\n            58px;\n\n    }\n\n    .usj-mangrove-overview-main,\n    .usj-mangrove-fact {\n\n        padding:23px;\n\n    }\n\n    .usj-mangrove-expect {\n\n        margin-top:48px;\n\n    }\n\n    .usj-mangrove-expect-card {\n\n        padding:22px;\n\n    }\n\n}\n\n\n\n.usj-mangrove-registration {\n\n    --green-dark:#355f2d;\n    --green:#6f9f35;\n\n    --navy:#264758;\n    --text:#243447;\n    --muted:#687789;\n\n    --border:#dfe7ef;\n\n    width:100;\n    background:#f7f9fc;\n\n    font-family:\n        -apple-system,\n        BlinkMacSystemFont,\n        \"Segoe UI\",\n        Roboto,\n        Helvetica,\n        Arial,\n        sans-serif;\n\n    color:var(--text);\n\n    box-sizing:border-box;\n\n}\n\n\n.usj-mangrove-registration-inner {\n\n    width:100%;\n    max-width:1440px;\n\n    margin:0 auto;\n\n    padding:\n        70px 40px\n        80px;\n\n    box-sizing:border-box;\n\n}\n\n\n\/* =========================================================\n   REGISTRATION GRID\n   ========================================================= *\/\n\n.usj-mangrove-registration-grid {\n\n    display:grid;\n\n    grid-template-columns:\n        minmax(0,1.15fr)\n        minmax(320px,.85fr);\n\n    gap:20px;\n\n}\n\n\n\/* =========================================================\n   REGISTRATION CARD\n   ========================================================= *\/\n\n.usj-mangrove-registration-card {\n\n    padding:35px;\n\n    border-radius:21px;\n\n    background:\n        linear-gradient(\n            135deg,\n            #355f2d,\n            #6f9f35\n        );\n\n    color:#fff;\n\n    box-sizing:border-box;\n\n}\n\n\n.usj-mangrove-registration-card h2 {\n\n    margin:0 0 11px;\n\n    color:#fff !important;\n\n    font-size:\n        clamp(28px,4vw,40px);\n\n    line-height:1.1;\n\n    font-weight:900;\n\n}\n\n\n.usj-mangrove-registration-card p {\n\n    max-width:620px;\n\n    margin:0;\n\n    color:\n        rgba(255,255,255,.88) !important;\n\n    font-size:15px;\n\n    line-height:1.65;\n\n}\n\n\n\/* =========================================================\n   REGISTER BUTTON\n   ========================================================= *\/\n\n.usj-mangrove-big-button {\n\n    display:inline-flex;\n\n    align-items:center;\n\n    justify-content:center;\n\n    min-height:52px;\n\n    margin-top:25px;\n\n    padding:\n        0 24px;\n\n    border-radius:11px;\n\n    background:#fff;\n\n    color:#355f2d !important;\n\n    text-decoration:none !important;\n\n    font-size:14px;\n\n    font-weight:900;\n\n    transition:\n        transform .2s ease,\n        box-shadow .2s ease;\n\n}\n\n\n.usj-mangrove-big-button:hover {\n\n    transform:translateY(-2px);\n\n    box-shadow:\n        0 10px 25px\n        rgba(0,0,0,.16);\n\n}\n\n\n\/* =========================================================\n   PREPARATION CARD\n   ========================================================= *\/\n\n.usj-mangrove-preparation {\n\n    padding:31px;\n\n    border:\n        1px solid\n        var(--border);\n\n    border-radius:21px;\n\n    background:#fff;\n\n    box-sizing:border-box;\n\n}\n\n\n.usj-mangrove-preparation h3 {\n\n    margin:0 0 21px;\n\n    color:var(--navy) !important;\n\n    font-size:21px;\n\n    font-weight:850;\n\n}\n\n\n\/* =========================================================\n   PREP ITEM\n   ========================================================= *\/\n\n.usj-mangrove-prep-item {\n\n    display:flex;\n\n    align-items:flex-start;\n\n    gap:13px;\n\n    padding:\n        15px 0;\n\n    border-top:\n        1px solid\n        #edf0f2;\n\n}\n\n\n.usj-mangrove-prep-item:first-of-type {\n\n    border-top:0;\n\n    padding-top:0;\n\n}\n\n\n.usj-mangrove-prep-icon {\n\n    flex:0 0 34px;\n\n    width:34px;\n    height:34px;\n\n    display:grid;\n\n    place-items:center;\n\n    border-radius:9px;\n\n    background:#edf5df;\n\n    font-size:15px;\n\n}\n\n\n.usj-mangrove-prep-item strong {\n\n    display:block;\n\n    margin-bottom:3px;\n\n    color:var(--navy);\n\n    font-size:13px;\n\n}\n\n\n.usj-mangrove-prep-item span {\n\n    color:var(--muted);\n\n    font-size:13px;\n\n    line-height:1.5;\n\n}\n\n\n\/* =========================================================\n   BOTTOM NOTE\n   ========================================================= *\/\n\n.usj-mangrove-bottom-note {\n\n    margin-top:22px;\n\n    padding:\n        18px 20px;\n\n    border:\n        1px solid\n        #dfe9d0;\n\n    border-radius:13px;\n\n    background:#f0f7e4;\n\n    color:#506151;\n\n    font-size:13px;\n\n    line-height:1.6;\n\n}\n\n\n.usj-mangrove-bottom-note strong {\n\n    color:var(--green-dark);\n\n}\n\n\n\/* =========================================================\n   TABLET\n   ========================================================= *\/\n\n@media(max-width:900px){\n\n    .usj-mangrove-registration-inner {\n\n        padding:\n            58px 30px\n            68px;\n\n    }\n\n    .usj-mangrove-registration-grid {\n\n        grid-template-columns:1fr;\n\n    }\n\n}\n\n\n\/* =========================================================\n   MOBILE\n   ========================================================= *\/\n\n@media(max-width:600px){\n\n    .usj-mangrove-registration-inner {\n\n        padding:\n            50px 16px\n            58px;\n\n    }\n\n    .usj-mangrove-registration-card {\n\n        padding:25px;\n\n    }\n\n    .usj-mangrove-preparation {\n\n        padding:23px;\n\n    }\n\n    .usj-mangrove-big-button {\n\n        width:100%;\n\n    }\n\n}\n\n<\/style>","protected":false},"excerpt":{"rendered":"<p>USJ Library \ud83c\udf3f Mangrove Guardians Mangrove Painting Workshop \u7d05\u6a39\u6797\u5b88\u8b77\u8005 3D MODEL PAINTING WORKSHOP Unwind, create and connect with nature. Join us for a hands-on painting session inspired by the unique beauty and biodiversity of mangrove ecosystems. Event Date September 23, 2026 \ud83d\udd50 Time 16:00 \u2013 17:00 \ud83d\udccd Location Ilha Verde Campus Classroom 101 \ud83c\udf93 Target [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":465531,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"advgb_blocks_editor_width":"","advgb_blocks_columns_visual_guide":"","_kadence_starter_templates_imported_post":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-465530","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-events_act"],"gutentor_comment":0,"author_meta":{"display_name":"emily chan","author_link":"https:\/\/library.usj.edu.mo\/zh\/author\/emilychan\/"},"featured_img":"https:\/\/library.usj.edu.mo\/wp-content\/uploads\/2026\/09\/Screenshot-2026-09-18-at-7.39.29-PM-300x214.png","coauthors":[],"tax_additional":{"categories":{"linked":["<a href=\"https:\/\/library.usj.edu.mo\/zh\/category\/news\/events_act\/\" class=\"advgb-post-tax-term\">Events<\/a>"],"unlinked":["<span class=\"advgb-post-tax-term\">Events<\/span>"]}},"comment_count":"0","relative_dates":{"created":"Posted 2 \u9031 ago","modified":"Updated 3 \u5929 ago"},"absolute_dates":{"created":"Posted on 18 9 \u6708, 2026","modified":"Updated on 29 9 \u6708, 2026"},"absolute_dates_time":{"created":"Posted on 18 9 \u6708, 2026 7:39 \u4e0b\u5348","modified":"Updated on 29 9 \u6708, 2026 7:47 \u4e0b\u5348"},"featured_img_caption":"","series_order":"","_links":{"self":[{"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/posts\/465530","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/comments?post=465530"}],"version-history":[{"count":2,"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/posts\/465530\/revisions"}],"predecessor-version":[{"id":465536,"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/posts\/465530\/revisions\/465536"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/media\/465531"}],"wp:attachment":[{"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/media?parent=465530"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/categories?post=465530"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/library.usj.edu.mo\/zh\/wp-json\/wp\/v2\/tags?post=465530"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}