diff --git a/package-lock.json b/package-lock.json
index b41fa80..2bf3d97 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3638,6 +3638,15 @@
       "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
       "optional": true
     },
+    "bindings": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "optional": true,
+      "requires": {
+        "file-uri-to-path": "1.0.0"
+      }
+    },
     "bluebird": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -3979,6 +3988,11 @@
       "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.2.0.tgz",
       "integrity": "sha512-c7wVvbw3f37nuobQNtgsgG9POC9qMbNuMQmTCqZv23b6MIz0fcYpBiOlv9gEN/hdLdnZTDQhg6e9Dq5M1vKvfg=="
     },
+    "can-use-dom": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/can-use-dom/-/can-use-dom-0.1.0.tgz",
+      "integrity": "sha1-IsxKNKCrxDlQ9CxkEQJKP2NmtFo="
+    },
     "caniuse-api": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-3.0.0.tgz",
@@ -4023,6 +4037,11 @@
         "supports-color": "^5.3.0"
       }
     },
+    "change-emitter": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/change-emitter/-/change-emitter-0.1.6.tgz",
+      "integrity": "sha1-6LL+PX8at9aaMhma/5HqaTFAlRU="
+    },
     "char-regex": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-1.0.2.tgz",
@@ -5478,6 +5497,24 @@
       "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
       "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k="
     },
+    "encoding": {
+      "version": "0.1.13",
+      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz",
+      "integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
+      "requires": {
+        "iconv-lite": "^0.6.2"
+      },
+      "dependencies": {
+        "iconv-lite": {
+          "version": "0.6.2",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.2.tgz",
+          "integrity": "sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ==",
+          "requires": {
+            "safer-buffer": ">= 2.1.2 < 3.0.0"
+          }
+        }
+      }
+    },
     "end-of-stream": {
       "version": "1.4.4",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
@@ -6619,6 +6656,35 @@
         "bser": "2.1.1"
       }
     },
+    "fbjs": {
+      "version": "0.8.17",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.17.tgz",
+      "integrity": "sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=",
+      "requires": {
+        "core-js": "^1.0.0",
+        "isomorphic-fetch": "^2.1.1",
+        "loose-envify": "^1.0.0",
+        "object-assign": "^4.1.0",
+        "promise": "^7.1.1",
+        "setimmediate": "^1.0.5",
+        "ua-parser-js": "^0.7.18"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+        },
+        "promise": {
+          "version": "7.3.1",
+          "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
+          "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
+          "requires": {
+            "asap": "~2.0.3"
+          }
+        }
+      }
+    },
     "figgy-pudding": {
       "version": "3.5.2",
       "resolved": "https://registry.npmjs.org/figgy-pudding/-/figgy-pudding-3.5.2.tgz",
@@ -6653,6 +6719,12 @@
         }
       }
     },
+    "file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "optional": true
+    },
     "filesize": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/filesize/-/filesize-6.1.0.tgz",
@@ -7147,6 +7219,11 @@
         "slash": "^3.0.0"
       }
     },
+    "google-maps-infobox": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/google-maps-infobox/-/google-maps-infobox-2.0.0.tgz",
+      "integrity": "sha512-hTuWmWZZSOxf5D/z7l3/hTF1grgRvLG53BEKMdjiKOG+FcK/kH7vqseUeyIU9Zj2ZIqKTOaro0nknxpAuRq4Vw=="
+    },
     "graceful-fs": {
       "version": "4.2.6",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.6.tgz",
@@ -7345,6 +7422,11 @@
         "minimalistic-crypto-utils": "^1.0.1"
       }
     },
+    "hoist-non-react-statics": {
+      "version": "2.5.5",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
+      "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
+    },
     "hoopy": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz",
@@ -8167,6 +8249,15 @@
       "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
       "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
     },
+    "isomorphic-fetch": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
+      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
+      "requires": {
+        "node-fetch": "^1.0.1",
+        "whatwg-fetch": ">=0.10.0"
+      }
+    },
     "isstream": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
@@ -10104,6 +10195,16 @@
         "object-visit": "^1.0.0"
       }
     },
+    "marker-clusterer-plus": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/marker-clusterer-plus/-/marker-clusterer-plus-2.1.4.tgz",
+      "integrity": "sha1-+O/3TVmdqzt9Dj/tUmTqDnBPXWc="
+    },
+    "markerwithlabel": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/markerwithlabel/-/markerwithlabel-2.0.2.tgz",
+      "integrity": "sha512-C/cbm1A0h/u54gwHk5ZJNdUU3V3+1BbCpRPMsMyFA7vF4yL+aB4rWpxACz29TpQ+cTg6/iQroExh0PMSRGtQFg=="
+    },
     "md5.js": {
       "version": "1.3.5",
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -10426,6 +10527,12 @@
       "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
+    "nan": {
+      "version": "2.14.2",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.2.tgz",
+      "integrity": "sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ==",
+      "optional": true
+    },
     "nanoid": {
       "version": "3.1.22",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.22.tgz",
@@ -10550,6 +10657,15 @@
         }
       }
     },
+    "node-fetch": {
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
+      "integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
+      "requires": {
+        "encoding": "^0.1.11",
+        "is-stream": "^1.0.1"
+      }
+    },
     "node-forge": {
       "version": "0.10.0",
       "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
@@ -12767,6 +12883,34 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.9.tgz",
       "integrity": "sha512-nQTTcUu+ATDbrSD1BZHr5kgSD4oF8OFjxun8uAaL8RwPBacGBNPf/yAuVVdx17N8XNzRDMrZ9XcKZHCjPW+9ew=="
     },
+    "react-google-maps": {
+      "version": "9.4.5",
+      "resolved": "https://registry.npmjs.org/react-google-maps/-/react-google-maps-9.4.5.tgz",
+      "integrity": "sha512-8z5nX9DxIcBCXuEiurmRT1VXVwnzx0C6+3Es6lxB2/OyY2SLax2/LcDu6Aldxnl3HegefTL7NJzGeaKAJ61pOA==",
+      "requires": {
+        "babel-runtime": "^6.11.6",
+        "can-use-dom": "^0.1.0",
+        "google-maps-infobox": "^2.0.0",
+        "invariant": "^2.2.1",
+        "lodash": "^4.16.2",
+        "marker-clusterer-plus": "^2.1.4",
+        "markerwithlabel": "^2.0.1",
+        "prop-types": "^15.5.8",
+        "recompose": "^0.26.0",
+        "scriptjs": "^2.5.8",
+        "warning": "^3.0.0"
+      },
+      "dependencies": {
+        "warning": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
+          "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w=",
+          "requires": {
+            "loose-envify": "^1.0.0"
+          }
+        }
+      }
+    },
     "react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
@@ -12972,6 +13116,17 @@
         "picomatch": "^2.2.1"
       }
     },
+    "recompose": {
+      "version": "0.26.0",
+      "resolved": "https://registry.npmjs.org/recompose/-/recompose-0.26.0.tgz",
+      "integrity": "sha512-KwOu6ztO0mN5vy3+zDcc45lgnaUoaQse/a5yLVqtzTK13czSWnFGmXbQVmnoMgDkI5POd1EwIKSbjU1V7xdZog==",
+      "requires": {
+        "change-emitter": "^0.1.2",
+        "fbjs": "^0.8.1",
+        "hoist-non-react-statics": "^2.3.1",
+        "symbol-observable": "^1.0.4"
+      }
+    },
     "recursive-readdir": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.2.tgz",
@@ -13695,6 +13850,11 @@
         "ajv-keywords": "^3.5.2"
       }
     },
+    "scriptjs": {
+      "version": "2.5.9",
+      "resolved": "https://registry.npmjs.org/scriptjs/-/scriptjs-2.5.9.tgz",
+      "integrity": "sha512-qGVDoreyYiP1pkQnbnFAUIS5AjenNwwQBdl7zeos9etl+hYKWahjRTfzAZZYBv5xNHx7vNKCmaLDQZ6Fr2AEXg=="
+    },
     "select-hose": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
@@ -14225,6 +14385,11 @@
         "wbuf": "^1.7.3"
       }
     },
+    "spectre.css": {
+      "version": "0.5.9",
+      "resolved": "https://registry.npmjs.org/spectre.css/-/spectre.css-0.5.9.tgz",
+      "integrity": "sha512-9jUqwZmCnvflrxFGcK+ize43TvjwDjqMwZPVubEtSIHzvinH0TBUESm1LcOJx3Ur7bdPaeOHQIjOqBl1Y5kLFw=="
+    },
     "split-string": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
@@ -14625,6 +14790,11 @@
         "util.promisify": "~1.0.0"
       }
     },
+    "symbol-observable": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
+      "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ=="
+    },
     "symbol-tree": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
@@ -15091,6 +15261,11 @@
         "is-typedarray": "^1.0.0"
       }
     },
+    "ua-parser-js": {
+      "version": "0.7.26",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.26.tgz",
+      "integrity": "sha512-VwIvGlFNmpKbjzRt51jpbbFTrKIEgGHxIwA8Y69K1Bqc6bTIV7TaGGABOkghSFQWsLmcRB4drGvpfv9z2szqoQ=="
+    },
     "uglify-js": {
       "version": "3.13.2",
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.13.2.tgz",
@@ -15573,7 +15748,11 @@
           "version": "1.2.13",
           "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
           "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
-          "optional": true
+          "optional": true,
+          "requires": {
+            "bindings": "^1.5.0",
+            "nan": "^2.12.1"
+          }
         },
         "glob-parent": {
           "version": "3.1.0",
@@ -16172,7 +16351,11 @@
           "version": "1.2.13",
           "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
           "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
-          "optional": true
+          "optional": true,
+          "requires": {
+            "bindings": "^1.5.0",
+            "nan": "^2.12.1"
+          }
         },
         "glob-parent": {
           "version": "3.1.0",
diff --git a/package.json b/package.json
index 5a6d592..789e1f1 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,9 @@
     "react-bootstrap": "^1.5.2",
     "react-bootstrap-carousel": "^4.1.1",
     "react-dom": "^17.0.2",
+    "react-google-maps": "^9.4.5",
     "react-scripts": "4.0.3",
+    "spectre.css": "^0.5.9",
     "web-vitals": "^1.1.1"
   },
   "scripts": {
diff --git a/public/home-solid.svg b/public/home-solid.svg
new file mode 100644
index 0000000..5b996f1
--- /dev/null
+++ b/public/home-solid.svg
@@ -0,0 +1 @@
+<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="home" class="svg-inline--fa fa-home fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="#55b578" d="M280.37 148.26L96 300.11V464a16 16 0 0 0 16 16l112.06-.29a16 16 0 0 0 15.92-16V368a16 16 0 0 1 16-16h64a16 16 0 0 1 16 16v95.64a16 16 0 0 0 16 16.05L464 480a16 16 0 0 0 16-16V300L295.67 148.26a12.19 12.19 0 0 0-15.3 0zM571.6 251.47L488 182.56V44.05a12 12 0 0 0-12-12h-56a12 12 0 0 0-12 12v72.61L318.47 43a48 48 0 0 0-61 0L4.34 251.47a12 12 0 0 0-1.6 16.9l25.5 31A12 12 0 0 0 45.15 301l235.22-193.74a12.19 12.19 0 0 1 15.3 0L530.9 301a12 12 0 0 0 16.9-1.6l25.5-31a12 12 0 0 0-1.7-16.93z"></path></svg>
\ No newline at end of file
diff --git a/public/home.svg b/public/home.svg
new file mode 100644
index 0000000..f82df04
--- /dev/null
+++ b/public/home.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 64 64" width="64px" height="64px"><path fill="#faefde" d="M55 33L31 13 7 33 7 57 55 57z"/><path fill="#efd8be" d="M31,13L7,33v1.7c0,1.1,0.9,2,2,2c0.5,0,0.9-0.2,1.3-0.5l20.1-16.7c0.4-0.3,0.9-0.3,1.3,0l20.1,16.7 c0.8,0.7,2.1,0.6,2.8-0.3c0.3-0.4,0.5-0.8,0.5-1.3V33L31,13z"/><path fill="#f9dd8f" d="M7 47H55V57H7z"/><path fill="#cda1a7" d="M31.6,13.5l25.7,21.1c0.4,0.3,1.1,0.3,1.4-0.1c0.1-0.2,0.2-0.4,0.2-0.6V31c0-0.6-0.3-1.2-0.7-1.5L32.3,8 c-0.7-0.6-1.8-0.6-2.5,0l-26,21.4C3.3,29.8,3,30.3,3,31v2.9c0,0.6,0.5,1,1,1c0.2,0,0.4-0.1,0.6-0.2l25.7-21.1 C30.7,13.2,31.3,13.2,31.6,13.5z"/><path fill="#8d6c9f" d="M16 50c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1 .6 0 1-.4 1-1v-2C17 50.4 16.6 50 16 50zM11 50c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1s1-.4 1-1v-2C12 50.4 11.6 50 11 50zM46 50c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1s1-.4 1-1v-2C47 50.4 46.6 50 46 50zM51 50c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1s1-.4 1-1v-2C52 50.4 51.6 50 51 50z"/><path fill="#bbdef9" d="M31 20A4 4 0 1 0 31 28A4 4 0 1 0 31 20Z"/><path fill="#8d6c9f" d="M31,19c-2.8,0-5,2.2-5,5s2.2,5,5,5s5-2.2,5-5S33.8,19,31,19z M31,27.2c-1.8,0-3.2-1.4-3.2-3.2s1.4-3.2,3.2-3.2 c1.8,0,3.2,1.4,3.2,3.2v0C34.2,25.8,32.8,27.2,31,27.2z"/><path fill="#ed7899" d="M25 37H37V57H25z"/><path fill="#8d6c9f" d="M33,45c-0.6,0-1,0.4-1,1v2c0,0.6,0.4,1,1,1s1-0.4,1-1v-2C34,45.4,33.6,45,33,45z"/><path fill="#8d6c9f" d="M56.7,35.4c0.9,0.7,2.1,0.6,2.8-0.3c0.3-0.4,0.5-0.8,0.5-1.3V31c0-0.9-0.4-1.8-1.1-2.3l-26-21.4 c-1.1-0.9-2.7-0.9-3.8,0L18,16.4v-3.3c0-0.6-0.4-1-1-1s-1,0.4-1,1v5l-2,1.6V9.1c0-0.6-0.4-1-1-1s-1,0.4-1,1v12c0,0.1,0,0.1,0,0.2 l-8.9,7.4C2.4,29.2,2,30.1,2,31v2.9c0,0.8,0.4,1.5,1.2,1.8c0.7,0.3,1.5,0.2,2.1-0.3L6,34.8V56H3c-0.6,0-1,0.4-1,1s0.4,1,1,1h56 c0.6,0,1-0.4,1-1s-0.4-1-1-1h-3V34.8L56.7,35.4z M22,56h-2H8v-8h16v8H22z M26,56V38h10v18H26z M54,56H42h-2h-2v-8h16V56z M54,38v8 H38v-8c0-1.1-0.9-2-2-2H26c-1.1,0-2,0.9-2,2v8H8v-8v-4.8l23-18.9l23,18.9V38z M32.3,12.8c-0.7-0.6-1.8-0.6-2.5,0L4,33.9V31 c0-0.3,0.1-0.6,0.4-0.8l26-21.4c0.4-0.3,0.9-0.3,1.3,0l26,21.4c0.2,0.2,0.4,0.5,0.4,0.8v2.9L32.3,12.8z"/><path fill="#8d6c9f" d="M21 50c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1s1-.4 1-1v-2C22 50.4 21.6 50 21 50zM41 50c-.6 0-1 .4-1 1v2c0 .6.4 1 1 1s1-.4 1-1v-2C42 50.4 41.6 50 41 50z"/></svg>
\ No newline at end of file
diff --git a/public/homes-2.svg b/public/homes-2.svg
new file mode 100644
index 0000000..20b0053
--- /dev/null
+++ b/public/homes-2.svg
@@ -0,0 +1 @@
+<?xml version="1.0"?><svg fill="#000000" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 128 128" width="64px" height="64px">    <path d="M 70 18.074219 C 69.225 18.074219 68.450391 18.350391 67.900391 18.900391 L 14.099609 72.599609 C 12.899609 73.799609 12.899609 75.700781 14.099609 76.800781 L 22.599609 85.300781 C 23.199609 85.900781 23.899219 86.199219 24.699219 86.199219 C 25.499219 86.199219 26.300781 85.900781 26.800781 85.300781 L 70 42.199219 L 102 74.199219 L 102 114.5 C 99.1 115.5 96.899219 118 96.199219 121 L 84 121 L 84 80 C 84 78.3 82.7 77 81 77 L 59 77 C 57.3 77 56 78.3 56 80 L 56 121 L 38 121 L 38 94 C 38 92.3 36.7 91 35 91 C 33.3 91 32 92.3 32 94 L 32 101.40039 C 27.1 102.60039 23.300781 106.40078 22.300781 111.30078 C 17.400781 112.30078 13.500391 116.2 12.400391 121 L 4 121 C 2.3 121 1 122.3 1 124 C 1 125.7 2.3 127 4 127 L 99 127 C 100.7 127 102 125.7 102 124 L 102 123 C 102 121.3 103.3 120 105 120 C 106.7 120 108 121.3 108 123 L 108 124 C 108 125.7 109.3 127 111 127 L 114 127 C 115.7 127 117 125.7 117 124 C 117 122.3 115.7 121 114 121 L 113.80078 121 C 113.10078 118 110.9 115.5 108 114.5 L 108 80.199219 L 113.09961 85.300781 C 113.69961 85.900781 114.39922 86.199219 115.19922 86.199219 C 115.99922 86.199219 116.80078 85.900781 117.30078 85.300781 L 125.80078 76.800781 C 127.00078 75.600781 127.00078 73.699609 125.80078 72.599609 L 72.099609 18.900391 C 71.549609 18.350391 70.775 18.074219 70 18.074219 z M 70 25.300781 L 119.5 74.800781 L 115.30078 79 L 72.099609 35.900391 C 71.499609 35.300391 70.8 35 70 35 C 69.2 35 68.500391 35.300391 67.900391 35.900391 L 24.699219 79 L 20.5 74.800781 L 70 25.300781 z M 64 101 C 65.7 101 67 102.3 67 104 C 67 105.7 65.7 107 64 107 C 62.3 107 61 105.7 61 104 C 61 102.3 62.3 101 64 101 z M 32 107.69922 L 32 121 L 18.699219 121 C 19.799219 118.6 22.2 117 25 117 C 26.7 117 28 115.7 28 114 C 28 111.2 29.6 108.79922 32 107.69922 z M 124 121 A 3 3 0 0 0 121 124 A 3 3 0 0 0 124 127 A 3 3 0 0 0 127 124 A 3 3 0 0 0 124 121 z"/></svg>
\ No newline at end of file
diff --git a/public/homes-3.svg b/public/homes-3.svg
new file mode 100644
index 0000000..82a9ef8
--- /dev/null
+++ b/public/homes-3.svg
@@ -0,0 +1 @@
+<?xml version="1.0"?><svg fill="#000000" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="50px" height="50px">    <path d="M 25 1.0507812 C 24.7825 1.0507812 24.565859 1.1197656 24.380859 1.2597656 L 1.3808594 19.210938 C 0.95085938 19.550938 0.8709375 20.179141 1.2109375 20.619141 C 1.5509375 21.049141 2.1791406 21.129062 2.6191406 20.789062 L 4 19.710938 L 4 46 C 4 46.55 4.45 47 5 47 L 19 47 L 19 29 L 31 29 L 31 47 L 45 47 C 45.55 47 46 46.55 46 46 L 46 19.710938 L 47.380859 20.789062 C 47.570859 20.929063 47.78 21 48 21 C 48.3 21 48.589063 20.869141 48.789062 20.619141 C 49.129063 20.179141 49.049141 19.550938 48.619141 19.210938 L 25.619141 1.2597656 C 25.434141 1.1197656 25.2175 1.0507812 25 1.0507812 z M 35 5 L 35 6.0507812 L 41 10.730469 L 41 5 L 35 5 z"/></svg>
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index 91eee89..39d0714 100644
--- a/public/index.html
+++ b/public/index.html
@@ -55,7 +55,7 @@
       crossorigin="anonymous"
     ></script>
 
-    <title>Kene's Crib</title>
+    <title>Kene's Cribs</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
diff --git a/src/App.js b/src/App.js
index 8a4cd7b..72475d5 100644
--- a/src/App.js
+++ b/src/App.js
@@ -7,6 +7,8 @@ import ListingsPage from "./listings-page/listings-page";
 import AgentPage from "./agent-page/agent-page";
 import ContactUs from "./shared-components/Contact-us/Contact-us";
 
+import Homepage from "./homePage/Homepage";
+
 class App extends Component {
   render() {
     return (
@@ -20,6 +22,9 @@ class App extends Component {
         </BrowserRouter>
 
         <Footer></Footer>
+        {/* <Homepage/> */}
+
+        <Homepage />
       </div>
     );
   }
diff --git a/src/agent-page/AgentPage.js b/src/agent-page/AgentPage.js
new file mode 100644
index 0000000..0d90622
--- /dev/null
+++ b/src/agent-page/AgentPage.js
@@ -0,0 +1,41 @@
+import React, { Component } from "react";
+import Agents from './Agents'
+import './agent-page.css';
+import Carousel from 'react-bootstrap/Carousel'
+import Agent1 from "../images/Agent1.jpg";
+import Agent2 from "../images/Agent2.jpg";
+import Agent3 from "../images/Agent3.jpg";
+import Agent4 from "../images/Agent4.jpg";
+import Agent5 from "../images/Agent5.jpg";
+import Agent6 from "../images/Agent6.jpg";
+ class AgentPage extends Component {
+   state={
+     agents: [
+     
+      {title:'head sales assistant',name: 'Michael', src: Agent1,word:'Michael has a genuine passion for helping others and for giving back to the community.',id:1},
+       {title:'sales assistant',name: 'Jin', src: Agent2,word:'I have a passion for assisting clients with various real estate needs.',id:2},
+       {title:'sales assistant',name: 'Anita', src: Agent3,word:'Anita looks forward to servicing you to her fullest potential, building long-lasting relationships and making your real estate experience a smooth and memorable one.',id:3},
+       {title:'sales assistant',name: 'Alex', src: Agent4,word:'Since getting licensed in 2010 Alex has consistently been a top producing agent in the GTA',id:4},
+       {title:'sales assistant',name: 'Xuan', src: Agent5,word:'Xuan grew up in the GTA, and he explored many different neighborhoods in and surrounding Toronto. ',id:5},
+       {title:'sales assistant',name: 'Walter', src: Agent6,word:'Walter Henry has always been one to follow his passion. At 13 years old, he started his career as a competitive gymnast.Walter will be certain that you feel informed and at ease throughout the entire process.',id:6},
+
+  
+     ]
+    }  
+    render(){
+      return(
+          <div className="container">
+              <div className="center  blue-text text-darken-4">
+                  <h1>Meet the team</h1>
+              </div>
+            
+              <Agents agents={this.state.agents} />
+          </div>
+      )
+  }
+  displayAgents= (agent) => {
+    console.log(agent);
+  }
+
+}
+export default AgentPage;
diff --git a/src/agent-page/Agents.js b/src/agent-page/Agents.js
new file mode 100644
index 0000000..ef8b34e
--- /dev/null
+++ b/src/agent-page/Agents.js
@@ -0,0 +1,40 @@
+import React from "react";
+import AgentPage from "./AgentPage";
+/* import {Link} from 'react-router-dom' */
+import Card from "react-bootstrap/Card";
+import Button from "react-bootstrap/Button";
+
+const Agents = ({ agents }) => {
+  const agentlist = agents.map((agent) => {
+    return (
+      <div className="agent" key={agent.id}>
+        {}
+            <Card style={{ width: "18rem" }}>
+              <Card.Img variant="top" src={agent.src} />
+              <Card.Body>
+                <Card.Title>{agent.title}</Card.Title>
+                <Card.Text>{agent.name}</Card.Text>
+                <Card.Text>
+                  {agent.word}
+                </Card.Text>
+                <Button variant="primary">VIEW</Button>
+              </Card.Body>
+            </Card>
+      </div>
+    );
+  });
+  console.log(agentlist);
+  return (
+    <div className="agent-list">
+      <div className="row">
+        <div className="col m4">{agentlist[0]}</div>
+        <div className="col m4">{agentlist[1]}</div>
+        <div className="col m4">{agentlist[2]}</div>
+        <div className="col m4">{agentlist[3]}</div>
+        <div className="col m4">{agentlist[4]}</div>
+        <div className="col m4">{agentlist[5]}</div>
+      </div>
+    </div>
+  );
+};
+export default Agents;
diff --git a/src/agent-page/agent-page.css b/src/agent-page/agent-page.css
index e69de29..6e07d46 100644
--- a/src/agent-page/agent-page.css
+++ b/src/agent-page/agent-page.css
@@ -0,0 +1,19 @@
+.agentPage {
+    background-image: url('../images/Agent1.jpg');
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-attachment: scroll;
+  }
+  
+  @media screen and (min-width: 992px) {
+    .miniHero {
+      background-position-y: -150px;
+    }
+  }
+  .center{
+    height: 25vh; /* Magic here */
+    background-color: yellow;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
\ No newline at end of file
diff --git a/src/agent-page/agent-page.js b/src/agent-page/agent-page.js
deleted file mode 100644
index a53bbf7..0000000
--- a/src/agent-page/agent-page.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React, { Component } from "react";
-
-class AgentPage extends Component {
-  render() {
-    return <div>AgentPage</div>;
-  }
-}
-
-export default AgentPage;
diff --git a/src/agent-page/workspace.code-workspace b/src/agent-page/workspace.code-workspace
new file mode 100644
index 0000000..ec89ccf
--- /dev/null
+++ b/src/agent-page/workspace.code-workspace
@@ -0,0 +1,7 @@
+{
+    "folders": [
+        {
+            "path": "../../.."
+        }
+    ]
+}
\ No newline at end of file
diff --git a/src/homePage/Homepage.css b/src/homePage/Homepage.css
new file mode 100644
index 0000000..2d082b7
--- /dev/null
+++ b/src/homePage/Homepage.css
@@ -0,0 +1,62 @@
+.colored-section {
+    background-color: #ffe609;
+    color: #000000;
+    white-space: nowrap;
+}
+
+.white-section {
+    background-color: #ffffff;
+}
+
+#title .container-fluid {
+    padding: 4% 34% 6%;
+    text-align: left;
+    font-family: "Georgia";
+}
+
+.housesIntro{
+    padding: 4% 5%;
+}
+
+.contactIntro{
+    padding-left: 30%;
+    padding-right: 30%;
+    padding-bottom: 80px;
+}
+
+.carouselSection {
+    margin: 2% 8%;
+}
+
+.headerImg{
+    width: 2000px;
+    height: 600px;
+}
+
+.heading-1{
+    padding-left: 40%;
+    padding-top: 10%;
+    padding-bottom: 20px;
+}
+
+.formhelper{
+    padding-bottom: 15px;
+}
+
+.button-1 {
+    background-color: rgb(0, 0, 0);
+    border-color: transparent;
+    color: #ffffff;
+    font-size: 20px;
+}
+
+.button-1:hover {
+    background-color: rgb(92, 92, 92);
+    color: #ffffff;
+    border-color: transparent;
+}
+
+.buttonhelper {
+    padding-left: 45%;
+    padding-top: 15px;
+}
\ No newline at end of file
diff --git a/src/homePage/Homepage.js b/src/homePage/Homepage.js
new file mode 100644
index 0000000..f95a614
--- /dev/null
+++ b/src/homePage/Homepage.js
@@ -0,0 +1,107 @@
+import { Component } from "react";
+import './Homepage.css';
+import house1 from '../images/house1.jpg';
+import house2 from '../images/house2.jpg';
+import house3 from '../images/house3.jpg';
+import Carousel from 'react-bootstrap/Carousel'
+
+class Homepage extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            firstname: '',
+            lastname: '',
+            email: '',
+            message: ''
+        }
+    }
+
+    render() {
+        return (
+            <div className="Homepage">
+                <section className="colored-section" id="title">
+                    <div className="container-fluid">
+                        <div className="row">
+                            <div className="col-12">
+                                <h1 className="big-heading">YOU ARE NOT BUYING A HOUSE, </h1>
+                                <h1 className="big-heading">YOU ARE BUYING A LIFESTYLE. </h1>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+                <section className="white-section" id="white-section">
+                    <div className="housesIntro">
+                        <Carousel>
+                            <Carousel.Item>
+                                <img
+                                    className="headerImg"
+                                    src={house1}
+                                    alt="First House"
+                                />
+                            </Carousel.Item>
+                            <Carousel.Item>
+                                <img
+                                    className="headerImg"
+                                    src={house2}
+                                    alt="Second House"
+                                />
+
+                            </Carousel.Item>
+                            <Carousel.Item>
+                                <img
+                                    className="headerImg"
+                                    src={house3}
+                                    alt="Third House"
+                                />
+
+                            </Carousel.Item>
+                        </Carousel>
+                    </div>
+                </section>
+                <section class="colored-section" id="contact">
+                    <div className="container-fluid">
+                        <div className="contactIntro">
+                            <h2 className="heading-1">Contact Us</h2>
+                            <form id="contact-form" onSubmit={this.handleSubmit.bind(this)} method="POST">
+                                <div className="formhelper row">
+                                    <div className="col-6">
+                                        <input type="text" className="form-control" placeholder="First Name" value={this.state.name} onChange={this.onNameChange.bind(this)} />
+                                    </div>
+                                    <div className="col-6">
+                                        <input type="text" className="form-control" placeholder="Last Name" value={this.state.name} onChange={this.onNameChange.bind(this)} />
+                                    </div>
+                                </div>
+                                <div className="form-group">
+                                    <input type="email" className="form-control" placeholder="Email Address" aria-describedby="emailHelp" value={this.state.email} onChange={this.onEmailChange.bind(this)} />
+                                </div>
+                                <div className="form-group">
+                                    <textarea className="form-control" placeholder="Message" rows="5" value={this.state.message} onChange={this.onMessageChange.bind(this)} />
+                                </div>
+                                <div className="buttonhelper">
+                                    <button type="submit" className="button-1">Submit</button>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </section>
+            </div>
+        );
+    }
+
+    onNameChange(event) {
+        this.setState({ name: event.target.value })
+    }
+
+    onEmailChange(event) {
+        this.setState({ email: event.target.value })
+    }
+
+    onMessageChange(event) {
+        this.setState({ message: event.target.value })
+    }
+
+    handleSubmit(event) {
+    }
+}
+
+export default Homepage;
diff --git a/src/homePage/homePage.css b/src/homePage/homePage.css
index e69de29..2d082b7 100644
--- a/src/homePage/homePage.css
+++ b/src/homePage/homePage.css
@@ -0,0 +1,62 @@
+.colored-section {
+    background-color: #ffe609;
+    color: #000000;
+    white-space: nowrap;
+}
+
+.white-section {
+    background-color: #ffffff;
+}
+
+#title .container-fluid {
+    padding: 4% 34% 6%;
+    text-align: left;
+    font-family: "Georgia";
+}
+
+.housesIntro{
+    padding: 4% 5%;
+}
+
+.contactIntro{
+    padding-left: 30%;
+    padding-right: 30%;
+    padding-bottom: 80px;
+}
+
+.carouselSection {
+    margin: 2% 8%;
+}
+
+.headerImg{
+    width: 2000px;
+    height: 600px;
+}
+
+.heading-1{
+    padding-left: 40%;
+    padding-top: 10%;
+    padding-bottom: 20px;
+}
+
+.formhelper{
+    padding-bottom: 15px;
+}
+
+.button-1 {
+    background-color: rgb(0, 0, 0);
+    border-color: transparent;
+    color: #ffffff;
+    font-size: 20px;
+}
+
+.button-1:hover {
+    background-color: rgb(92, 92, 92);
+    color: #ffffff;
+    border-color: transparent;
+}
+
+.buttonhelper {
+    padding-left: 45%;
+    padding-top: 15px;
+}
\ No newline at end of file
diff --git a/src/homePage/homePage.js b/src/homePage/homePage.js
index fba8d3b..f95a614 100644
--- a/src/homePage/homePage.js
+++ b/src/homePage/homePage.js
@@ -1,9 +1,107 @@
-import React, { Component } from "react";
+import { Component } from "react";
+import './Homepage.css';
+import house1 from '../images/house1.jpg';
+import house2 from '../images/house2.jpg';
+import house3 from '../images/house3.jpg';
+import Carousel from 'react-bootstrap/Carousel'
 
-class HomePage extends Component {
-  render() {
-    return <div>HomePage</div>;
-  }
+class Homepage extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            firstname: '',
+            lastname: '',
+            email: '',
+            message: ''
+        }
+    }
+
+    render() {
+        return (
+            <div className="Homepage">
+                <section className="colored-section" id="title">
+                    <div className="container-fluid">
+                        <div className="row">
+                            <div className="col-12">
+                                <h1 className="big-heading">YOU ARE NOT BUYING A HOUSE, </h1>
+                                <h1 className="big-heading">YOU ARE BUYING A LIFESTYLE. </h1>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+                <section className="white-section" id="white-section">
+                    <div className="housesIntro">
+                        <Carousel>
+                            <Carousel.Item>
+                                <img
+                                    className="headerImg"
+                                    src={house1}
+                                    alt="First House"
+                                />
+                            </Carousel.Item>
+                            <Carousel.Item>
+                                <img
+                                    className="headerImg"
+                                    src={house2}
+                                    alt="Second House"
+                                />
+
+                            </Carousel.Item>
+                            <Carousel.Item>
+                                <img
+                                    className="headerImg"
+                                    src={house3}
+                                    alt="Third House"
+                                />
+
+                            </Carousel.Item>
+                        </Carousel>
+                    </div>
+                </section>
+                <section class="colored-section" id="contact">
+                    <div className="container-fluid">
+                        <div className="contactIntro">
+                            <h2 className="heading-1">Contact Us</h2>
+                            <form id="contact-form" onSubmit={this.handleSubmit.bind(this)} method="POST">
+                                <div className="formhelper row">
+                                    <div className="col-6">
+                                        <input type="text" className="form-control" placeholder="First Name" value={this.state.name} onChange={this.onNameChange.bind(this)} />
+                                    </div>
+                                    <div className="col-6">
+                                        <input type="text" className="form-control" placeholder="Last Name" value={this.state.name} onChange={this.onNameChange.bind(this)} />
+                                    </div>
+                                </div>
+                                <div className="form-group">
+                                    <input type="email" className="form-control" placeholder="Email Address" aria-describedby="emailHelp" value={this.state.email} onChange={this.onEmailChange.bind(this)} />
+                                </div>
+                                <div className="form-group">
+                                    <textarea className="form-control" placeholder="Message" rows="5" value={this.state.message} onChange={this.onMessageChange.bind(this)} />
+                                </div>
+                                <div className="buttonhelper">
+                                    <button type="submit" className="button-1">Submit</button>
+                                </div>
+                            </form>
+                        </div>
+                    </div>
+                </section>
+            </div>
+        );
+    }
+
+    onNameChange(event) {
+        this.setState({ name: event.target.value })
+    }
+
+    onEmailChange(event) {
+        this.setState({ email: event.target.value })
+    }
+
+    onMessageChange(event) {
+        this.setState({ message: event.target.value })
+    }
+
+    handleSubmit(event) {
+    }
 }
 
-export default HomePage;
+export default Homepage;
diff --git a/src/images/Agent1.jpg b/src/images/Agent1.jpg
new file mode 100644
index 0000000..716c1dd
Binary files /dev/null and b/src/images/Agent1.jpg differ
diff --git a/src/images/Agent2.jpg b/src/images/Agent2.jpg
new file mode 100644
index 0000000..03735d5
Binary files /dev/null and b/src/images/Agent2.jpg differ
diff --git a/src/images/Agent3.jpg b/src/images/Agent3.jpg
new file mode 100644
index 0000000..205480b
Binary files /dev/null and b/src/images/Agent3.jpg differ
diff --git a/src/images/Agent4.jpg b/src/images/Agent4.jpg
new file mode 100644
index 0000000..a60aa5f
Binary files /dev/null and b/src/images/Agent4.jpg differ
diff --git a/src/images/Agent5.jpg b/src/images/Agent5.jpg
new file mode 100644
index 0000000..4580d5f
Binary files /dev/null and b/src/images/Agent5.jpg differ
diff --git a/src/images/Agent6.jpg b/src/images/Agent6.jpg
new file mode 100644
index 0000000..288ae24
Binary files /dev/null and b/src/images/Agent6.jpg differ
diff --git a/src/listings-page/ListingsPage.css b/src/listings-page/ListingsPage.css
new file mode 100644
index 0000000..80ebdc9
--- /dev/null
+++ b/src/listings-page/ListingsPage.css
@@ -0,0 +1,9 @@
+.booking_button{
+    text-align: right; 
+}
+
+.popup_nums{
+    font-size: 40px;
+    font-weight:bolder;
+    padding-right: 5%;
+};
\ No newline at end of file
diff --git a/src/listings-page/ListingsPage.js b/src/listings-page/ListingsPage.js
new file mode 100644
index 0000000..49d6045
--- /dev/null
+++ b/src/listings-page/ListingsPage.js
@@ -0,0 +1,194 @@
+import React, { useState, useEffect, Component } from "react";
+import {
+  GoogleMap, 
+  withScriptjs, 
+  withGoogleMap,
+  Marker,
+  InfoWindow
+ } from "react-google-maps";
+ import * as listingData from "./data/property-data.json";
+ import mapStyles from "./mapStyles";
+ import "./ListingsPage.css";
+
+function Map(){
+
+  const [selectedProperty, setSelectedProperty] = useState(null);
+
+
+
+  return (
+    <GoogleMap
+      defaultZoom={10}
+      defaultCenter={{lat: 45.4231, lng:-75.6931}}
+      //https://snazzymaps.com/explore
+      defaultOptions={{styles: mapStyles}}
+    >
+
+        {listingData.Properties.map(house => (
+
+          <Marker
+            key={house.LISTING_ID}
+            position={{ 
+              lat: house.coordinates[1],
+              lng: house.coordinates[0]
+            
+            }}      
+
+            onClick={() => {
+              setSelectedProperty(house)
+            }}      
+
+            icon={{
+              url:"homes-3.svg",
+              scaledSize: new window.google.maps.Size(50,50)
+            }}
+            
+
+            
+          />
+        
+        
+        
+        ))}
+
+
+        {selectedProperty && (
+          
+          <InfoWindow
+            position={{ 
+              lat: selectedProperty.coordinates[1],
+              lng: selectedProperty.coordinates[0]
+            
+            }} 
+            onCloseClick={() => {
+             setSelectedProperty(null);
+            }}
+          >
+            <div> 
+              <h2>{selectedProperty.ADDRESS}</h2>
+              <p> {selectedProperty.DESC}</p>
+              <div>
+                <div class="row">
+
+                  <div className="col-6">
+                  <i class="fas fa-bed fa-3x"></i> <span class="popup_nums"> 1 </span>
+                  <i class="fas fa-bath fa-3x"></i> <span class="popup_nums"> 2</span>
+           
+
+
+                  </div>
+
+                  <div className="col-6 booking_button">
+                  <button>Show Listing</button>
+
+
+                  </div>
+
+                </div>
+                
+
+              </div>
+     
+              
+            </div>
+          </InfoWindow>
+
+        )}
+
+      
+
+
+
+    </GoogleMap>
+  
+   
+  );
+
+}
+
+const MapWrapped = withScriptjs(withGoogleMap(Map))
+
+
+class ListingsPage extends Component {
+  render() {
+    return (
+
+    <div className="listings">
+
+      <section class="colored-section2" id="cta">
+
+
+      {/*
+      
+    
+    
+        <div class="row"> 
+
+    
+          <div class="col-12">
+          
+            <div class="dropdown">
+              <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
+                Dropdown button
+              </button>
+              <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
+                <li><a class="dropdown-item" href="#">Action</a></li>
+                <li><a class="dropdown-item" href="#">Another action</a></li>
+                <li><a class="dropdown-item" href="#">Something else here</a></li>
+              </ul>
+            </div>
+
+            <div class="dropdown">
+              <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
+                Dropdown button
+              </button>
+              <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
+                <li><a class="dropdown-item" href="#">Action</a></li>
+                <li><a class="dropdown-item" href="#">Another action</a></li>
+                <li><a class="dropdown-item" href="#">Something else here</a></li>
+              </ul>
+            </div>
+
+          </div>
+
+        </div>
+  */}
+       
+        <div class="row"> 
+
+          <div class="col-12">
+
+            <h2> Map </h2>
+       
+            <div style={{ width: "100vm", height: "800px" }}>
+              <MapWrapped
+                googleMapURL={`https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,drawing,places&key=
+                AIzaSyDD2ndQ18tRLgWUwGw18MHAgrfinSMWBYw`}
+                loadingElement={<div style={{ height: `100%` }} />}
+                containerElement={<div style={{ height: `100%` }} />}
+                mapElement={<div style={{ height: `100%` }} />}
+              />
+            </div>
+
+
+
+
+          </div>
+        
+        </div>
+
+     
+          
+
+      </section>
+
+    
+    </div>
+    
+
+
+    ); 
+  }
+}
+
+export default ListingsPage;
diff --git a/src/listings-page/listings-page.test.js b/src/listings-page/ListingsPage.test.js
similarity index 83%
rename from src/listings-page/listings-page.test.js
rename to src/listings-page/ListingsPage.test.js
index f43ce73..4f49e33 100644
--- a/src/listings-page/listings-page.test.js
+++ b/src/listings-page/ListingsPage.test.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { shallow } from "enzyme";
-import ListingsPage from "./listings-page";
+import ListingsPage from "./ListingsPage";
 
 describe("ListingsPage", () => {
   test("matches snapshot", () => {
diff --git a/src/listings-page/data/house-listings.json b/src/listings-page/data/house-listings.json
new file mode 100644
index 0000000..c38853d
--- /dev/null
+++ b/src/listings-page/data/house-listings.json
@@ -0,0 +1,789 @@
+{
+    "type": "FeatureCollection",
+    "crs": {
+      "type": "name",
+      "properties": {"name": "urn: ogc: def: crs: OGC: 1.3: CRS84"}
+    },
+    "features": [
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 960,
+          "FACILITYID": 28014,
+          "NAME": "Bearbrook Skateboard Park",
+          "NAME_FR": "Bearbrook skate park",
+          "ADDRESS": "8720 Russell Road",
+          "ADDRESS_FR": "8720, chemin Russell",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.3372987731628, 45.383321536272049]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1219,
+          "FACILITYID": 28001,
+          "NAME": "Bob MacQuarrie Skateboard Park (SK8 Extreme Park)",
+          "NAME_FR": "Bob-MacQuarrie Skate Park (SK8 Extreme Park)",
+          "ADDRESS": "1490 Youville Drive",
+          "ADDRESS_FR": "1490, promenade Youville",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Flat asphalt surface, 10 components, City run learn to skateboard programs, City run skateboard camps in summer",
+          "DESCRIPT_1": "Flat asphalt surface, 10 modules, programs and summer skateboard camps managed by the City",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.546518086577947, 45.467134581917357]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1157,
+          "FACILITYID": 28002,
+          "NAME": "Walter Baker Skateboard Park",
+          "NAME_FR": "Walter-Baker skate park",
+          "ADDRESS": "100 Charlie Rogers Place",
+          "ADDRESS_FR": "100, place Charlie Rogers",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Concrete bowl, 7,000 sq ft",
+          "DESCRIPT_1": "Concrete bowl, 7,000 sq. Ft.",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.898610599532319, 45.295014379864874]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 9,
+          "FACILITYID": 28006,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "2785 8th Line Road",
+          "ADDRESS_FR": "2785, chemin 8th Line",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Mobile",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Metcalfe Community Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Metcalfe Community Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.468561642270757, 45.23032561834377]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1160,
+          "FACILITYID": 28007,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "10 Warner Colpitts Lane",
+          "ADDRESS_FR": "10, ruelle Warner Colpitts",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "yes / oui",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Indoor - Summer",
+          "MODIFIED_D": "2018/03/07",
+          "CREATED_DA": null,
+          "FACILITY": "Johnny Leroux Stittsville Community Arena - Roving Skateboard Park Location",
+          "FACILITY_F": "Stittsville Johnny-Leroux community arena - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.926651366520872, 45.260659774950561]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1693,
+          "FACILITYID": 28016,
+          "NAME": "Legacy Skateboard Park",
+          "NAME_FR": "Skatepark Legacy",
+          "ADDRESS": "101 Centrepointe Drive",
+          "ADDRESS_FR": "101, promenade Centrepointe",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "District: larger facility to service population of 100,000 plus",
+          "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
+          "DESCRIPTIO": "Large concrete bowl, many street and vertical components, 17,000 sq ft",
+          "DESCRIPT_1": "Large concrete bowl, street modules and vertical modules, 17,000 ft2",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.760933332842754, 45.345566668964558]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1717,
+          "FACILITYID": 28018,
+          "NAME": "Greenboro Skateboard Park",
+          "NAME_FR": "Greenboro skate park",
+          "ADDRESS": "3142 Conroy Road",
+          "ADDRESS_FR": "3142, chemin Conroy",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.625996131485707, 45.375401587496128]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 137,
+          "FACILITYID": 28019,
+          "NAME": "Bridlewood Skateboard Park",
+          "NAME_FR": "Bridlewood skate park",
+          "ADDRESS": "65 Stonehaven Drive",
+          "ADDRESS_FR": "65 Stonehaven Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.857009812435976, 45.290758029776626]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1133,
+          "FACILITYID": 28020,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "100 Clifford Campbell Street",
+          "ADDRESS_FR": "100, rue Clifford-Campbell",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Fitzroy Harbor Community Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Fitzroy Harbor Community Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-76.206087708136721, 45.470459866077654]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 657,
+          "FACILITYID": 28000,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "110 Malvern Drive",
+          "ADDRESS_FR": "110, promenade Malvern",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Walter Baker Sports Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Walter-Baker Sports Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.760235255689508, 45.280622216516925]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 653,
+          "FACILITYID": 28008,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "5660 Osgoode Main Street",
+          "ADDRESS_FR": "5660, rue Osgoode Main",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Mobile",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Osgoode Community Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Osgoode Community Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.60118478829267, 45.147641950106689]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 812,
+          "FACILITYID": 35050,
+          "NAME": "Charlie Bowins Skateboard Park",
+          "NAME_FR": "Charlie-Bowins skate park",
+          "ADDRESS": "435 Bronson Avenue",
+          "ADDRESS_FR": "435, avenue Bronson",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor (Commemoratively named Charlie Bowins Skateboard Park on June 10, 2015)",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": "2015/05/20",
+          "FACILITY": "District: larger facility to service population of 100,000 plus",
+          "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
+          "DESCRIPTIO": "Flat concrete surface, 10 plus components (large half pipe), City run learn to skateboard programs, City run skateboard camps in summer",
+          "DESCRIPT_1": "Flat concrete surface, 10 or more modules (large halfpipe), summer skateboard programs and camps managed by the City",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.703622500360268, 45.408488357092367]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2457,
+          "FACILITYID": 35637,
+          "NAME": "Diamond Jubilee Skateboard Park",
+          "NAME_FR": "Diamond Jubilee Skate Park",
+          "ADDRESS": "2810 Findlay Creek Drive",
+          "ADDRESS_FR": "2810 Findlay Creek Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2017/07/11",
+          "CREATED_DA": "2016/06/22",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.609516309730921, 45.314086718258636]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 430,
+          "FACILITYID": 28005,
+          "NAME": "Blackburn Skateboard Park",
+          "NAME_FR": "Blackburn skate park",
+          "ADDRESS": "190 Glen Park Drive",
+          "ADDRESS_FR": "190 Glen Park Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.562796920677627, 45.429643413219814]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 989,
+          "FACILITYID": 28017,
+          "NAME": "Goulbourn Skateboard Park",
+          "NAME_FR": "Planchodrome Goulbourn",
+          "ADDRESS": "1500 Shea Road",
+          "ADDRESS_FR": "1500, chemin Shea",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 6 components",
+          "DESCRIPT_1": "Flat asphalt surface, 6 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.907108695123526, 45.26222860981953]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1334,
+          "FACILITYID": 28011,
+          "NAME": "Constance Bay Skateboard Park",
+          "NAME_FR": "Constance Bay skate park",
+          "ADDRESS": "262 Len Purcell Drive",
+          "ADDRESS_FR": "262, Len-Purcell promenade",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-76.09244957349965, 45.499050061534312]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 923,
+          "FACILITYID": 28013,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "334 River Road",
+          "ADDRESS_FR": "334, chemin River",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Eccolands Park - Roving Skateboard Park Location",
+          "FACILITY_F": "Parc Eccolands - Location of an itinerant skate park",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.695392300925718, 45.315355581248873]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 762,
+          "FACILITYID": 28004,
+          "NAME": "Trillium Park Skateboard Park",
+          "NAME_FR": "Park Trillium skate park",
+          "ADDRESS": "2030 Ogilvie Road",
+          "ADDRESS_FR": "2030, chemin Ogilvie",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.601158413850058, 45.436441777242031]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 52,
+          "FACILITYID": 35120,
+          "NAME": "Lansdowne Skateboard Park",
+          "NAME_FR": "Lansdowne Skate Park",
+          "ADDRESS": "450 Queen Elizabeth Driveway",
+          "ADDRESS_FR": "450 Queen Elizabeth Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2017/07/11",
+          "CREATED_DA": "2015/09/23",
+          "FACILITY": "A series of skateboard ramps ideally suited to beginners.",
+          "FACILITY_F": "A series of ramps suitable for beginners.",
+          "DESCRIPTIO": "Flat asphalt surface",
+          "DESCRIPT_1": "Flat asphalt surface",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.681193500335723, 45.400372622455215]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2488,
+          "FACILITYID": 35815,
+          "NAME": "Greely Village Skateboard Park",
+          "NAME_FR": "Planchodrome Greely Village",
+          "ADDRESS": "7292 Parkway Road",
+          "ADDRESS_FR": "7292, chemin Parkway",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/04",
+          "CREATED_DA": "2017/04/28",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat concrete surface, 5 components",
+          "DESCRIPT_1": "Flat concrete surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.553065849890629, 45.265433081236672]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 330,
+          "FACILITYID": 28003,
+          "NAME": "Manotick Skateboard Park",
+          "NAME_FR": "Planchodrome Manotick",
+          "ADDRESS": "5572 Doctor Leach Drive",
+          "ADDRESS_FR": "5572, Doctor-Leach promenade",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "yes / oui",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Joined with basketball",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Flat asphalt surface, 8 components",
+          "DESCRIPT_1": "Flat asphalt surface, 8 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.686746214582783, 45.22266136322127]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 693,
+          "FACILITYID": 28010,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "1448 Meadow Drive",
+          "ADDRESS_FR": "1448 Meadow Drive",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Mobile",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Andy Shields Park - Roving Skateboard Park Location",
+          "FACILITY_F": "Andy-Shields Park - Location of an itinerant skate park",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.556978502821494, 45.261353985880973]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2544,
+          "FACILITYID": 35667,
+          "NAME": "Berrigan Skateboard Park",
+          "NAME_FR": "Planchodrome Berrigan",
+          "ADDRESS": "51 Berrigan Drive",
+          "ADDRESS_FR": "51, promenade Berrigan",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/02/27",
+          "CREATED_DA": "2016/06/27",
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Flat concrete surface, 10 plus components",
+          "DESCRIPT_1": "Flat concrete surface, 10 or more modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.747348794023239, 45.275696004260205]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2599,
+          "FACILITYID": 49251,
+          "NAME": "Eugène Martineau Skateboard Park",
+          "NAME_FR": "Planchodrome Eugène-Martineau",
+          "ADDRESS": "710 Mikinak Road",
+          "ADDRESS_FR": "710, chemin Mikinak",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/11/29",
+          "CREATED_DA": "2018/11/29",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.632030968141081, 45.450696284941976]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2278,
+          "FACILITYID": 49211,
+          "NAME": "Vista Skateboard Park",
+          "NAME_FR": "Planchodrome Vista",
+          "ADDRESS": "720 Vistapark Drive",
+          "ADDRESS_FR": "720, Vistapark promenade",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/11/29",
+          "CREATED_DA": "2018/06/22",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.471003922143311, 45.450391044010431]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2113,
+          "FACILITYID": 35299,
+          "NAME": "Innovation Skateboard Park",
+          "NAME_FR": "Planchomdrome Innovation",
+          "ADDRESS": "4101 Innovation Drive",
+          "ADDRESS_FR": "4101, promenade Innovation",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2017/07/11",
+          "CREATED_DA": "2016/02/08",
+          "FACILITY": "District: larger facility to service population of 100,000 plus",
+          "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
+          "DESCRIPTIO": "Large concrete bowl, 10 plus components, many street and vertical components",
+          "DESCRIPT_1": "Large concrete bowl, 10 or more modules, street modules and vertical modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.931122879767898, 45.34125624499935]
+        }
+      }
+    ]
+  }
\ No newline at end of file
diff --git a/src/listings-page/data/property-data.json b/src/listings-page/data/property-data.json
new file mode 100644
index 0000000..d6451e9
--- /dev/null
+++ b/src/listings-page/data/property-data.json
@@ -0,0 +1,83 @@
+{
+    "Properties": [
+
+
+        {
+            "LISTING_ID": 1,
+            "ADDRESS": "8720 Russell Road",
+            "PRICE": "$500000",
+            "IMAGES":[
+
+            ],
+            "AVAILABLE_AGENTS":[
+
+            ],
+            "DESC":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.",
+
+            "FOR_SALE": true,
+            "coordinates": [-75.3372987731628, 45.383321536272049]
+
+        },
+
+
+        {
+
+            "LISTING_ID": 2,
+            "ADDRESS": "1490 Youville Drive",
+            "PRICE": "$500000",
+            "IMAGES":[
+
+            ],
+            "AVAILABLE_AGENTS":[
+
+            ],
+            "DESC":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.",
+            "FOR_SALE": true,
+            "coordinates": [-75.546518086577947, 45.467134581917357]
+            
+
+
+
+        },
+
+        {
+
+            "LISTING_ID": 3,
+            "ADDRESS": "100 Charlie Rogers Place",
+            "PRICE": "$500000",
+            "IMAGES":[
+
+            ],
+            "AVAILABLE_AGENTS":[
+
+            ],
+            "DESC":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.",
+
+            "FOR_SALE": true,
+            "coordinates": [-75.898610599532319, 45.295014379864874]
+
+
+
+
+        },
+
+        {
+
+            "LISTING_ID": 4,
+            "ADDRESS": "2785 8th Line Road",
+            "PRICE": "$500000",
+            "IMAGES":[
+
+            ],
+            "AVAILABLE_AGENTS":[
+
+            ],
+            "DESC":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.",
+
+            "FOR_SALE": true,
+            "coordinates": [-75.468561642270757, 45.23032561834377]
+
+        }
+    ]
+
+}
diff --git a/src/listings-page/data/testing_stuff.json b/src/listings-page/data/testing_stuff.json
new file mode 100644
index 0000000..c38853d
--- /dev/null
+++ b/src/listings-page/data/testing_stuff.json
@@ -0,0 +1,789 @@
+{
+    "type": "FeatureCollection",
+    "crs": {
+      "type": "name",
+      "properties": {"name": "urn: ogc: def: crs: OGC: 1.3: CRS84"}
+    },
+    "features": [
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 960,
+          "FACILITYID": 28014,
+          "NAME": "Bearbrook Skateboard Park",
+          "NAME_FR": "Bearbrook skate park",
+          "ADDRESS": "8720 Russell Road",
+          "ADDRESS_FR": "8720, chemin Russell",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.3372987731628, 45.383321536272049]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1219,
+          "FACILITYID": 28001,
+          "NAME": "Bob MacQuarrie Skateboard Park (SK8 Extreme Park)",
+          "NAME_FR": "Bob-MacQuarrie Skate Park (SK8 Extreme Park)",
+          "ADDRESS": "1490 Youville Drive",
+          "ADDRESS_FR": "1490, promenade Youville",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Flat asphalt surface, 10 components, City run learn to skateboard programs, City run skateboard camps in summer",
+          "DESCRIPT_1": "Flat asphalt surface, 10 modules, programs and summer skateboard camps managed by the City",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.546518086577947, 45.467134581917357]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1157,
+          "FACILITYID": 28002,
+          "NAME": "Walter Baker Skateboard Park",
+          "NAME_FR": "Walter-Baker skate park",
+          "ADDRESS": "100 Charlie Rogers Place",
+          "ADDRESS_FR": "100, place Charlie Rogers",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Concrete bowl, 7,000 sq ft",
+          "DESCRIPT_1": "Concrete bowl, 7,000 sq. Ft.",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.898610599532319, 45.295014379864874]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 9,
+          "FACILITYID": 28006,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "2785 8th Line Road",
+          "ADDRESS_FR": "2785, chemin 8th Line",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Mobile",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Metcalfe Community Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Metcalfe Community Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.468561642270757, 45.23032561834377]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1160,
+          "FACILITYID": 28007,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "10 Warner Colpitts Lane",
+          "ADDRESS_FR": "10, ruelle Warner Colpitts",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "yes / oui",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Indoor - Summer",
+          "MODIFIED_D": "2018/03/07",
+          "CREATED_DA": null,
+          "FACILITY": "Johnny Leroux Stittsville Community Arena - Roving Skateboard Park Location",
+          "FACILITY_F": "Stittsville Johnny-Leroux community arena - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.926651366520872, 45.260659774950561]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1693,
+          "FACILITYID": 28016,
+          "NAME": "Legacy Skateboard Park",
+          "NAME_FR": "Skatepark Legacy",
+          "ADDRESS": "101 Centrepointe Drive",
+          "ADDRESS_FR": "101, promenade Centrepointe",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "District: larger facility to service population of 100,000 plus",
+          "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
+          "DESCRIPTIO": "Large concrete bowl, many street and vertical components, 17,000 sq ft",
+          "DESCRIPT_1": "Large concrete bowl, street modules and vertical modules, 17,000 ft2",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.760933332842754, 45.345566668964558]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1717,
+          "FACILITYID": 28018,
+          "NAME": "Greenboro Skateboard Park",
+          "NAME_FR": "Greenboro skate park",
+          "ADDRESS": "3142 Conroy Road",
+          "ADDRESS_FR": "3142, chemin Conroy",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.625996131485707, 45.375401587496128]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 137,
+          "FACILITYID": 28019,
+          "NAME": "Bridlewood Skateboard Park",
+          "NAME_FR": "Bridlewood skate park",
+          "ADDRESS": "65 Stonehaven Drive",
+          "ADDRESS_FR": "65 Stonehaven Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.857009812435976, 45.290758029776626]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1133,
+          "FACILITYID": 28020,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "100 Clifford Campbell Street",
+          "ADDRESS_FR": "100, rue Clifford-Campbell",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Fitzroy Harbor Community Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Fitzroy Harbor Community Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-76.206087708136721, 45.470459866077654]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 657,
+          "FACILITYID": 28000,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "110 Malvern Drive",
+          "ADDRESS_FR": "110, promenade Malvern",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Walter Baker Sports Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Walter-Baker Sports Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.760235255689508, 45.280622216516925]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 653,
+          "FACILITYID": 28008,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "5660 Osgoode Main Street",
+          "ADDRESS_FR": "5660, rue Osgoode Main",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Mobile",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Osgoode Community Center - Roving Skateboard Park Location",
+          "FACILITY_F": "Osgoode Community Center - Itinerant skate park site",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.60118478829267, 45.147641950106689]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 812,
+          "FACILITYID": 35050,
+          "NAME": "Charlie Bowins Skateboard Park",
+          "NAME_FR": "Charlie-Bowins skate park",
+          "ADDRESS": "435 Bronson Avenue",
+          "ADDRESS_FR": "435, avenue Bronson",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor (Commemoratively named Charlie Bowins Skateboard Park on June 10, 2015)",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": "2015/05/20",
+          "FACILITY": "District: larger facility to service population of 100,000 plus",
+          "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
+          "DESCRIPTIO": "Flat concrete surface, 10 plus components (large half pipe), City run learn to skateboard programs, City run skateboard camps in summer",
+          "DESCRIPT_1": "Flat concrete surface, 10 or more modules (large halfpipe), summer skateboard programs and camps managed by the City",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.703622500360268, 45.408488357092367]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2457,
+          "FACILITYID": 35637,
+          "NAME": "Diamond Jubilee Skateboard Park",
+          "NAME_FR": "Diamond Jubilee Skate Park",
+          "ADDRESS": "2810 Findlay Creek Drive",
+          "ADDRESS_FR": "2810 Findlay Creek Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2017/07/11",
+          "CREATED_DA": "2016/06/22",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.609516309730921, 45.314086718258636]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 430,
+          "FACILITYID": 28005,
+          "NAME": "Blackburn Skateboard Park",
+          "NAME_FR": "Blackburn skate park",
+          "ADDRESS": "190 Glen Park Drive",
+          "ADDRESS_FR": "190 Glen Park Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.562796920677627, 45.429643413219814]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 989,
+          "FACILITYID": 28017,
+          "NAME": "Goulbourn Skateboard Park",
+          "NAME_FR": "Planchodrome Goulbourn",
+          "ADDRESS": "1500 Shea Road",
+          "ADDRESS_FR": "1500, chemin Shea",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 6 components",
+          "DESCRIPT_1": "Flat asphalt surface, 6 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.907108695123526, 45.26222860981953]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 1334,
+          "FACILITYID": 28011,
+          "NAME": "Constance Bay Skateboard Park",
+          "NAME_FR": "Constance Bay skate park",
+          "ADDRESS": "262 Len Purcell Drive",
+          "ADDRESS_FR": "262, Len-Purcell promenade",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-76.09244957349965, 45.499050061534312]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 923,
+          "FACILITYID": 28013,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "334 River Road",
+          "ADDRESS_FR": "334, chemin River",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Eccolands Park - Roving Skateboard Park Location",
+          "FACILITY_F": "Parc Eccolands - Location of an itinerant skate park",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.695392300925718, 45.315355581248873]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 762,
+          "FACILITYID": 28004,
+          "NAME": "Trillium Park Skateboard Park",
+          "NAME_FR": "Park Trillium skate park",
+          "ADDRESS": "2030 Ogilvie Road",
+          "ADDRESS_FR": "2030, chemin Ogilvie",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat asphalt surface, 5 components",
+          "DESCRIPT_1": "Flat asphalt surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.601158413850058, 45.436441777242031]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 52,
+          "FACILITYID": 35120,
+          "NAME": "Lansdowne Skateboard Park",
+          "NAME_FR": "Lansdowne Skate Park",
+          "ADDRESS": "450 Queen Elizabeth Driveway",
+          "ADDRESS_FR": "450 Queen Elizabeth Drive",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2017/07/11",
+          "CREATED_DA": "2015/09/23",
+          "FACILITY": "A series of skateboard ramps ideally suited to beginners.",
+          "FACILITY_F": "A series of ramps suitable for beginners.",
+          "DESCRIPTIO": "Flat asphalt surface",
+          "DESCRIPT_1": "Flat asphalt surface",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.681193500335723, 45.400372622455215]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2488,
+          "FACILITYID": 35815,
+          "NAME": "Greely Village Skateboard Park",
+          "NAME_FR": "Planchodrome Greely Village",
+          "ADDRESS": "7292 Parkway Road",
+          "ADDRESS_FR": "7292, chemin Parkway",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/01/04",
+          "CREATED_DA": "2017/04/28",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat concrete surface, 5 components",
+          "DESCRIPT_1": "Flat concrete surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.553065849890629, 45.265433081236672]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 330,
+          "FACILITYID": 28003,
+          "NAME": "Manotick Skateboard Park",
+          "NAME_FR": "Planchodrome Manotick",
+          "ADDRESS": "5572 Doctor Leach Drive",
+          "ADDRESS_FR": "5572, Doctor-Leach promenade",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "yes / oui",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Joined with basketball",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Flat asphalt surface, 8 components",
+          "DESCRIPT_1": "Flat asphalt surface, 8 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.686746214582783, 45.22266136322127]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 693,
+          "FACILITYID": 28010,
+          "NAME": "Roving Skateboard Park Location",
+          "NAME_FR": "Location of an itinerant skate park",
+          "ADDRESS": "1448 Meadow Drive",
+          "ADDRESS_FR": "1448 Meadow Drive",
+          "FACILITY_T": "other",
+          "FACILITY_1": "other",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor - Mobile",
+          "MODIFIED_D": "2018/01/18",
+          "CREATED_DA": null,
+          "FACILITY": "Andy Shields Park - Roving Skateboard Park Location",
+          "FACILITY_F": "Andy-Shields Park - Location of an itinerant skate park",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.556978502821494, 45.261353985880973]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2544,
+          "FACILITYID": 35667,
+          "NAME": "Berrigan Skateboard Park",
+          "NAME_FR": "Planchodrome Berrigan",
+          "ADDRESS": "51 Berrigan Drive",
+          "ADDRESS_FR": "51, promenade Berrigan",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "no / non",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/02/27",
+          "CREATED_DA": "2016/06/27",
+          "FACILITY": "Community: mid size facility to service population of 40,000 plus",
+          "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
+          "DESCRIPTIO": "Flat concrete surface, 10 plus components",
+          "DESCRIPT_1": "Flat concrete surface, 10 or more modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.747348794023239, 45.275696004260205]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2599,
+          "FACILITYID": 49251,
+          "NAME": "Eugène Martineau Skateboard Park",
+          "NAME_FR": "Planchodrome Eugène-Martineau",
+          "ADDRESS": "710 Mikinak Road",
+          "ADDRESS_FR": "710, chemin Mikinak",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/11/29",
+          "CREATED_DA": "2018/11/29",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.632030968141081, 45.450696284941976]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2278,
+          "FACILITYID": 49211,
+          "NAME": "Vista Skateboard Park",
+          "NAME_FR": "Planchodrome Vista",
+          "ADDRESS": "720 Vistapark Drive",
+          "ADDRESS_FR": "720, Vistapark promenade",
+          "FACILITY_T": "flat",
+          "FACILITY_1": "flat",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2018/11/29",
+          "CREATED_DA": "2018/06/22",
+          "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
+          "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
+          "DESCRIPTIO": "Flat surface, 5 components",
+          "DESCRIPT_1": "Flat surface, 5 modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.471003922143311, 45.450391044010431]
+        }
+      },
+      {
+        "type": "Feature",
+        "properties": {
+          "PARK_ID": 2113,
+          "FACILITYID": 35299,
+          "NAME": "Innovation Skateboard Park",
+          "NAME_FR": "Planchomdrome Innovation",
+          "ADDRESS": "4101 Innovation Drive",
+          "ADDRESS_FR": "4101, promenade Innovation",
+          "FACILITY_T": "bowl",
+          "FACILITY_1": "bowl",
+          "ACCESSCTRL": "no / non",
+          "ACCESSIBLE": "yes / oui",
+          "OPEN": null,
+          "NOTES": "Outdoor",
+          "MODIFIED_D": "2017/07/11",
+          "CREATED_DA": "2016/02/08",
+          "FACILITY": "District: larger facility to service population of 100,000 plus",
+          "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
+          "DESCRIPTIO": "Large concrete bowl, 10 plus components, many street and vertical components",
+          "DESCRIPT_1": "Large concrete bowl, 10 or more modules, street modules and vertical modules",
+          "PICTURE_LI": null,
+          "PICTURE_DE": null,
+          "PICTURE__1": null
+        },
+        "geometry": {
+          "type": "Point",
+          "coordinates": [-75.931122879767898, 45.34125624499935]
+        }
+      }
+    ]
+  }
\ No newline at end of file
diff --git a/src/listings-page/listings-page.css b/src/listings-page/listings-page.css
deleted file mode 100644
index e69de29..0000000
diff --git a/src/listings-page/listings-page.js b/src/listings-page/listings-page.js
deleted file mode 100644
index 0290527..0000000
--- a/src/listings-page/listings-page.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React, { Component } from "react";
-
-class ListingsPage extends Component {
-  render() {
-    return <div>ListingsPage</div>;
-  }
-}
-
-export default ListingsPage;
diff --git a/src/listings-page/mapStyles.js b/src/listings-page/mapStyles.js
new file mode 100644
index 0000000..84d724c
--- /dev/null
+++ b/src/listings-page/mapStyles.js
@@ -0,0 +1,267 @@
+export default [
+    {
+        "featureType": "all",
+        "elementType": "labels",
+        "stylers": [
+            {
+                "visibility": "off"
+            }
+        ]
+    },
+    {
+        "featureType": "administrative",
+        "elementType": "all",
+        "stylers": [
+            {
+                "visibility": "off"
+            },
+            {
+                "color": "#efebe2"
+            }
+        ]
+    },
+    {
+        "featureType": "administrative",
+        "elementType": "labels.text",
+        "stylers": [
+            {
+                "visibility": "on"
+            },
+            {
+                "color": "#333333"
+            }
+        ]
+    },
+    {
+        "featureType": "administrative",
+        "elementType": "labels.text.stroke",
+        "stylers": [
+            {
+                "visibility": "off"
+            },
+            {
+                "color": "#f2f1f1"
+            }
+        ]
+    },
+    {
+        "featureType": "administrative.province",
+        "elementType": "labels.text.fill",
+        "stylers": [
+            {
+                "color": "#ba7828"
+            }
+        ]
+    },
+    {
+        "featureType": "landscape",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#efebe2"
+            }
+        ]
+    },
+    {
+        "featureType": "landscape",
+        "elementType": "geometry",
+        "stylers": [
+            {
+                "visibility": "simplified"
+            },
+            {
+                "color": "#fbf7eb"
+            }
+        ]
+    },
+    {
+        "featureType": "landscape",
+        "elementType": "geometry.stroke",
+        "stylers": [
+            {
+                "color": "#bec1c1"
+            }
+        ]
+    },
+    {
+        "featureType": "landscape",
+        "elementType": "labels.text.stroke",
+        "stylers": [
+            {
+                "color": "#c3c3c3"
+            }
+        ]
+    },
+    {
+        "featureType": "poi",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#e2e1df"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.attraction",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#efebe2"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.business",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#efebe2"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.government",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#dfdcd5"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.medical",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#dfdcd5"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.park",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#aceac5"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.place_of_worship",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#efebe2"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.school",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#efebe2"
+            }
+        ]
+    },
+    {
+        "featureType": "poi.sports_complex",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#efebe2"
+            }
+        ]
+    },
+    {
+        "featureType": "road.highway",
+        "elementType": "geometry.fill",
+        "stylers": [
+            {
+                "color": "#dad5c4"
+            }
+        ]
+    },
+    {
+        "featureType": "road.highway",
+        "elementType": "geometry.stroke",
+        "stylers": [
+            {
+                "visibility": "off"
+            }
+        ]
+    },
+    {
+        "featureType": "road.arterial",
+        "elementType": "geometry.fill",
+        "stylers": [
+            {
+                "color": "#ffffff"
+            }
+        ]
+    },
+    {
+        "featureType": "road.arterial",
+        "elementType": "geometry.stroke",
+        "stylers": [
+            {
+                "visibility": "off"
+            }
+        ]
+    },
+    {
+        "featureType": "road.local",
+        "elementType": "geometry.fill",
+        "stylers": [
+            {
+                "color": "#fbfbfb"
+            }
+        ]
+    },
+    {
+        "featureType": "road.local",
+        "elementType": "geometry.stroke",
+        "stylers": [
+            {
+                "visibility": "off"
+            }
+        ]
+    },
+    {
+        "featureType": "transit",
+        "elementType": "all",
+        "stylers": [
+            {
+                "visibility": "on"
+            },
+            {
+                "saturation": "21"
+            },
+            {
+                "gamma": "1.34"
+            },
+            {
+                "hue": "#ffcc00"
+            }
+        ]
+    },
+    {
+        "featureType": "water",
+        "elementType": "all",
+        "stylers": [
+            {
+                "color": "#aad0fc"
+            }
+        ]
+    },
+    {
+        "featureType": "water",
+        "elementType": "geometry",
+        "stylers": [
+            {
+                "color": "#aad0fc"
+            }
+        ]
+    }
+]
+
diff --git a/src/listings-page/listing-page/listing-page.css b/src/listings-page/single-listing/listing-page.css
similarity index 100%
rename from src/listings-page/listing-page/listing-page.css
rename to src/listings-page/single-listing/listing-page.css
diff --git a/src/listings-page/listing-page/listing-page.js b/src/listings-page/single-listing/listing-page.js
similarity index 100%
rename from src/listings-page/listing-page/listing-page.js
rename to src/listings-page/single-listing/listing-page.js
diff --git a/src/listings-page/listing-page/listing-page.test.js b/src/listings-page/single-listing/listing-page.test.js
similarity index 100%
rename from src/listings-page/listing-page/listing-page.test.js
rename to src/listings-page/single-listing/listing-page.test.js