diff --git a/.gitignore b/.gitignore
index 1f1b0e9..f0bf563 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,8 +5,8 @@
 *.shp*
 *.log
 *.zip
+*.pdf
 vendor/
-docs/
 progetto_QGIS/
 conf.json
 shapefile
diff --git a/webgis/docs/.keep b/webgis/docs/.keep
new file mode 100644
index 0000000..e69de29
diff --git a/webgis/img/icons/rinvenimenti.png b/webgis/img/icons/rinvenimenti.png
new file mode 100644
index 0000000..d968d86
Binary files /dev/null and b/webgis/img/icons/rinvenimenti.png differ
diff --git a/webgis/index.html b/webgis/index.html
index c1eec4b..4cc5477 100644
--- a/webgis/index.html
+++ b/webgis/index.html
@@ -21,7 +21,7 @@
     <title>WebGIS Isola di Capri</title>
 </head>
 <body>
-    <nav class="navbar mb-2" role="navigation">
+    <nav class="navbar mb-0" role="navigation">
         <div class="navbar-brand">
             <a href="/" class="navbar-item is-size-5 has-text-dark ml-4" title="Torna alla home page">
                 <span class="icon">
@@ -39,7 +39,7 @@
             </a>
         </div>
         <hr class="navbar-divider">
-        <div class="navbar-end" id="nav-menu">
+        <div class="navbar-end pb-1 pt-1" id="nav-menu">
             <button class="navbar-item button is-size-5 is-white" role="button" id="siti">
                 Beni archeologici
             </button>
@@ -56,7 +56,6 @@
             </button>
         </div>
     </nav>
-    <!-- TODO Loader -->
     <div class="wait-lg text-center is-hidden" style="clear: both;">
         <p>Loading...</p>
         <div class="loading loading-lg"></div>
@@ -109,8 +108,8 @@
                 <ul class="menu-list" id="not-conserved"></ul>
             </aside>
         </div>
-        <div class="column is-full is-relative">
-            <div id="map" aria-describedby="map-progress" aria-busy="true" style="position: relative;">
+        <div class="column mb-0 pb-0 is-full is-relative">
+            <div class="pb-0" id="map" aria-describedby="map-progress" aria-busy="true" style="position: relative;">
                 <progress id="map-progress" class="p-2 progress is-medium is-link" aria-label="Map loading..." />
             </div>
         </div>
@@ -170,6 +169,14 @@
         </div>
         <button class="modal-close is-large" aria-label="close"></button>
     </div>
+    <!-- Not conserved modal -->
+    <div class="modal" id="finding-data">
+        <div class="modal-background"></div>
+        <div class="modal-content has-background-white" style="min-height: 95vh;">
+            <div id="finding-sheet"></div>
+        </div>
+        <button class="modal-close is-large" aria-label="close"></button>
+    </div>
     <!-- Spherical photo modal -->
     <div class="modal" id="spherical-modal">
         <div class="modal-background"></div>
diff --git a/webgis/js/components/Finding.js b/webgis/js/components/Finding.js
new file mode 100644
index 0000000..d713ac2
--- /dev/null
+++ b/webgis/js/components/Finding.js
@@ -0,0 +1,48 @@
+/**
+ * @class Finding
+ */
+export class Finding {
+    set data(data) {
+        this._data = data;
+    }
+
+    render() {
+        return `
+        <div class="container px-4 pt-4">
+            <p class="p-2">
+                <strong>Oggetto:</strong> ${this._data.object}
+            </p>
+            <p class="p-2">
+                <strong>Materia:</strong> ${this._data.material}
+            </p>
+            <p class="p-2">
+                <strong>Misure</strong> ${this._data.measurements}
+            </p>
+            <p class="p-2">
+                <strong>Inventario</strong> ${this._data.inventory}
+            </p>
+            <p class="p-2">
+                <strong>Luogo rinvenimento</strong> ${this._data.place}
+            </p>
+            <p class="p-2">
+                <strong>Anno rinvenimento</strong> ${this._data.year}
+            </p>
+            <p class="p-2">
+                <strong>Datazione</strong> ${this._data.dating}
+            </p>
+            <p class="p-2">
+                <strong>Stato di conservazione</strong> ${this._data.conservationState}
+            </p>
+            <p class="p-2">
+                <strong>Luogo di conservazione</strong> ${this._data.conservationPlace}
+            </p>
+            <p class="mt-4 pl-2 pr-5">
+                <strong class="pb-3">Descrizione</strong></br>
+                ${this._data.description}
+            </p>
+            <p class="p-2 mb-4">
+                <strong>Autore scheda:</strong> ${this._data.author}
+            </p>
+        </div>`;
+    }
+}
diff --git a/webgis/js/gis.js b/webgis/js/gis.js
index 3a67453..c1e14aa 100644
--- a/webgis/js/gis.js
+++ b/webgis/js/gis.js
@@ -129,11 +129,13 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
 
     let markersGroup = await this.sitesMarkers(sitesGroup);
     let notConservedGroup = await this.notConserved();
+    let findingsGroup = await this.findings();
 
     const archeo = {
         'Beni archeologici (punti)' : markersGroup,
         'Beni archeologici (strutture)' : sitesGroup,
         'Beni non conservati' : notConservedGroup,
+        'Rinvenimenti' : findingsGroup,
         'Vincoli archeologici' : layerVincoli,
         'Vincoli paesistici' : layerPaesistici,
     };
@@ -141,6 +143,7 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
     markersGroup.addTo(map);
     sitesGroup.addTo(map);
     notConservedGroup.addTo(map);
+    findingsGroup.addTo(map);
 
     L.control.layers(
         baseMap,
@@ -178,8 +181,9 @@ GIS.sitesMarkers = async function (sitesGroup) {
         }
 
         const marker = L.marker(coords, { icon: Icons.site })
-            .bindTooltip(MARKER_NAMES.sites[id])
-            .openTooltip();
+            .bindTooltip(MARKER_NAMES.sites[id] + '<br>(Clicca per aprire scheda)');
+
+        marker.id = id;
         
         marker.on('click', () => UI.openSiteModal(data, '#site-data'));
 
@@ -212,6 +216,30 @@ GIS.notConserved = async function () {
 
     return L.layerGroup(notConserved);
 }
+/**
+ * Create findings group
+ * @returns {L.LayerGroup}
+ */
+GIS.findings = async function () {
+    let findingsData = await fetch(`${API_URL}/finding`)
+        .then(data => data.json());
+
+    let findings = [];
+
+    for (let record of findingsData) {
+        findings.push(L.marker(
+                record.coordinates,
+                {icon: Icons.finding}
+            ).bindTooltip(record.object)
+            .on(
+                'click',
+                () => UI.openFindingModal(record, '#finding-data')
+            )
+        );
+    }
+
+    return L.layerGroup(findings);
+}
 /*
 GIS._prepareLayers = async function(layer) {
     const fromStorage = localStorage.getItem(layer.id);
@@ -254,6 +282,7 @@ GIS._prepareLayers = async function(layer) {
  * @returns {{baseMap: {"OpenStreetMap": L.TileLayer}, archeo: object, sitesGroup: L.LayerGroup}}
  */
 GIS.initLayers = async function(map) {
+    // TODO Move all this to separate array / object!
     let layerMater = await this.loadLayer('matermania.geojson', optionsSiti, false);
     let layerMaterArea = await this.loadLayer('matermania_area.geojson', optionsSiti, false);
     let layerArsenale = await this.loadLayer('arsenale.geojson', optionsSiti, false);
diff --git a/webgis/js/icons.js b/webgis/js/icons.js
index 67e04fe..c8ecfc0 100644
--- a/webgis/js/icons.js
+++ b/webgis/js/icons.js
@@ -21,6 +21,15 @@ Icons.notConserved = L.icon(
     }
 );
 
+Icons.finding = L.icon(
+    {
+        iconUrl: 'img/icons/rinvenimenti.png',
+        iconSize: [24, 36],
+        iconAnchor: [12, 32],
+        tooltipAnchor: [0, -26],
+    }
+);
+
 Icons.camera = L.divIcon({className: 'fa fa-2x fa-camera'});
 
 export default Icons;
\ No newline at end of file
diff --git a/webgis/js/ui.js b/webgis/js/ui.js
index 7e01eea..462ff69 100644
--- a/webgis/js/ui.js
+++ b/webgis/js/ui.js
@@ -7,6 +7,7 @@ import { SiteSurveys } from './components/SiteSurveys.js';
 import { SitePhotos } from './components/SitePhotos.js';
 import { NotConservedSheet } from './components/NotConservedSheet.js';
 import GIS from './gis.js';
+import { Finding } from './components/Finding.js';
 
 /**
  * @namespace UI
@@ -194,6 +195,24 @@ UI.openNotConserModal = async function (data, selector) {
 	modalBg.addEventListener('click', () => closeModal());
 
 }
+/**
+ * @param {object} data The data retrieved from the DB to display as modal content
+ * @param {string} selector The modal selector
+ */
+UI.openFindingModal = async function (data, selector) {
+	const modal = document.querySelector(selector);
+
+	let sheet = new Finding();
+	sheet.data = data;
+	modal.querySelector('#finding-sheet').innerHTML = await sheet.render();
+	modal.classList.add('is-active');
+	const closeBtn = modal.querySelector('.modal-close');
+	const modalBg = modal.querySelector('.modal-background');
+	const closeModal = () => modal.classList.remove('is-active');
+	// CLose modal when clicking either on the X button or on the background
+	closeBtn.addEventListener('click', () => closeModal());
+	modalBg.addEventListener('click', () => closeModal());
+}
 /**
  * @param {string} menuListSel Menu list selector
  * @param {L.Map} map
@@ -202,23 +221,29 @@ UI.openNotConserModal = async function (data, selector) {
 UI.sitesMenu = function (menuListSel, map, sites) {
 	// Close menu if arrow button is clicked...
 	this.toggleMenu('close-menu');
+	let markers = [];
+
+	map.eachLayer(layer => {
+		if (layer instanceof L.Marker) {
+			markers.push(layer);
+		}
+	})
 
 	const menu = document.querySelector(menuListSel);
 	menu.addEventListener('click', async event => {
 		if (event.target.nodeName === 'A') {
 			const layerId = event.target.id;
+			const marker = markers.filter(m => m.id === layerId)[0];
+
 			// zoom to layer...
 			const layer = sites.customGetLayer(layerId);
-			const data = await GIS.layerData(layerId);
 			map.setView(
 				layer.getBounds().getCenter(),
 				19,
 				{animate: true, duration: 1, easeLinearity: 0.25}
 			);
-			setTimeout(
-				() => this.openSiteModal(data, '#site-data'),
-				1200
-			);
+
+			marker.openTooltip();
 		}
 	});
 }
