{"id":261,"date":"2025-05-26T09:13:57","date_gmt":"2025-05-26T09:13:57","guid":{"rendered":"http:\/\/localhost\/SETUP_WORDPRESS_Files\/Movers%20Packers%20Express\/?page_id=261"},"modified":"2026-03-25T08:12:22","modified_gmt":"2026-03-25T08:12:22","slug":"g-gallery","status":"publish","type":"page","link":"https:\/\/www.webnotickdemo.com\/express-movers\/g-gallery\/","title":{"rendered":"Gallery"},"content":{"rendered":"\n\n<div class=\"container pb-32 pt-16\">\n\n  <div class=\"py-12 bg-white border-b-2 border-gray-100\">\n      <!-- FILTER BUTTONS -->\n    <div class=\"gallery-wrapper \" style=\"justify-self: center;\">\n        <div class=\"gallery-filters flex flex-wrap gap-4\">\n\n        <div class=\"flex items-center gap-2 text-gray-600 font-bold\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-funnel w-5 h-5\"><path d=\"M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z\"><\/path><\/svg><span>Filter:<\/span><\/div>\n\n            <!-- ALL BUTTON -->\n            <button class=\"filter-btn active\" data-filter=\"all\">All<\/button>\n\n                        \n                <button class=\"filter-btn\" data-filter=\"air-freight\">\n                    Air Freight                <\/button>\n                        \n                <button class=\"filter-btn\" data-filter=\"ocean-freight\">\n                    Ocean Freight                <\/button>\n                        \n                <button class=\"filter-btn\" data-filter=\"transportation\">\n                    Transportation                <\/button>\n                        \n                <button class=\"filter-btn\" data-filter=\"warehousing\">\n                    Warehousing                <\/button>\n            \n        <\/div>\n    <\/div>\n  <\/div>\n\n    <!-- GALLERY GRID -->\n    <div class=\"grid sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3 gap-6 max-w-7xl mx-auto pt-24\">\n\n        \n        <div class=\"gallery-card air-freight group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/international-air-cargo\/\" data-caption=\"International Air Cargo\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/service2-1024x683.jpg\"\n                        alt=\"International Air Cargo\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Air Freight                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">International Air Cargo<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Express delivery to Europe<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card ocean-freight group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/container-shipping\/\" data-caption=\"Container Shipping\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/service4-1024x683.jpg\"\n                        alt=\"Container Shipping\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Ocean Freight                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Container Shipping<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Full container load service<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card transportation group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/ground-transportation\/\" data-caption=\"Ground Transportation\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/service1-1024x683.jpg\"\n                        alt=\"Ground Transportation\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Transportation                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Ground Transportation<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Domestic truck delivery<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card warehousing group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/modern-warehouse\/\" data-caption=\"Modern Warehouse\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/service3-683x1024.jpg\"\n                        alt=\"Modern Warehouse\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Warehousing                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Modern Warehouse<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Climate-controlled storage<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card air-freight group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/cargo-aircraft\/\" data-caption=\"Cargo Aircraft\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/image-15-1024x677.jpg\"\n                        alt=\"Cargo Aircraft\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Air Freight                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Cargo Aircraft<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Dedicated air freight<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card ocean-freight group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/port-operations\/\" data-caption=\"Port Operations\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/image-12-1024x683.jpg\"\n                        alt=\"Port Operations\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Ocean Freight                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Port Operations<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Container terminal services<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card warehousing group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/distribution-center\/\" data-caption=\"Distribution Center\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/service6-1024x683.jpg\"\n                        alt=\"Distribution Center\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Warehousing                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Distribution Center<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Automated warehousing<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card transportation group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/fleet-management\/\" data-caption=\"Fleet Management\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2025\/04\/packages-6153947_1280@2x.png\"\n                        alt=\"Fleet Management\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Transportation                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Fleet Management<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Modern truck fleet<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n        <div class=\"gallery-card air-freight group bg-white rounded-2xl overflow-hidden border border-[#E1E5EA] hover:border-[#00C1D4]\/50 shadow-sm hover:shadow-xl transition-all duration-300 relative\">\n            <div class=\"relative aspect-[4\/3] overflow-hidden\">\n                <div class=\"overlay\"><\/div>\n                <a href=\"https:\/\/www.webnotickdemo.com\/express-movers\/index\/gallery\/airport-logistics\/\" data-caption=\"Airport Logistics\">\n                    <img decoding=\"async\"\n                        src=\"https:\/\/www.webnotickdemo.com\/express-movers\/wp-content\/uploads\/sites\/18\/2026\/03\/project13-1024x683.jpg\"\n                        alt=\"Airport Logistics\"\n                        class=\"w-full h-full object-cover group-hover:scale-110 transition-transform duration-500\"\n                    >\n                <\/a>\n\n                <!-- CATEGORY BADGES -->\n                                                            <span class=\"gallery-badge z-10 absolute top-6 left-6 bg-gradient-to-r from-[#ff6b35] to-[#ff8c42] text-white px-4 py-2 rounded-full text-sm font-black uppercase shadow-lg\">\n                            Air Freight                        <\/span>\n                                    \n                <!-- HOVER CONTENT -->\n                                    <div class=\"absolute1 absolute bottom-0 left-0 right-0 p-6 transform translate-y-full group-hover:translate-y-0 transition-transform duration-500 z-10\">\n                        <a class=\"text-2xl font-black text-white\">Airport Logistics<\/a> <br>\n                        <div class=\"text-gray-200 mt-2\">Air cargo handling<\/div>\n                    <\/div>\n                \n            <\/div>\n        <\/div>\n\n        \n    <\/div>\n\n<\/div>\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n    const buttons = document.querySelectorAll(\".filter-btn\");\n    const cards = document.querySelectorAll(\".gallery-card\");\n\n    buttons.forEach(button => {\n        button.addEventListener(\"click\", () => {\n            const filter = button.dataset.filter;\n\n            buttons.forEach(btn => btn.classList.remove(\"active\"));\n            button.classList.add(\"active\");\n\n            cards.forEach(card => {\n                if (filter === \"all\" || card.classList.contains(filter)) {\n                    card.style.display = \"\";\n                } else {\n                    card.style.display = \"none\";\n                }\n            });\n        });\n    });\n});\n<\/script>\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":1774,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-261","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/pages\/261","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/comments?post=261"}],"version-history":[{"count":1,"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/pages\/261\/revisions"}],"predecessor-version":[{"id":428,"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/pages\/261\/revisions\/428"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/media\/1774"}],"wp:attachment":[{"href":"https:\/\/www.webnotickdemo.com\/express-movers\/wp-json\/wp\/v2\/media?parent=261"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}