Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALl-ground-floor.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-81688dd elementor-widget elementor-widget-heading\" data-id=\"81688dd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Ground Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-dea782c\" data-id=\"dea782c\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-964f6cd elementor-widget elementor-widget-html\" data-id=\"964f6cd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALL-1st-floor.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-eed1c29 elementor-widget elementor-widget-heading\" data-id=\"eed1c29\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">First Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-aa25f87 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"aa25f87\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-372cfdb\" data-id=\"372cfdb\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-bd0a81a elementor-widget elementor-widget-html\" data-id=\"bd0a81a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALL-2nd-floor.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-03a1263 elementor-widget elementor-widget-heading\" data-id=\"03a1263\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Second Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-2bb42df\" data-id=\"2bb42df\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-71fd4d3 elementor-widget elementor-widget-html\" data-id=\"71fd4d3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALL-3rd-floor.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0ec7b81 elementor-widget elementor-widget-heading\" data-id=\"0ec7b81\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Third Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-e7e1e84 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"e7e1e84\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-a1924a6\" data-id=\"a1924a6\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fe9a7c4 elementor-widget elementor-widget-html\" data-id=\"fe9a7c4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALL-4th-floor.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bcf68c9 elementor-widget elementor-widget-heading\" data-id=\"bcf68c9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Fourth Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-7fe34b7\" data-id=\"7fe34b7\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-abc7027 elementor-widget elementor-widget-html\" data-id=\"abc7027\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALL-5th-floor.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b5f540d elementor-widget elementor-widget-heading\" data-id=\"b5f540d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Fifth Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-43255d1 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"43255d1\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-244fa39\" data-id=\"244fa39\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5b919cb elementor-widget elementor-widget-html\" data-id=\"5b919cb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALL-6TH.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e208930 elementor-widget elementor-widget-heading\" data-id=\"e208930\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Sixth Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-295cd98\" data-id=\"295cd98\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c1e08fc elementor-widget elementor-widget-html\" data-id=\"c1e08fc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Image Modal Example<\/title>\n <style>\n \/* Style the Image Used to Trigger the Modal *\/\n .thumbnail {\n width: 2813px; \/* Initial width *\/\n height: 1688px; \/* Initial height *\/\n cursor: pointer;\n max-width: 100%;\n }\n\n \/* The Modal (background) *\/\n .modal {\n display: none; \/* Hidden by default *\/\n position: fixed; \/* Stay in place *\/\n z-index: 1; \/* Sit on top *\/\n padding-top: 100px; \/* Location of the box *\/\n left: 0;\n top: 0;\n width: 100%; \/* Full width *\/\n height: 100%; \/* Full height *\/\n overflow: auto; \/* Enable scroll if needed *\/\n background-color: rgb(0,0,0); \/* Fallback color *\/\n background-color: rgba(0,0,0,0.9); \/* Black w\/ opacity *\/\n }\n\n \/* Modal Content (image) *\/\n .modal-content {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 2813px;\n height: auto;\n }\n\n \/* Caption of Modal Image *\/\n #caption {\n margin: auto;\n display: block;\n width: 80%;\n max-width: 700px;\n text-align: center;\n color: #ccc;\n padding: 10px 0;\n height: 150px;\n }\n\n \/* Add Animation - Zoom in the Modal *\/\n .modal-content, #caption {\n animation-name: zoom;\n animation-duration: 0.6s;\n }\n\n @keyframes zoom {\n from {transform:scale(0)}\n to {transform:scale(1)}\n }\n\n \/* The Close Button *\/\n .close {\n position: absolute;\n top: 15px;\n right: 35px;\n color: #f1f1f1;\n font-size: 40px;\n font-weight: bold;\n transition: 0.3s;\n }\n\n .close:hover,\n .close:focus {\n color: #bbb;\n text-decoration: none;\n cursor: pointer;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"image-container\">\n <img decoding=\"async\" id=\"thumbnail\" src=\"http:\/\/platinamall.com\/wp-content\/uploads\/2024\/08\/PLATINA-MALL-7th-floor.jpg\" alt=\"Thumbnail Image\" class=\"thumbnail\">\n <\/div>\n\n \n <div id=\"imageModal\" class=\"modal\">\n <span class=\"close\">×<\/span>\n <img class=\"modal-content\" id=\"fullImage\">\n <div id=\"caption\"><\/div>\n <\/div>\n\n <script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n \/\/ Get the modal\n var modal = document.getElementById(\"imageModal\");\n\n \/\/ Get the image and insert it inside the modal - use its \"alt\" text as a caption\n var img = document.getElementById(\"thumbnail\");\n var modalImg = document.getElementById(\"fullImage\");\n var captionText = document.getElementById(\"caption\");\n\n img.onclick = function() {\n modal.style.display = \"block\";\n modalImg.src = this.src;\n captionText.innerHTML = this.alt;\n }\n\n \/\/ Get the <span> element that closes the modal\n var span = document.getElementsByClassName(\"close\")[0];\n\n \/\/ When the user clicks on <span> (x), close the modal\n span.onclick = function() { \n modal.style.display = \"none\";\n }\n\n \/\/ When the user clicks anywhere outside of the modal image, close it\n window.onclick = function(event) {\n if (event.target == modal) {\n modal.style.display = \"none\";\n }\n }\n });\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a905a42 elementor-widget elementor-widget-heading\" data-id=\"a905a42\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Seventh Floor <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Mall Map Image Modal Example × Ground Floor Image Modal Example × First Floor Image Modal Example × Second Floor Image Modal Example × Third Floor Image Modal Example × Fourth Floor Image Modal Example × Fifth Floor Image Modal Example × Sixth Floor Image Modal Example × Seventh Floor<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ocean_post_layout":"full-screen","ocean_both_sidebars_style":"","ocean_both_sidebars_content_width":0,"ocean_both_sidebars_sidebars_width":0,"ocean_sidebar":"0","ocean_second_sidebar":"0","ocean_disable_margins":"on","ocean_add_body_class":"","ocean_shortcode_before_top_bar":"","ocean_shortcode_after_top_bar":"","ocean_shortcode_before_header":"","ocean_shortcode_after_header":"","ocean_has_shortcode":"","ocean_shortcode_after_title":"","ocean_shortcode_before_footer_widgets":"","ocean_shortcode_after_footer_widgets":"","ocean_shortcode_before_footer_bottom":"","ocean_shortcode_after_footer_bottom":"","ocean_display_top_bar":"default","ocean_display_header":"default","ocean_header_style":"","ocean_center_header_left_menu":"0","ocean_custom_header_template":"0","ocean_custom_logo":0,"ocean_custom_retina_logo":0,"ocean_custom_logo_max_width":0,"ocean_custom_logo_tablet_max_width":0,"ocean_custom_logo_mobile_max_width":0,"ocean_custom_logo_max_height":0,"ocean_custom_logo_tablet_max_height":0,"ocean_custom_logo_mobile_max_height":0,"ocean_header_custom_menu":"0","ocean_menu_typo_font_family":"0","ocean_menu_typo_font_subset":"","ocean_menu_typo_font_size":0,"ocean_menu_typo_font_size_tablet":0,"ocean_menu_typo_font_size_mobile":0,"ocean_menu_typo_font_size_unit":"px","ocean_menu_typo_font_weight":"","ocean_menu_typo_font_weight_tablet":"","ocean_menu_typo_font_weight_mobile":"","ocean_menu_typo_transform":"","ocean_menu_typo_transform_tablet":"","ocean_menu_typo_transform_mobile":"","ocean_menu_typo_line_height":0,"ocean_menu_typo_line_height_tablet":0,"ocean_menu_typo_line_height_mobile":0,"ocean_menu_typo_line_height_unit":"","ocean_menu_typo_spacing":0,"ocean_menu_typo_spacing_tablet":0,"ocean_menu_typo_spacing_mobile":0,"ocean_menu_typo_spacing_unit":"","ocean_menu_link_color":"","ocean_menu_link_color_hover":"","ocean_menu_link_color_active":"","ocean_menu_link_background":"","ocean_menu_link_hover_background":"","ocean_menu_link_active_background":"","ocean_menu_social_links_bg":"","ocean_menu_social_hover_links_bg":"","ocean_menu_social_links_color":"","ocean_menu_social_hover_links_color":"","ocean_disable_title":"on","ocean_disable_heading":"default","ocean_post_title":"","ocean_post_subheading":"","ocean_post_title_style":"","ocean_post_title_background_color":"","ocean_post_title_background":0,"ocean_post_title_bg_image_position":"","ocean_post_title_bg_image_attachment":"","ocean_post_title_bg_image_repeat":"","ocean_post_title_bg_image_size":"","ocean_post_title_height":0,"ocean_post_title_bg_overlay":0.5,"ocean_post_title_bg_overlay_color":"","ocean_disable_breadcrumbs":"default","ocean_breadcrumbs_color":"","ocean_breadcrumbs_separator_color":"","ocean_breadcrumbs_links_color":"","ocean_breadcrumbs_links_hover_color":"","ocean_display_footer_widgets":"default","ocean_display_footer_bottom":"default","ocean_custom_footer_template":"0","footnotes":""},"class_list":["post-33","page","type-page","status-publish","hentry","entry"],"_links":{"self":[{"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/pages\/33","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/comments?post=33"}],"version-history":[{"count":68,"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/pages\/33\/revisions"}],"predecessor-version":[{"id":752,"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/pages\/33\/revisions\/752"}],"wp:attachment":[{"href":"https:\/\/platinamall.com\/index.php\/wp-json\/wp\/v2\/media?parent=33"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}