{"id":42904,"date":"2026-09-03T12:10:06","date_gmt":"2026-09-03T12:10:06","guid":{"rendered":"https:\/\/rotary9103.org\/?page_id=42904"},"modified":"2026-09-03T12:53:52","modified_gmt":"2026-09-03T12:53:52","slug":"phototheque","status":"publish","type":"page","link":"https:\/\/rotary9103.org\/?page_id=42904","title":{"rendered":"Phototh\u00e8que"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"42904\" class=\"elementor elementor-42904\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a7840e8 e-flex e-con-boxed e-con e-parent\" data-id=\"a7840e8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a9a4c64 elementor-widget elementor-widget-shortcode\" data-id=\"a9a4c64\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n\n    <section class=\"d9103-photo-section\">\n\n\n        <div class=\"d9103-photo-container\">\n\n\n            <div class=\"d9103-photo-header\">\n\n                <span class=\"d9103-photo-label\">\n                    PHOTOTH\u00c8QUE\n                <\/span>\n\n\n                <h1>\n                    Les temps forts du District 9103 en images\n                <\/h1>\n\n\n                <p>\n                    D\u00e9couvrez les \u00e9v\u00e9nements, actions, rencontres\n                    et initiatives qui rythment la vie du District 9103.\n                <\/p>\n\n            <\/div>\n\n\n\n            \n\n\n            \n\n                <div class=\"d9103-photo-filters\">\n\n\n                    <button\n                        class=\"d9103-filter active\"\n                        data-filter=\"all\"\n                    >\n                        Tous\n                    <\/button>\n\n\n                    \n\n                        <button\n                            class=\"d9103-filter\"\n                            data-filter=\"actions-humanitaires\"\n                        >\n\n                            Actions humanitaires\n                        <\/button>\n\n\n                    \n\n                <\/div>\n\n\n            \n\n\n            \n\n                <div class=\"d9103-albums-grid\">\n\n\n                    \n\n                        <article\n                            class=\"d9103-album-card\"\n                            data-category=\"actions-humanitaires\"\n                        >\n\n\n                            <a\n                                href=\"https:\/\/rotary9103.org\/?d9103_album=agir-ensemble-au-service-des-communautes\"\n                                class=\"d9103-album-image\"\n                            >\n\n\n                                \n\n                                    <img decoding=\"async\"\n                                        src=\"https:\/\/rotary9103.org\/wp-content\/uploads\/2026\/09\/action_humanitaire_6.jpg\"\n                                        alt=\"Agir ensemble au service des communaut\u00e9s\"\n                                        loading=\"lazy\"\n                                    >\n\n\n                                \n\n                                <span class=\"d9103-photo-count\">\n\n                                    6\n                                     photos\n                                <\/span>\n\n\n                            <\/a>\n\n\n\n                            <div class=\"d9103-album-content\">\n\n\n                                <span class=\"d9103-album-category\">\n\n                                    Actions humanitaires\n                                <\/span>\n\n\n                                <h2>\n\n                                    <a\n                                        href=\"https:\/\/rotary9103.org\/?d9103_album=agir-ensemble-au-service-des-communautes\"\n                                    >\n\n                                        Agir ensemble au service des communaut\u00e9s\n                                    <\/a>\n\n                                <\/h2>\n\n\n                                \n\n                                <a\n                                    class=\"d9103-view-album\"\n                                    href=\"https:\/\/rotary9103.org\/?d9103_album=agir-ensemble-au-service-des-communautes\"\n                                >\n                                    Voir l'album \u2192\n                                <\/a>\n\n\n                            <\/div>\n\n\n                        <\/article>\n\n\n                    \n\n                <\/div>\n\n\n            \n\n        <\/div>\n\n\n    <\/section>\n\n\n\n    <style>\n\n\n        .d9103-photo-section {\n\n            width:100%;\n\n            padding:\n                75px 0 90px;\n\n            background:#f2f4f7;\n\n            font-family:\n                \"Open Sans\",\n                Arial,\n                sans-serif;\n        }\n\n\n        .d9103-photo-container {\n\n            width:100%;\n\n            max-width:1400px;\n\n            margin:0 auto;\n\n            padding:\n                0 30px;\n\n            box-sizing:border-box;\n        }\n\n\n        .d9103-photo-header {\n\n            max-width:800px;\n\n            margin:\n                0 auto 40px;\n\n            text-align:center;\n        }\n\n\n        .d9103-photo-label {\n\n            display:inline-block;\n\n            margin-bottom:12px;\n\n            color:#f59a23;\n\n            font-size:13px;\n\n            font-weight:700;\n\n            letter-spacing:2px;\n        }\n\n\n        .d9103-photo-header h1 {\n\n            margin:\n                0 0 17px;\n\n            color:#14284a;\n\n            font-size:48px;\n\n            line-height:1.1;\n\n            font-weight:700;\n        }\n\n\n        .d9103-photo-header p {\n\n            max-width:700px;\n\n            margin:0 auto;\n\n            color:#617085;\n\n            font-size:16px;\n\n            line-height:1.7;\n        }\n\n\n\n        .d9103-photo-filters {\n\n            display:flex;\n\n            justify-content:center;\n\n            flex-wrap:wrap;\n\n            gap:10px;\n\n            margin:\n                0 0 40px;\n        }\n\n\n        .d9103-filter {\n\n            padding:\n                10px 19px;\n\n            border:\n                1px solid #dfe4eb;\n\n            border-radius:30px;\n\n            background:#fff;\n\n            color:#14284a;\n\n            font-size:14px;\n\n            font-weight:600;\n\n            cursor:pointer;\n\n            transition:\n                .2s ease;\n        }\n\n\n        .d9103-filter:hover,\n        .d9103-filter.active {\n\n            border-color:#0755b8;\n\n            background:#0755b8;\n\n            color:#fff;\n        }\n\n\n\n        .d9103-albums-grid {\n\n            display:grid;\n\n            grid-template-columns:\n                repeat(\n                    3,\n                    minmax(0,1fr)\n                );\n\n            gap:25px;\n        }\n\n\n        .d9103-album-card {\n\n            overflow:hidden;\n\n            background:#fff;\n\n            border:\n                1px solid\n                rgba(\n                    223,\n                    228,\n                    235,\n                    .7\n                );\n\n            border-radius:16px;\n\n            box-shadow:\n                0 8px 24px\n                rgba(\n                    20,\n                    40,\n                    74,\n                    .08\n                );\n\n            transition:\n                transform .25s ease,\n                box-shadow .25s ease;\n        }\n\n\n        .d9103-album-card:hover {\n\n            transform:\n                translateY(-4px);\n\n            box-shadow:\n                0 14px 35px\n                rgba(\n                    20,\n                    40,\n                    74,\n                    .14\n                );\n        }\n\n\n        .d9103-album-image {\n\n            position:relative;\n\n            display:block;\n\n            width:100%;\n\n            height:280px;\n\n            overflow:hidden;\n\n            background:#e9eef5;\n        }\n\n\n        .d9103-album-image img {\n\n            display:block;\n\n            width:100%;\n\n            height:100%;\n\n            object-fit:cover;\n\n            object-position:center;\n\n            transition:\n                transform .4s ease;\n        }\n\n\n        .d9103-album-card:hover\n        .d9103-album-image img {\n\n            transform:\n                scale(1.04);\n        }\n\n\n        .d9103-no-cover {\n\n            display:flex;\n\n            align-items:center;\n\n            justify-content:center;\n\n            width:100%;\n\n            height:100%;\n\n            color:#617085;\n\n            font-weight:600;\n        }\n\n\n        .d9103-photo-count {\n\n            position:absolute;\n\n            right:15px;\n\n            bottom:15px;\n\n            padding:\n                7px 11px;\n\n            border-radius:20px;\n\n            background:\n                rgba(\n                    20,\n                    40,\n                    74,\n                    .88\n                );\n\n            color:#fff;\n\n            font-size:12px;\n\n            font-weight:600;\n        }\n\n\n        .d9103-album-content {\n\n            padding:\n                22px 23px 25px;\n        }\n\n\n        .d9103-album-category {\n\n            display:inline-block;\n\n            margin-bottom:11px;\n\n            padding:\n                5px 10px;\n\n            border-radius:14px;\n\n            background:#eaf4ff;\n\n            color:#0755b8;\n\n            font-size:12px;\n\n            font-weight:700;\n        }\n\n\n        .d9103-album-content h2 {\n\n            margin:\n                0 0 10px;\n\n            font-size:20px;\n\n            line-height:1.35;\n        }\n\n\n        .d9103-album-content h2 a {\n\n            color:#14284a;\n\n            text-decoration:none;\n        }\n\n\n        .d9103-album-content h2 a:hover {\n\n            color:#0755b8;\n\n            text-decoration:none;\n        }\n\n\n        .d9103-album-date {\n\n            margin-bottom:17px;\n\n            color:#7b8798;\n\n            font-size:13px;\n        }\n\n\n        .d9103-view-album {\n\n            color:#0755b8;\n\n            font-size:14px;\n\n            font-weight:700;\n\n            text-decoration:none;\n        }\n\n\n        .d9103-view-album:hover {\n\n            color:#f59a23;\n\n            text-decoration:none;\n        }\n\n\n        .d9103-no-albums {\n\n            padding:\n                60px 20px;\n\n            background:#fff;\n\n            border-radius:16px;\n\n            text-align:center;\n        }\n\n\n\n        @media(max-width:1024px) {\n\n            .d9103-albums-grid {\n\n                grid-template-columns:\n                    repeat(\n                        2,\n                        minmax(0,1fr)\n                    );\n            }\n\n\n            .d9103-photo-header h1 {\n\n                font-size:40px;\n            }\n\n        }\n\n\n\n        @media(max-width:650px) {\n\n            .d9103-photo-section {\n\n                padding:\n                    45px 0 60px;\n            }\n\n\n            .d9103-photo-container {\n\n                padding:\n                    0 15px;\n            }\n\n\n            .d9103-photo-header {\n\n                margin-bottom:30px;\n            }\n\n\n            .d9103-photo-header h1 {\n\n                font-size:30px;\n            }\n\n\n            .d9103-photo-filters {\n\n                justify-content:flex-start;\n\n                margin-bottom:28px;\n            }\n\n\n            .d9103-albums-grid {\n\n                grid-template-columns:1fr;\n\n                gap:18px;\n            }\n\n\n            .d9103-album-image {\n\n                height:260px;\n            }\n\n        }\n\n\n    <\/style>\n\n\n\n    <script>\n\n    document.addEventListener(\n        \"DOMContentLoaded\",\n        function () {\n\n\n            const filters =\n                document.querySelectorAll(\n                    \".d9103-filter\"\n                );\n\n\n            const albums =\n                document.querySelectorAll(\n                    \".d9103-album-card\"\n                );\n\n\n            filters.forEach(\n                function (filter) {\n\n\n                    filter.addEventListener(\n                        \"click\",\n                        function () {\n\n\n                            const category =\n                                this.dataset.filter;\n\n\n                            filters.forEach(\n                                function (button) {\n\n                                    button.classList.remove(\n                                        \"active\"\n                                    );\n                                }\n                            );\n\n\n                            this.classList.add(\n                                \"active\"\n                            );\n\n\n                            albums.forEach(\n                                function (album) {\n\n\n                                    if (\n                                        category === \"all\"\n                                        ||\n                                        album.dataset.category\n                                        === category\n                                    ) {\n\n                                        album.style.display =\n                                            \"\";\n\n                                    } else {\n\n                                        album.style.display =\n                                            \"none\";\n                                    }\n\n                                }\n                            );\n\n                        }\n                    );\n\n                }\n            );\n\n\n        }\n    );\n\n    <\/script>\n\n\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":4,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-42904","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rotary9103.org\/index.php?rest_route=\/wp\/v2\/pages\/42904","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rotary9103.org\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rotary9103.org\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rotary9103.org\/index.php?rest_route=\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/rotary9103.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=42904"}],"version-history":[{"count":7,"href":"https:\/\/rotary9103.org\/index.php?rest_route=\/wp\/v2\/pages\/42904\/revisions"}],"predecessor-version":[{"id":42919,"href":"https:\/\/rotary9103.org\/index.php?rest_route=\/wp\/v2\/pages\/42904\/revisions\/42919"}],"wp:attachment":[{"href":"https:\/\/rotary9103.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=42904"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}