Clone UGL website

5f591661 · Myriam Guedey · 24612f40 · 5f591661 · 5f591661 · 5f591661
Commit 5f591661 authored Oct 17, 2023 by Myriam Guedey
--- a/public/content/justin/cover.jpg
+++ b/public/content/justin/cover.jpg
--- a/public/content/justin/ezgif.com-gif-maker.gif
+++ b/public/content/justin/ezgif.com-gif-maker.gif
--- a/public/content/justin/index.html
+++ b/public/content/justin/index.html
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="generator" content="GitLab Pages">
+  <title></title>
+  <link rel="stylesheet" href="assets/css/style.css">
+  <link rel="stylesheet" href="assets/css/mobile.css">
+
+  <style>
+    .cover{margin-top:48px;display:flex}.cover img{width:250px;object-fit:contain;margin-bottom:auto;box-shadow:0 1px 4px -1px #00000069}.metadata{display:flex;flex-direction:column;margin-left:1em}.title{flex-grow:1;font-size:2em;font-weight:700}.metadata-item{display:flex;flex-direction:column;margin-top:24px}.download-item{display:flex;margin-top:24px}.metadata-name{border-bottom:1px solid #cacaca;border-image:linear-gradient(to right,#cacaca,#ffffff00) 1;margin-bottom:5px}.supervisors{display:flex;flex-direction:column}.button{background-color:#4caf50;border:none;color:#fff;padding:15px 32px;text-align:center;text-decoration:none;display:inline-block;font-size:16px}@media only screen and (max-width :450px){.cover{flex-wrap:wrap}.cover img{width:100%}}
+  </style>
+
+</head>
+
+<body>
+  <header id="header">
+    <div class="row">
+      <div class="logo" id="logo"></div>
+      <div class="hamburger">
+        <div class="line"></div>
+        <div class="line"></div>
+        <div class="line"></div>
+      </div>
+      <nav></nav>
+    </div>
+    <div id='projectname'></div>
+  </header>
+  <div class="content">
+
+    <div class="cover">
+      <img src="cover.jpg">
+      <ul class="metadata">
+        <li class="metadata-item title">
+          Outdoor Mobile Augmented Reality in Urban Planning; Concepts of Visualizing Focus and Context Using Grayscale Filter in Video-based AR.
+        </li>
+        <li class="metadata-item">
+          <div class="metadata-name">Author</div>
+          <div>Justin Jing Hui</div>
+        </li>
+        <li class="metadata-item">
+          <div class="metadata-name">Supervisors</div>
+          <div class="supervisors">
+            <div>Prof. Dr.-Ing. Volker Coors</div>
+            <div>Prof. Dr.-Ing. Eberhard Gülch</div>
+          </div>
+        </li>
+        <li class="metadata-item">
+          <div class="metadata-name">Year</div>
+          <div>2021</div>
+        </li>
+        <li class="download-item"><a href="thesis.pdf" class="button" download>download</a></li>
+      </ul>
+    </div>
+
+    <h1>Abstract</h1>
+
+    <p>
+      Urban planners and designers often use grayscale masking filters to highlight a selected urban feature and its context without the overwhelming   information. With the rising interest in applying augmented reality (AR) technology into the field of urban planning for increasing social engagement, this thesis aims to develop an outdoor mobile AR application that visualizes the urban environment using the mentioned grayscale masking filters. The application is able to apply the grayscale masking filter to the designated buildings in Nordbahnhof, Stuttgart when the device’s camera is pointing to them. State of the art of  outdoor mobile AR technologies are studied and reviewed. This thesis proposes the concepts and methodology of the video-based AR visualization and the development of the app. The implementation of the concepts and methodology is documented and the implementation process and result are evaluated.
+    </p>
+
+    <h1>The AR Application</h1>
+
+    <p>
+      The application developed for the thesis is able to visualize a series of desingated buildings in Nordbahnhof, Stuttgart with the grayscale masking filter. With the app on, once the user points the camera to the designated building, the system will in-real-time detects the building and render the surrounding in monochrome and leaving the building in color. The moving image below demonstrates the visualization from a screen recording when using the app.
+      <br></br> 
+      <img src="ezgif.com-gif-maker.gif" alt="video demonstration"/>
+      <br></br>
+      Codes and assets used for the development of this application can be found <a href="https://transfer.hft-stuttgart.de/gitlab/huijustinjing/ar-building-visualization-with-grayscale-filter"> here</a>.
+    </p>
+
+  </div>
+
+  <div class="footer"></div>
+  <div class="legal"></div>
+
+  <script src="../settings.js"> </script>
+  <script src="../main.js"> </script>
+</body>
+
+</html>
--- a/public/content/justin/thesis.pdf
+++ b/public/content/justin/thesis.pdf
--- a/public/content/muhamamd/1_PG3_Alfakhori_Muhamamd_MasterThesis.pdf
+++ b/public/content/muhamamd/1_PG3_Alfakhori_Muhamamd_MasterThesis.pdf
--- a/public/content/muhamamd/UGLthumbnail.gif
+++ b/public/content/muhamamd/UGLthumbnail.gif
--- a/public/content/paper.json
+++ b/public/content/paper.json
+[
+    {
+      "item": {
+        "title": "3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS",
+        "project": "Hackathon",
+        "authors": [
+            {
+                "firstName": "T",
+                "lastName": "Santhanavanich."
+            },{
+                "firstName": "P",
+                "lastName": "Wuerstle"
+            },{
+                "firstName": "J",
+                "lastName": "Silberer"
+            },{
+                "firstName": "V",
+                "lastName": "Loidl"
+            },{
+                "firstName": "P",
+                "lastName": "Rodrigues"
+            },{
+                "firstName": "V",
+                "lastName": "Coors"
+            }
+        ],
+        "imageLink":"imgs/publication/3droute.jpg",
+        "keywords":["CityGML","SensorThings API","Open Geospatial Consortium","pgRouting","Warning"],
+        "journal": {
+                "name":"ISPRS Annals of Photogrammetry, Remote Sensing & Spatial Information Sciences",
+                "volume":"VI-4/W2-2020",
+                "year":"2020",
+                "pages":"143-147"
+        },
+        "DOI":"https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020"
+       },
+      "links": {
+        "pdf":"",
+        "url": "https://www.isprs-ann-photogramm-remote-sens-spatial-inf-sci.net/VI-4-W2-2020/143/2020/",
+        "demo": "https://m4lab.hft-stuttgart.de/partizipation/"
+      }
+    },
+    {
+        "item": {
+          "title": "3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS",
+          "project": "Hackathon",
+          "authors": [
+              {
+                  "firstName": "T",
+                  "lastName": "Santhanavanich."
+              },{
+                  "firstName": "P",
+                  "lastName": "Wuerstle"
+              },{
+                  "firstName": "J",
+                  "lastName": "Silberer"
+              },{
+                  "firstName": "V",
+                  "lastName": "Loidl"
+              },{
+                  "firstName": "P",
+                  "lastName": "Rodrigues"
+              },{
+                  "firstName": "V",
+                  "lastName": "Coors"
+              }
+          ],
+          "imageLink":"imgs/publication/3droute.jpg",
+          "keywords":["CityGML","SensorThings API","Open Geospatial Consortium","pgRouting","Warning"],
+          "journal": {
+                  "name":"ISPRS Annals of Photogrammetry, Remote Sensing & Spatial Information Sciences",
+                  "volume":"VI-4/W2-2020",
+                  "year":"2020",
+                  "pages":"143--147"
+          },
+          "DOI":"https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020"
+         },
+        "links": {
+          "pdf":"",
+          "url": "https://www.isprs-ann-photogramm-remote-sens-spatial-inf-sci.net/VI-4-W2-2020/143/2020/",
+          "demo": "https://m4lab.hft-stuttgart.de/partizipation/"
+        }
+      },
+      {
+        "item": {
+          "title": "3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS",
+          "project": "Hackathon",
+          "authors": [
+              {
+                  "firstName": "T",
+                  "lastName": "Santhanavanich."
+              },{
+                  "firstName": "P",
+                  "lastName": "Wuerstle"
+              },{
+                  "firstName": "J",
+                  "lastName": "Silberer"
+              },{
+                  "firstName": "V",
+                  "lastName": "Loidl"
+              },{
+                  "firstName": "P",
+                  "lastName": "Rodrigues"
+              },{
+                  "firstName": "V",
+                  "lastName": "Coors"
+              }
+          ],
+          "imageLink":"imgs/publication/3droute.jpg",
+          "keywords":["CityGML","SensorThings API","Open Geospatial Consortium","pgRouting","Warning"],
+          "journal": {
+                  "name":"ISPRS Annals of Photogrammetry, Remote Sensing & Spatial Information Sciences",
+                  "volume":"VI-4/W2-2020",
+                  "year":"2020",
+                  "pages":"143--147"
+          },
+          "DOI":"https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020"
+         },
+        "links": {
+          "pdf":"",
+          "url": "https://www.isprs-ann-photogramm-remote-sens-spatial-inf-sci.net/VI-4-W2-2020/143/2020/"
+          
+        }
+      },
+      {
+        "item": {
+          "title": "TEST 3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS",
+          "project": "Hackathon",
+          "authors": [
+              {
+                  "firstName": "T",
+                  "lastName": "Santhanavanich."
+              },{
+                  "firstName": "P",
+                  "lastName": "Wuerstle"
+              },{
+                  "firstName": "J",
+                  "lastName": "Silberer"
+              },{
+                  "firstName": "V",
+                  "lastName": "Loidl"
+              },{
+                  "firstName": "P",
+                  "lastName": "Rodrigues"
+              },{
+                  "firstName": "V",
+                  "lastName": "Coors"
+              }
+          ],
+          "imageLink":"imgs/publication/3droute.jpg",
+          "keywords":["CityGML","SensorThings API","Open Geospatial Consortium","pgRouting","Warning"],
+          "conference":{
+                  "name":"Test",
+                  "date":"20.03.2020"
+          },
+          "DOI":"https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020"
+         },
+        "links": {
+          "url": "https://www.isprs-ann-photogramm-remote-sens-spatial-inf-sci.net/VI-4-W2-2020/143/2020/",
+          "demo": "https://m4lab.hft-stuttgart.de/partizipation/"
+        }
+      }
+]
+
--- a/public/content/paper2.json
+++ b/public/content/paper2.json
+[
+	{
+		"item": {
+			"title": "PREDICTING EMOTIONS FROM SENSORS FOR ASSISTED Pedelec",
+			"project": "iCity",
+			"authors": [
+				{
+					"firstName": "S.",
+					"lastName": "Schneider"
+				},
+				{
+					"firstName": "H.",
+					"lastName": "Dastageeri"
+				},
+				{
+					"firstName": "P.",
+					"lastName": "Rodriguez"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/schneider2020_1.jpg",
+			"keywords": [
+				"machine learning",
+				" experience sampling",
+				" mobile sensors",
+				" urban emotions"
+			],
+			"journal": {
+				"volume": "VI-4/W2-20",
+				"year": "2020",
+				"pages": "149-156"
+			},
+			"DOI": "10.5194/isprs-annals-VI-4-W2-2020-149-2020"
+		},
+		"links": {
+			"pdf": "https://www.isprs-ann-photogramm-remote-sens-spatial-inf-sci.net/VI-4-W2-2020/149/2020/",
+			"url": "https://www.isprs-ann-photogramm-remote-sens-spatial-inf-sci.net/VI-4-W2-2020/149/2020/",
+			"demo": "https://www.isprs-ann-photogramm-remote-sens-spatial-inf-sci.net/VI-4-W2-2020/149/2020/"
+		}
+	},
+	{
+		"item": {
+			"title": "A METHOD FOR ASSESSING REGIONAL BIOENERGY POTENTIALS BASED ON GIS DATA AND A DYNAMIC YIELD SIMULATION MODEL",
+			"project": "EnSys-LE",
+			"authors": [
+				{
+					"firstName": "K.",
+					"lastName": "Bao"
+				},
+				{
+					"firstName": "R.",
+					"lastName": "Padsala"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				},
+				{
+					"firstName": "D.",
+					"lastName": "Thrän"
+				},
+				{
+					"firstName": "B",
+					"lastName": "Schröter"
+				}
+			],
+			"imageLink": "./img/BAO 2020_07.jpg",
+			"keywords": [
+				"potential analysis",
+				" geographical information system (GIS)",
+				" bioenergy",
+				" AquaCrop"
+			],
+			"journal": {
+				"name": "Energies",
+				"volume": "13",
+				"year": "2020",
+				"pages": "64-88"
+			},
+			"DOI": "10.3390/en13246488"
+		},
+		"links": {
+			"pdf": " https://doi.org/10.3390/en13246488",
+			"url": " https://doi.org/10.3390/en13246488",
+			"demo": " https://doi.org/10.3390/en13246488"
+		}
+	},
+	{
+		"item": {
+			"title": "A CONCEPT OF QUALITY MANAGEMENT OF 3D CITY MODELS SUPPORTING APPLICATION-SPECIFIC REQUIREMENTS",
+			"project": "SimStadt, CityDoctor",
+			"authors": [
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				},
+				{
+					"firstName": "M.",
+					"lastName": "Betz"
+				},
+				{
+					"firstName": "E.",
+					"lastName": "Duminil"
+				}
+			],
+			"imageLink": "./img/Coors 2020_02.jpg",
+			"keywords": [
+				"3D City Model",
+				" CityGML",
+				" Quality Management",
+				" Heating demand simulation"
+			],
+			"journal": {
+				"name": "PFG – Journal of Photogrammetry, Remote Sensing and Geoinformation Science",
+				"volume": "88",
+				"year": "2020",
+				"pages": "3 - 14"
+			},
+			"DOI": "10.1007/s41064-020-00094-0"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.1007/s41064-020-00094-0",
+			"url": "https://doi.org/10.1007/s41064-020-00094-0",
+			"demo": "https://doi.org/10.1007/s41064-020-00094-0"
+		}
+	},
+	{
+		"item": {
+			"title": "A CONTINUOUS, SEMI-AUTOMATED WORKFLOW: FROM 3D CITY MODELS WITH GEOMETRIC OPTIMIZATION AND CFD SIMULATIONS TO VISUALIZATION OF WIND IN AN URBAN ENVIRONMENT",
+			"project": "iCity",
+			"authors": [
+				{
+					"firstName": "M.E.",
+					"lastName": "Deininger"
+				},
+				{
+					"firstName": "M.v.d.",
+					"lastName": "Grün"
+				},
+				{
+					"firstName": "R.",
+					"lastName": "Piepereit"
+				},
+				{
+					"firstName": "S.",
+					"lastName": "Schneider"
+				},
+				{
+					"firstName": "T.",
+					"lastName": "Santhanavanich"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				},
+				{
+					"firstName": "U.",
+					"lastName": "Voß"
+				}
+			],
+			"imageLink": "./img/Deininger 2020_10.jpg",
+			"keywords": [
+				"smart city",
+				" urban environment",
+				" computational fluid dynamics",
+				" computational wind engineering",
+				" open geospatial consortium",
+				" environmental simulation",
+				" 3D visualization",
+				" web services",
+				" automated workflow",
+				" CityGML"
+			],
+			"journal": {
+				"name": "ISPRS International Journal of Geo-Information",
+				"volume": "9",
+				"year": "2020",
+				"pages": "657-680"
+			},
+			"DOI": "10.3390/ijgi9110657"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.3390/ijgi9110657",
+			"url": "https://doi.org/10.3390/ijgi9110657",
+			"demo": "https://doi.org/10.3390/ijgi9110657"
+		}
+	},
+	{
+		"item": {
+			"title": "SEASONALITY DEDUCTION PLATFORM: FOR PM10, PM2.5, NO, NO2 AND O3 IN RELATIONSHIP WITH WIND SPEED AND HUMIDITY",
+			"authors": [
+				{
+					"firstName": "S.",
+					"lastName": "Harbola"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Harbola 2020_09.jpg",
+			"keywords": [
+				"interactive platform",
+				" agglomerative clustering",
+				" cities planning",
+				" seasonality",
+				" unsupervised classification",
+				" dendrogram",
+				" pollution parameters",
+				" visual analytic",
+				" meteorological data",
+				" Spearman rank"
+			],
+			"journal": {
+				"name": "ISPRS Annals of the Photogrammetry, Remote Sensing and Spatial Information Sciences",
+				"volume": "VI-4-W2-2020",
+				"year": "2020",
+				"pages": "71-78"
+			},
+			"DOI": "10.5194/isprs-annals-VI-4-W2-2020-71-2020"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-71-2020",
+			"url": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-71-2020",
+			"demo": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-71-2020"
+		}
+	},
+	{
+		"item": {
+			"title": "INTEGRATION OF HETEROGENEOUS CORONAVIRUS DISEASE COVID-19 DATA SOURCES USING OGC SENSORTHINGS API",
+			"project": "iCity",
+			"authors": [
+				{
+					"firstName": "T.",
+					"lastName": "Santhanavanich"
+				},
+				{
+					"firstName": "C.",
+					"lastName": "Kim"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Santhanavanich 2020_09.jpg",
+			"keywords": [
+				"SensorThings",
+				" COVID-19",
+				" Smart Cities",
+				" Urban data",
+				" Open Geospatial Consortium"
+			],
+			"journal": {
+				"name": "ISPRS Annals of the Photogrammetry, Remote Sensing and Spatial Information Sciences",
+				"volume": "VI-4-W2-2020",
+				"year": "2020",
+				"pages": "135-141"
+			},
+			"DOI": "10.5194/isprs-annals-VI-4-W2-2020-135-2020"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-135-2020",
+			"url": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-135-2020",
+			"demo": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-135-2020"
+		}
+	},
+	{
+		"item": {
+			"title": "3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS",
+			"project": "iCity",
+			"authors": [
+				{
+					"firstName": "T.",
+					"lastName": "Santhanavanich"
+				},
+				{
+					"firstName": "P.",
+					"lastName": "Wuerstle"
+				},
+				{
+					"firstName": "J.",
+					"lastName": "Silberer"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Loidl"
+				},
+				{
+					"firstName": "P.",
+					"lastName": "Rodrigues"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Wuerstle 2020_09.jpg",
+			"keywords": [
+				"Safe routing",
+				" pgRouting",
+				" CityGML",
+				" SensorThings API",
+				" OpenStreetMap",
+				" Open Geospatial Consortium"
+			],
+			"journal": {
+				"name": "ISPRS Annals of the Photogrammetry, Remote Sensing and Spatial Information Sciences",
+				"volume": "VI-4-W2-2020",
+				"year": "2020",
+				"pages": "143-147"
+			},
+			"DOI": "10.5194/isprs-annals-VI-4-W2-2020-143-2020"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020",
+			"url": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020",
+			"demo": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020"
+		}
+	},
+	{
+		"item": {
+			"title": "EXPLORING SCHEMES FOR VISUALIZING URBAN WIND FIELDS BASED ON CFD SIMULATIONS BY EMPLOYING OGC STANDARDS",
+			"project": "iCity",
+			"authors": [
+				{
+					"firstName": "S.",
+					"lastName": "Schneider"
+				},
+				{
+					"firstName": "T.",
+					"lastName": "Santhanavanich"
+				},
+				{
+					"firstName": "A.",
+					"lastName": "Koukofikis"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Schneider 2020_09.jpg",
+			"keywords": [
+				"Computational Fluid Dynamics (CFD) Simulation",
+				" Environmental Simulation",
+				" Visualization",
+				" Web Service",
+				" 3D City Models",
+				" CityGML",
+				" Open Geospatial Consortium"
+			],
+			"journal": {
+				"name": "ISPRS Annals of the Photogrammetry, Remote Sensing and Spatial Information Sciences",
+				"volume": "VI-4-W2-2020",
+				"year": "2020",
+				"pages": "157-163"
+			},
+			"DOI": "10.5194/isprs-annals-VI-4-W2-2020-157-2020"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-157-2020",
+			"url": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-157-2020",
+			"demo": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-157-2020"
+		}
+	},
+	{
+		"item": {
+			"title": "“I KNOW HOW YOU FEEL” – PREDICTING EMOTIONS FROM SENSORS FOR ASSISTED PEDELEC EXPERIENCES IN SMART CITIES",
+			"project": "SimStadt, iCity",
+			"authors": [
+				{
+					"firstName": "S.",
+					"lastName": "Schneider"
+				},
+				{
+					"firstName": "H.",
+					"lastName": "Dastageeri"
+				},
+				{
+					"firstName": "P.",
+					"lastName": "Rodrigues"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Dastageeri 2020_09.jpg",
+			"keywords": [
+				"experience sampling",
+				" mobile sensors",
+				" urban emotions",
+				" machine learning"
+			],
+			"journal": {
+				"name": "ISPRS Annals of the Photogrammetry, Remote Sensing and Spatial Information Sciences",
+				"volume": "VI-4-W2-2020",
+				"year": "2020",
+				"pages": "149-156"
+			},
+			"DOI": "10.5194/isprs-annals-VI-4-W2-2020-149-2020"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-149-2020",
+			"url": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-149-2020",
+			"demo": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-149-2020"
+		}
+	},
+	{
+		"item": {
+			"title": "THE USE OF 3D GEOVISUALIZATION AND CROWDSOURCING FOR OPTIMIZING ENERGY SIMULATION",
+			"project": "3ProzentPlus",
+			"authors": [
+				{
+					"firstName": "S.",
+					"lastName": "Sini"
+				},
+				{
+					"firstName": "R.",
+					"lastName": "Sihombing"
+				},
+				{
+					"firstName": "P.",
+					"lastName": "Kabiro"
+				},
+				{
+					"firstName": "T.",
+					"lastName": "Santhanavanich"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Sini 2020_09.jpg",
+			"keywords": [
+				"3D Geovisualization",
+				" CityGML",
+				" Crowdsourcing",
+				" Energy Simulation"
+			],
+			"journal": {
+				"name": "ISPRS Annals of the Photogrammetry, Remote Sensing and Spatial Information Sciences",
+				"volume": "VI-4-W2-2020",
+				"year": "2020",
+				"pages": "165-172"
+			},
+			"DOI": "10.5194/isprs-annals-VI-4-W2-2020-165-2020"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-165-2020",
+			"url": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-165-2020",
+			"demo": "https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-165-2020"
+		}
+	},
+	{
+		"item": {
+			"title": "SMART VILLAGES – VERNETZUNG VON 3D-GEOINFORMATION UND UMWELTRELEVANTEN SENSORDATEN IM LÄNDLICHEN RAUM",
+			"project": "Smart Villages",
+			"authors": [
+				{
+					"firstName": "M.",
+					"lastName": "Vögele"
+				},
+				{
+					"firstName": "T.",
+					"lastName": "Santhanavanich"
+				},
+				{
+					"firstName": "P.",
+					"lastName": "Würstle"
+				},
+				{
+					"firstName": "G.",
+					"lastName": "Graf"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Vögele 2020.jpg",
+			"keywords": [
+				"Smart Cities",
+				" 3D-Webvisualisierung",
+				" Geoinformation",
+				" Sensordatenvernetzung",
+				" CityGML",
+				" SensorThings-API"
+			],
+			"journal": {
+				"name": "Gis Science",
+				"volume": "33",
+				"year": "2020",
+				"pages": "47-58"
+			}
+		},
+		"links": {}
+	},
+	{
+		"item": {
+			"title": "FRAMEWORK FOR EMULATION AND UNCERTAINTY QUANTIFICATION OF A STOCHASTIC BUILDING PERFORMANCE SIMULATOR",
+			"authors": [
+				{
+					"firstName": "P",
+					"lastName": "Wate"
+				},
+				{
+					"firstName": "M",
+					"lastName": "Iglesias"
+				},
+				{
+					"firstName": "V",
+					"lastName": "Coors"
+				},
+				{
+					"firstName": "D",
+					"lastName": "Robinson"
+				}
+			],
+			"imageLink": "./img/Wate_2020.jpg",
+			"keywords": [
+				"Gaussian process emulator",
+				" Building performance",
+				" Stochasticity",
+				" Uncertainty quantification and decomposition"
+			],
+			"journal": {
+				"name": "Applied Energy",
+				"volume": "258",
+				"year": "2020",
+				"pages": "113-759"
+			},
+			"DOI": " 10.1016/j.apenergy.2019.113759"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.1016/j.apenergy.2019.113759",
+			"url": "https://doi.org/10.1016/j.apenergy.2019.113759",
+			"demo": "https://doi.org/10.1016/j.apenergy.2019.113759"
+		}
+	},
+	{
+		"item": {
+			"title": "VISUAL ANALYTICS WEB PLATFORM FOR DETECTING HIGH WIND ENERGY POTENTIAL IN URBAN ENVIRONMENTS BY EMPLOYING OGC STANDARDS",
+			"project": "Ordnance Survey GB,  1Spatial",
+			"authors": [
+				{
+					"firstName": "A.",
+					"lastName": "Koukofikis"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Koukofikis_2020_09.JPG",
+			"keywords": [
+				"Visual analytics",
+				" CFD",
+				" Wind energy",
+				" OGC",
+				" 3DPS",
+				" Web Visualization",
+				" WebGL"
+			],
+			"journal": {
+				"name": "The International Archives of the Photogrammetry, Remote Sensing and Spatial Information Sciences",
+				"volume": "XLIV-4-W1-2020",
+				"year": "2020",
+				"pages": "71-74"
+			},
+			"DOI": "10.5194/isprs-archives-XLIV-4-W1-2020-71-2020"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5194/isprs-archives-XLIV-4-W1-2020-71-2020",
+			"url": "https://doi.org/10.5194/isprs-archives-XLIV-4-W1-2020-71-2020",
+			"demo": "https://doi.org/10.5194/isprs-archives-XLIV-4-W1-2020-71-2020"
+		}
+	},
+	{
+		"item": {
+			"title": "GIS-BASED ASSESSMENT OF REGIONAL BIOMASS POTENTIALS AT THE EXAMPLE OF TWO COUNTIES IN GERMANY",
+			"authors": [
+				{
+					"firstName": "K.",
+					"lastName": "Bao"
+				},
+				{
+					"firstName": "R.",
+					"lastName": "Padsala"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				},
+				{
+					"firstName": "D.",
+					"lastName": "Thrän"
+				},
+				{
+					"firstName": "B.",
+					"lastName": "Schröter"
+				}
+			],
+			"imageLink": "./img/Padsala 2020_07.jpg",
+			"keywords": [
+				"biofuel",
+				" geographical information system (GIS)",
+				" potential"
+			],
+			"journal": {
+				"name": "Sustainable Resources for Decarbonising the Economy",
+				"year": "2020",
+				"pages": "77-85"
+			},
+			"DOI": "10.5071/28thEUBCE2020-1CV.4.15"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.5071/28thEUBCE2020-1CV.4.15",
+			"url": "https://doi.org/10.5071/28thEUBCE2020-1CV.4.15",
+			"demo": "https://doi.org/10.5071/28thEUBCE2020-1CV.4.15"
+		}
+	},
+	{
+		"item": {
+			"title": "THE CONCEPTION OF AN URBAN ENERGY DASHBOARD USING 3D CITY MODELS",
+			"project": "IN-SOURCE, Smart Villages",
+			"authors": [
+				{
+					"firstName": "P.",
+					"lastName": "Würstle"
+				},
+				{
+					"firstName": "T.",
+					"lastName": "Santhanavanich"
+				},
+				{
+					"firstName": "R.",
+					"lastName": "Padsala"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Würstle 2020_06.jpg",
+			"keywords": [
+				"Urban Energy Dashboard",
+				" 3D City Models",
+				" Energy Data Visualization",
+				" OGC Standards"
+			],
+			"journal": {
+				"year": "2020",
+				"pages": "523-527"
+			},
+			"DOI": "10.1145/3396851.3402650"
+		},
+		"links": {
+			"pdf": "https://doi.org/10.1145/3396851.3402650",
+			"url": "https://doi.org/10.1145/3396851.3402650",
+			"demo": "https://doi.org/10.1145/3396851.3402650"
+		}
+	},
+	{
+		"item": {
+			"title": "FROM URBAN DESIGN TO ENERGY SIMULATION - A DATA CONVERSION PROCESS BRIDGING THE GAP BETWEEN TWO DOMAINS",
+			"project": "IN-SOURCE",
+			"authors": [
+				{
+					"firstName": "R.",
+					"lastName": "Padsala"
+				},
+				{
+					"firstName": "T.",
+					"lastName": "Fink"
+				},
+				{
+					"firstName": "J.",
+					"lastName": "Peters-Andres"
+				},
+				{
+					"firstName": "E.",
+					"lastName": "Gebetsroither-Geringer"
+				},
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/Padsala 2020_09.jpg",
+			"keywords": [
+				"Data Interoperability",
+				" Geometric Modelling",
+				" Urban Design",
+				" Energy Simulation",
+				" CityGML"
+			],
+			"journal": {
+				"year": "2020",
+				"pages": "365-375"
+			}
+		},
+		"links": {
+			"pdf": "https://archive.corp.at/cdrom2020/papers2020/CORP2020_54.pdf",
+			"url": "https://archive.corp.at/cdrom2020/papers2020/CORP2020_54.pdf",
+			"demo": "https://archive.corp.at/cdrom2020/papers2020/CORP2020_54.pdf"
+		}
+	},
+	{
+		"item": {
+			"title": "DIGITIZATION OF VIRTUAL CITY MODELS: CITYGML AND ENERGY ADE",
+			"project": "DIM4Energy",
+			"authors": [
+				{
+					"firstName": "V.",
+					"lastName": "Coors"
+				}
+			],
+			"imageLink": "./img/V. Coors 2020_02.jpg",
+			"journal": {
+				"name": "Digital energy planning & optimization of Urban Regions",
+				"year": "2020",
+				"pages": "32-33"
+			},
+            "keywords": [
+				"..."
+			]
+		},
+		"links": {
+			"pdf": "https://www.ait.ac.at/fileadmin//mc/energy/Business_Cases/7_Smart_Resilient_Cities/DIM4Energy_Leitfaden_Web.pdf",
+			"url": "https://www.ait.ac.at/fileadmin//mc/energy/Business_Cases/7_Smart_Resilient_Cities/DIM4Energy_Leitfaden_Web.pdf",
+			"demo": "https://www.ait.ac.at/fileadmin//mc/energy/Business_Cases/7_Smart_Resilient_Cities/DIM4Energy_Leitfaden_Web.pdf"
+		}
+	}
+]
\ No newline at end of file
--- a/public/content/team.json
+++ b/public/content/team.json
+[
+    {
+        "firstName": "Prof. Dr. Volker",
+        "lastName": "Coors",
+        "jobTitle_en": "Lab Leader",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/f/2/csm_Coors-Volker__2__2fbc5a88e2.jpg",
+        "profile_link": "https://www.hft-stuttgart.de/p/volker-coors",
+        "researchTopics": "Smart Cities | OGC Standards | Sensors & IoT | 3D City Models | 3D Web Visualization | 3D Simulation | Big Data",
+        "optional": {
+            "researchGateURL": "https://www.researchgate.net/profile/Volker-Coors",
+            "LinkedInURL": "https://www.linkedin.com/in/volker-coors-97173a6/"
+        }
+    },
+    {
+        "firstName": "Joe T.",
+        "lastName": "Santhanavanich",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/9/b/csm_JoeSquare_89b2f100d1.jpg",
+        "profile_link": "https://www.hft-stuttgart.de/p/thunyathep-santhanavanich",
+        "researchTopics": "Smart Cities | OGC Standards | Sensors & IoT | 3D City Models | 3D Web Visualization | 3D Simulation | Big Data",
+        "optional": {
+            "researchGateURL": "https://www.researchgate.net/profile/Thunyathep-Santhanavanich",
+            "googleScholarURL": "https://scholar.google.com/citations?user=RKNY04EAAAAJ&hl=en",
+            "LinkedInURL": "https://www.linkedin.com/in/thunyatheps/"
+        }
+    },
+    {
+        "firstName": "Dr. Sven",
+        "lastName": "Schneider",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/9/d/csm_sven_head_shot_ieee_d1acb7cb1f.png",
+        "profile_link": "https://www.hft-stuttgart.de/p/Sven-Schneider",
+        "researchTopics": "Remote Sensing | Spectroscopy | Geology| Geo-informatics | Machine learning",
+        "optional": {
+            "LinkedInURL": "https://www.linkedin.com/in/sven-schneider-2236bb71/"
+        }
+    },
+    {
+        "firstName": "Rushikesh ",
+        "lastName": "Padsala",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/1/6/csm_Passport_Size_Pic__2__d559dc6245.jpg",
+        "profile_link": "https://www.hft-stuttgart.de/p/Rushikesh-Padsala",
+        "researchTopics": "Digital Twins | 3D City Models | Geo-Data Management | Spatial Planning | Smart Sustainable Cities",
+		"optional": {
+            "researchGateURL": "https://www.researchgate.net/profile/Rushikesh-Padsala",
+            "LinkedInURL": "https://www.linkedin.com/in/rpadsala/"
+			}
+    },
+    {
+        "firstName": "Matthias",
+        "lastName": "Betz",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/9/6/csm_passbild_8f16c0f011.png",
+        "profile_link": "https://www.hft-stuttgart.de/p/Matthias-Betz",
+        "researchTopics": "3D City Model | CityGML | Quality Validation | Big Data"
+    },
+    {
+        "firstName": "Muhammad",
+        "lastName": "Alfakhori",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/7/a/csm_image_716c0f9337.jpg",
+        "profile_link": "https://www.hft-stuttgart.de/p/muhammad-alfakhori",
+        "researchTopics": "Geo-informatics | AR/VR",
+        "optional": {
+            "LinkedInURL": "https://www.linkedin.com/in/muhammad-alfakhori/"
+        }
+    },
+    {
+        "firstName": "Habiburrahman ",
+        "lastName": "Dastageeri",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "imgs/avatar/Habib.jpg",
+        "profile_link": "https://www.hft-stuttgart.de/p/habiburrahman-dastageeri",
+        "researchTopics": "Geo-informatics | AR/VR",
+        "optional": {
+            "LinkedInURL": "https://www.linkedin.com/in/dastageeri/"
+        }
+    },
+    {
+        "firstName": "Patrick",
+        "lastName": "Würstle",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/7/f/csm_ImageProfil_e7a92cdd9b.jpg",
+        "profile_link": "https://www.hft-stuttgart.de/p/patrick-wuerstle",
+        "researchTopics": "Smart Cities | OGC Standards | Participation Platform | 3D City Models | 3D Web Visualization | 3D Simulation | Big Data",
+        "optional": {
+            "LinkedInURL": "https://www.linkedin.com/in/patrick-w%C3%BCrstle-939027170/"
+        }
+    },
+    {
+        "firstName": "Rosanny",
+        "lastName": "Sihombing",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "https://www.hft-stuttgart.de/fileadmin/Dateien/Profilbilder/_processed_/3/a/csm_IMG_6311_resized_371f276be7.jpg",
+        "profile_link": "https://www.hft-stuttgart.de/p/rosanny-sihombing",
+        "researchTopics": "Smart Cities | 3D Web Visualization | AR",
+        "optional": {
+            "researchGateURL": "https://www.researchgate.net/profile/Rosanny-Sihombing",
+            "LinkedInURL": "https://www.linkedin.com/in/rsihombing/"
+        }
+    },
+    {
+        "firstName": "Athanasios",
+        "lastName": "Koukofikis",
+        "jobTitle_en": "Researcher",
+        "imgUrl": "imgs/avatar/sakis1.png",
+        "profile_link": "https://www.hft-stuttgart.de/p/Athanasios-Koukofikis",
+        "researchTopics": ""
+    }
+]
--- a/public/content/text.txt
+++ b/public/content/text.txt
--- a/public/css/bootstrap.min.css
+++ b/public/css/bootstrap.min.css
--- a/public/css/custom.css
+++ b/public/css/custom.css
+.btn-circle.btn-xl {
+    width: 70px;
+    height: 70px;
+    padding: 10px 16px;
+    border-radius: 35px;
+    font-size: 24px;
+    line-height: 1.33;
+}
+
+.btn-circle {
+    width: 30px;
+    height: 30px;
+    padding: 6px 0px;
+    border-radius: 15px;
+    text-align: center;
+    font-size: 12px;
+    line-height: 1.42857;
+}
+
+.pre-style {
+    display: block;
+    padding: 9.5px;
+    margin: 0 0 10px;
+    font-size: 13px;
+    line-height: 1.42857143;
+    color: #333;
+    word-break: break-all;
+    word-wrap: break-word;
+    background-color: #f5f5f5;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+}
+
+::selection {
+    color: black;
+    background: #B4D5FE;
+  }
+
+  .publication_card {
+    padding: 15px;
+  }
\ No newline at end of file
--- a/public/css/form_joeStyle.css
+++ b/public/css/form_joeStyle.css
+/* Bootstrap a bit adapt */
+.joeForm {
+    display: block;
+    width: auto;
+    height: 25px;
+    padding: 3px 3px;
+    font-size: 14px;
+    line-height: 1;
+    color: #555;
+    background-color: #fff;
+    background-image: none;
+    border: 1px solid #696a6d;
+    border-radius: 10px;
+}
+
+i.fas {
+    display: inline-block;
+    border-radius: 60px;
+    box-shadow: 0px 0px 2px #888;
+    padding: 0.5em 0.6em;
+  
+  }
\ No newline at end of file
--- a/public/css/index.css
+++ b/public/css/index.css
+.backdrop {
+    display: inline-block;
+    background: rgba(42, 42, 42, 0.6);
+    border-radius: 5px;
+    border: 1px solid #444;
+    padding: 10px 10px;
+    color: #fff;
+    width: 250px;
+    /* font: 1em "Fira Sans", sans-serif; */
+}
+
+
+
+.mytab { 
+       display:inline-block; 
+       margin-left: 35px; 
+}
+
+h1 {
+	/* font-family: 'Lato', sans-serif; */
+	font-style: bold;
+    color: red;
+	background-color: rgba(42, 42, 42, 0);
+	text-shadow: 3px 3px #000000
+}
+h2 {
+	/* font-family: 0.75em 'Lato', sans-serif; */
+	font-weight: bold;
+    color: wheat;
+}
+h3 {
+	/* font: 1em 'Lato', sans-serif;
+	font-style: bold; */
+    color: rgb(179, 245, 209);
+}
+
+#heightSliderLabel, #heightValue {
+    vertical-align: top;
+}
+
+.backdrop a:link, .backdrop a:visited, .backdrop a:hover {
+    color: #fff
+}
+
+.loadingIndicator {
+    display: none;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-top: -33px;
+    margin-left: -33px;
+    width: 66px;
+    height: 66px;
+    background: url(Source/Images/ajax-loader.gif) center no-repeat;
+}
+
+.cover {
+    display: none;
+    position: absolute;
+    background-color: rgba(0, 0, 0, 0.75);
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+}
+
+#menu {
+    position: absolute;
+    left: 10px;
+    top: 150px;
+}
+#img_menu {
+	margin-right: 10px; padding: 0; width: 300px;position: absolute; left: 5px;
+}
+#img_menu:hover {
+	cursor: pointer;
+	opacity: .9;
+}
+
+#HightChartContainer {
+    position: absolute;
+    /* right: 50px; */
+    top: 95px;
+    left: 390px;
+    width: 65%;
+    min-height: 60%;
+    margin: 0 auto;
+}
+#TableContainer {
+    position: absolute;
+    /* right: 50px; */
+    top: 750px;
+    left: 390px;
+    width: 65%;
+    /* min-height: 60%; */
+    margin: 0 auto;
+}
+#ebikeRealtime {
+    position: absolute;
+    left: 245px;
+	top: 10px;
+	min-width: 10%;
+	min-height: 50%;
+	margin: 0 auto;
+}
+
+#ebikeInfo {
+    position: absolute;
+    right: 10px;
+	top: 50px;
+	width: 200px;
+}
+
+#StatInfo{
+	position: absolute;
+	right: 50px;
+	bottom: 10px;
+	width: 50%;
+}
+
+/* #ebikeRealtime {
+    position: absolute;
+    right: 10px;
+	top: 100px;
+	width: 250px;
+} */
+.nowrap {
+    white-space: nowrap;
+}
+
+button.cesium-infoBox-camera {
+    display: none;
+}
+
+html, body, #cesiumContainer {
+    top: 0px;
+    left: 0px;
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+    z-index: -1;
+}
+#uiMenu {
+    border-radius:5px;
+    padding: 10px;
+    position:absolute;
+    left: 20px;
+    font-family: "Arial";
+    z-index: 99999;
+}
+#redHook {
+	cursor: pointer;
+}
+
+.myButtonOff {
+	-moz-box-shadow: 3px 4px 0px 0px #8a2a21;
+	-webkit-box-shadow: 3px 4px 0px 0px #8a2a21;
+	box-shadow: 3px 4px 0px 0px #8a2a21;
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f09c87), color-stop(1, #f24437));
+	background:-moz-linear-gradient(top, #f09c87 5%, #f24437 100%);
+	background:-webkit-linear-gradient(top, #f09c87 5%, #f24437 100%);
+	background:-o-linear-gradient(top, #f09c87 5%, #f24437 100%);
+	background:-ms-linear-gradient(top, #f09c87 5%, #f24437 100%);
+	background:linear-gradient(to bottom, #f09c87 5%, #f24437 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f09c87', endColorstr='#f24437',GradientType=0);
+	background-color:#f09c87;
+	-moz-border-radius:18px;
+	-webkit-border-radius:18px;
+	border-radius:18px;
+	border:1px solid #d02718;
+	display:inline-block;
+	cursor:pointer;
+	color:#ffffff;
+	font-family:Verdana;
+	font-size:12px;
+	padding:6px 15px;;
+	text-decoration:none;
+	text-shadow:0px 1px 0px #810e05;
+}
+.myButtonOff:hover {
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f24437), color-stop(1, #f09c87));
+	background:-moz-linear-gradient(top, #f24437 5%, #f09c87 100%);
+	background:-webkit-linear-gradient(top, #f24437 5%, #f09c87 100%);
+	background:-o-linear-gradient(top, #f24437 5%, #f09c87 100%);
+	background:-ms-linear-gradient(top, #f24437 5%, #f09c87 100%);
+	background:linear-gradient(to bottom, #f24437 5%, #f09c87 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24437', endColorstr='#f09c87',GradientType=0);
+	background-color:#f24437;
+}
+.myButtonOff:active {
+	position:relative;
+	top:1px;
+}
+
+.myButtonOn {
+	-moz-box-shadow: 3px 4px 0px 0px #9acc85;
+	-webkit-box-shadow: 3px 4px 0px 0px #9acc85;
+	box-shadow: 3px 4px 0px 0px #9acc85;
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #74ad5a), color-stop(1, #68a54b));
+	background:-moz-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
+	background:-webkit-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
+	background:-o-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
+	background:-ms-linear-gradient(top, #74ad5a 5%, #68a54b 100%);
+	background:linear-gradient(to bottom, #74ad5a 5%, #68a54b 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#74ad5a', endColorstr='#68a54b',GradientType=0);
+	background-color:#74ad5a;
+	-moz-border-radius:18px;
+	-webkit-border-radius:18px;
+	border-radius:18px;
+	border:1px solid #3b6e22;
+	display:inline-block;
+	cursor:pointer;
+	color:#ffffff;
+	font-family:Verdana;
+	font-size:12px;
+	padding:2px 2px;
+	text-decoration:none;
+	text-shadow:0px 1px 0px #92b879;
+}
+.myButtonOn:hover {
+	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #68a54b), color-stop(1, #74ad5a));
+	background:-moz-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
+	background:-webkit-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
+	background:-o-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
+	background:-ms-linear-gradient(top, #68a54b 5%, #74ad5a 100%);
+	background:linear-gradient(to bottom, #68a54b 5%, #74ad5a 100%);
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#68a54b', endColorstr='#74ad5a',GradientType=0);
+	background-color:#68a54b;
+}
+.myButtonOn:active {
+	position:relative;
+	top:1px;
+}
+
+.myButtonRed {
+	-moz-box-shadow:inset 0px 1px 0px 0px #f5978e;
+	-webkit-box-shadow:inset 0px 1px 0px 0px #f5978e;
+	box-shadow:inset 0px 1px 0px 0px #f5978e;
+	background-color:#f24537;
+	-moz-border-radius:3px;
+	-webkit-border-radius:2px;
+	border-radius:2px;
+	border:1px solid #d02718;
+	display:inline-block;
+	cursor:pointer;
+	color:#ffffff;
+	font-family:Trebuchet MS;
+	font-size:12px;
+	padding:2px 2px;
+	text-decoration:none;
+}
+.myButtonRed:hover {
+	background-color:#c62d1f;
+}
+.myButtonRed:active {
+	position:relative;
+	top:1px;
+}
+
+.myButtonGreen {
+	-moz-box-shadow:inset 0px 1px 0px 0px #caefab;
+	-webkit-box-shadow:inset 0px 1px 0px 0px #caefab;
+	box-shadow:inset 0px 1px 0px 0px #caefab;
+	background-color:#77d42a;
+	-moz-border-radius:3px;
+	-webkit-border-radius:2px;
+	border-radius:2px;
+	border:1px solid #268a16;
+	display:inline-block;
+	cursor:pointer;
+	color:#0a0a0a;
+	font-family:Trebuchet MS;
+	font-size:12px;
+	padding:2px 2px;
+	text-decoration:none;
+}
+.myButtonGreen:hover {
+	background-color:#5cb811;
+}
+.myButtonGreen:active {
+	position:relative;
+	top:1px;
+}
+
+.myButtonBlue {
+	-moz-box-shadow:inset 0px 1px 0px 0px #97c4fe;
+	-webkit-box-shadow:inset 0px 1px 0px 0px #97c4fe;
+	box-shadow:inset 0px 1px 0px 0px #97c4fe;
+	background-color:#3d94f6;
+	-moz-border-radius:3px;
+	-webkit-border-radius:2px;
+	border-radius:2px;
+	border:1px solid #337fed;
+	display:inline-block;
+	cursor:pointer;
+	color:#ffffff;
+	font-family:Trebuchet MS;
+	font-size:12px;
+	padding:2px 2px;
+	text-decoration:none;
+	text-shadow:0px 1px 0px #1570cd;
+}
+.myButtonBlue:hover {
+	background-color:#1e62d0;
+}
+.myButtonBlue:active {
+	position:relative;
+	top:1px;
+}
+
+
+#3DTiles {
+    padding-top: 10px;
+}
+
+/* for the arrow down */
+/* i {
+	
+	border-width: 0 3px 3px 0;
+	display: inline-block;
+	padding: 3px;
+  }
+  .down {
+	border: solid rgb(138, 154, 226);
+    transform: rotate(45deg);
+    -webkit-transform: rotate(45deg);
+}   */
+
+.mainbackdrop {
+	overflow: scroll;
+	overflow-x: hidden;
+	max-height: 60%;
+}
+
+/* Hide Scroll bar x and pretty right */
+::-webkit-scrollbar {
+	width: 5px;
+}
+
+::-webkit-scrollbar-track {
+	background-color: rgba(42, 42, 42, 0);
+}
+
+/* the new scrollbar will have a flat appearance with the set background color */
+
+::-webkit-scrollbar-thumb {
+	background-color: rgba(250, 250, 250, 0.5);
+	border-radius: 20px
+}
+
+/* this will style the thumb, ignoring the track */
+
+::-webkit-scrollbar-button {
+	background-color: rgba(42, 42, 42, 0);
+}
+
+/* optionally, you can style the top and the bottom buttons (left and right for horizontal bars) */
+
+::-webkit-scrollbar-corner {
+	background-color: rgba(42, 42, 42, 0);
+}
--- a/public/css/language.css
+++ b/public/css/language.css
+.selectpicker{
+    cursor: pointer
+}
+
--- a/public/css/legend.css
+++ b/public/css/legend.css
+.outlined {
+    border: 0px solid black;
+ }
+
+ p{
+     margin-top: 1px;
+     margin-bottom: 5px;
+ }
+
+ h6{
+     margin-top: 2px;
+     margin-bottom: 2px;
+ }
+#legend {
+    position: absolute;
+    /*display: none; */
+    display: block;
+    width: 130px;
+    /*height: 300px; */
+    
+    bottom: 5px;
+    right: 5px; 
+	/*left: 85%;*/
+    background-color: rgba(0, 0, 0, 0.70); /* dim the background */
+    z-index: 2;
+    cursor: auto; /* ??? */
+    padding: 1px;    
+	
+	color: white;
+	font-size: 1.0em;
+    font-weight: bold;
+}
+
--- a/public/css/main.css
+++ b/public/css/main.css
+.jumbotron {
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+  margin-bottom: 0;
+  background-color: #fff;
+}
+
+@media (min-width: 768px) {
+  .jumbotron {
+    padding-top: 6rem;
+    padding-bottom: 6rem;
+  }
+}
+
+#document-body {
+  font-family: 'Noto Sans JP', sans-serif;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: 'Roboto', sans-serif;
+}
+
+.content-subtitle {
+  font-family: 'Noto Sans JP';
+  font-size: 0.85em;
+}
+
+.jumbotron p:last-child {
+  margin-bottom: 0;
+}
+
+/* .jumbotron h1 {
+  font-weight: 700;
+} */
+
+.jumbotron .container {
+  max-width: 40rem;
+}
+
+footer {
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+}
+
+footer p {
+  margin-bottom: 0.25rem;
+}
+
+body {
+  background-color: #cc3125;
+  /* thistle; */
+}
+
+.bd-placeholder-img {
+  font-size: 1.125rem;
+  text-anchor: middle;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+@media (min-width: 768px) {
+  .bd-placeholder-img-lg {
+    font-size: 3.5rem;
+  }
+}
+
+
+a {
+  color: #2196f3;
+  /* text-decoration: underline; */
+  background-color: transparent;
+}
+
+a:hover {
+  color: rgb(65, 57, 57);
+}
+
+a:visited {
+  /* color: black; */
+}
+
+
+.myBtn {
+  color: #fff;
+  background-color: tomato;
+  border-color: thistle;
+  /*set the color you want here*/
+  width: 180px;
+}
+
+.myBtn:hover,
+.myBtn:focus,
+.myBtn:active,
+.myBtn.active,
+.open>.dropdown-toggle.myBtn {
+  color: #fff;
+  background-color: thistle;
+  border-color: #285e8e;
+  /*set the color you want here*/
+}
+
+.thumbimg {
+  width: 100%;
+  height: 225px;
+}
+
+a.button {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  appearance: button;
+
+  text-decoration: none;
+  color: blue;
+  border: solid;
+  border: 4px;
+}
+
+.windSVG {
+  margin-right: 20px;
+}
+
+.hftlogo {
+  /* margin-right : 20px; */
+  /* width: 100px; */
+}
+
+.hftlogo:hover {
+  cursor: pointer;
+}
+
+.extension {
+  padding: 20px 10px;
+  /* min-height: 445px; */
+  /* max-height: 445px; */
+  /* margin: 20px; */
+  height: 610px;
+}
+
+.py-5 {
+  padding: 1rem !important;
+}
+
+.card-body {
+  min-height: 90px;
+  padding: 0.5rem 0.5rem 0.2rem;
+
+}
+
+.card-text {
+  max-height: 85px;
+  overflow: auto;
+  /* overflow-y: auto; */
+  /* padding-bottom: 10px; */
+
+}
+
+.btnGroupDiv {
+  /* padding: 20px 00px 00px 20px; */
+  padding: 0.5rem;
+}
+
+.blue-text {
+  color: #2196f3 !important;
+}
+
+.grey-text {
+  color: #9e9e9e !important;
+}
+
+.z-depth-1,
+.chip:active {
+  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
+}
+
+.hftBackground {
+  background-image: url(../imgs/avatar/Bibliothek_HFT_f.jpg);
+  background-size: cover;
+}
+
+/* .hftBackground::after {
+  content: '';
+    z-index: 0;
+    position: absolute;
+    background: rgba(0, 0, 0, 0.65);
+    left: 0;
+    top: 0;
+} */
+
+main[role=main] {
+  background-color: #f8f9fa !important;
+  padding-bottom: 1rem !important;
+}
+
+a {
+  text-decoration: none;
+  display: inline-block;
+  padding: 8px 16px;
+}
+
+a:hover {
+  background-color: #ddd;
+  color: black;
+}
+
+.previous {
+  background-color: #cccccc;
+  color: #0f0f0f;
+
+  margin-left: 40%;
+  cursor: pointer;
+  border-radius: .2rem;
+  border: none;
+  border: 0px;
+  width: 6em;
+  height: 2em;
+
+}
+
+.previous:disabled,
+.previous[disabled] {
+  cursor: not-allowed;
+  background-color: #f1f1f1;
+  color: #666666;
+}
+
+.next:disabled,
+.next[disabled] {
+  background-color: #0069d970;
+  color: #666666;
+  cursor: not-allowed;
+}
+
+#papercount {
+  text-align: center;
+}
+
+.next {
+  /* background-color: #2196f3 !important; */
+  color: white;
+  cursor: pointer;
+  border-radius: .2rem;
+  color: #fff;
+  border: none;
+  border: 0px;
+  background-color: #0069d9;
+  width: 6em;
+  height: 2em;
+
+}
+
+.next:hover {
+  background-color: #005bbd !important;
+  border: none;
+  border: 0px;
+}
+
+.round {
+  border-radius: 50%;
+}
+
+.publication_card {
+  overflow: hidden;
+}
\ No newline at end of file
--- a/public/css/myCesiumStyle.css
+++ b/public/css/myCesiumStyle.css
+@charset "UTF-8";
+
+html,
+button,
+input,
+select,
+textarea {
+  font-family: sans-serif;
+}
+
+html {
+  margin: 0 auto;
+  max-width: 80%;
+}
+
+header,
+footer {
+  padding: 1em;
+  color: black;
+  background-color: White;
+  clear: left;
+  text-align: center;
+}
+footer {
+  padding-top: 0px;
+}
+
+.pagecesium {
+  height: 500px;
+  position: relative;
+  width: 100%;
+  min-width: 630px;
+}
+
+.pagepp {
+  float: left;
+  height: 100%;
+  width: 50%;
+}
+
+body {
+  min-width: 650px;
+  margin: 0px;
+}
+
+h2,
+h3 {
+  margin-block-start: 1px;
+  margin-block-end: 1px;
+}
+
+.titleFigure {
+  margin: 2px 0;
+  /* height: 20%; */
+  width: 12%;
+}
+
+.cesium-infoBox-visible {
+
+  
+    font-weight: 100;    
+    background-color: brown;
+    text-align: right;
+}
+
+.cesium-infoBox-iframe {
+    font-size: 0.5em;
+    font-weight: 100;    
+    background-color: brown;
+    text-align: left;
+  }
--- a/public/css/search.css
+++ b/public/css/search.css
+body {
+    background: #212129;
+ }
+ 
+
+ 
+ .search-wrapper {
+     position: absolute;
+     /* transform: translate(-50%, -50%); */
+     /* top:50%; */
+     /* left:50%; */
+     float: right;
+     /* margin-right: 60%; */
+     margin-bottom: 2em;
+ }
+ .search-wrapper.active {}
+ 
+ .search-wrapper .input-holder {
+     height: 70px;
+     width:70px;
+     overflow: hidden;
+     background: rgba(255,255,255,0);
+     border-radius:6px;
+     position: relative;
+     transition: all 0.3s ease-in-out;
+ }
+ .search-wrapper.active .input-holder {
+     width:450px;
+     border-radius: 50px;
+     background: rgba(0,0,0,0.5);
+     transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
+ }
+ .search-wrapper .input-holder .search-input {
+     width:100%;
+     height: 50px;
+     padding:0px 70px 0 20px;
+     opacity: 0;
+     position: absolute;
+     top:0px;
+     left:0px;
+     background: transparent;
+     box-sizing: border-box;
+     border:none;
+     outline:none;
+     font-family:"Open Sans", Arial, Verdana;
+     font-size: 16px;
+     font-weight: 400;
+     line-height: 20px;
+     color:#FFF;
+     transform: translate(0, 60px);
+     transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
+     transition-delay: 0.3s;
+ }
+ .search-wrapper.active .input-holder .search-input {
+     opacity: 1;
+     transform: translate(0, 10px);
+ }
+ .search-wrapper .input-holder .search-icon {
+     width:70px; 
+     height:70px;
+     border:none;
+     border-radius:6px;
+     background: #FFF;
+     padding:0px;
+     outline:none;
+     position: relative;
+     z-index: 2;
+     float:right;
+     cursor: pointer;
+     transition: all 0.3s ease-in-out;
+ }
+ .search-wrapper.active .input-holder .search-icon {
+     width: 50px;
+     height:50px;
+     margin: 10px;
+     border-radius: 30px;
+ }
+ .search-wrapper .input-holder .search-icon span {
+     width:22px;
+     height:22px;
+     display: inline-block;
+     vertical-align: middle;
+     position:relative;
+     transform: rotate(45deg);
+     transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
+ }
+ .search-wrapper.active .input-holder .search-icon span {
+     transform: rotate(-45deg);
+ }
+ .search-wrapper .input-holder .search-icon span::before, .search-wrapper .input-holder .search-icon span::after {
+     position: absolute; 
+     content:'';
+ }
+ .search-wrapper .input-holder .search-icon span::before {
+     width: 4px;
+     height: 11px;
+     left: 9px;
+     top: 18px;
+     border-radius: 2px;
+     background: #FE5F55;
+ }
+ .search-wrapper .input-holder .search-icon span::after {
+     width: 20px;
+     height: 20px;
+     left: 3px;
+     top: 0px;
+     border-radius: 16px;
+     border: 4px solid #FE5F55;
+ }
+ .search-wrapper .close {
+     position: absolute;
+     z-index: 1;
+     top:24px;
+     right:20px;
+     width:25px;
+     height:25px;
+     cursor: pointer;
+     transform: rotate(-180deg);
+     transition: all .3s cubic-bezier(0.285, -0.450, 0.935, 0.110);
+     transition-delay: 0.2s;
+ }
+ .search-wrapper.active .close {
+     right:-50px;
+     transform: rotate(45deg);
+     transition: all .6s cubic-bezier(0.000, 0.105, 0.035, 1.570);
+     transition-delay: 0.5s;
+ }
+ .search-wrapper .close::before, .search-wrapper .close::after {
+     position:absolute;
+     content:'';
+     background: #FE5F55;
+     border-radius: 2px;
+ }
+ .search-wrapper .close::before {
+     width: 5px;
+     height: 25px;
+     left: 10px;
+     top: 0px;
+ }
+ .search-wrapper .close::after {
+     width: 25px;
+     height: 5px;
+     left: 0px;
+     top: 10px;
+ }
+ 
+ .linesearch {
+    display: flex; /* equal height of the children */
+  }
+  ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
+    color: rgb(189, 189, 189);
+    opacity: 1; /* Firefox */
+  }
+  
+  :-ms-input-placeholder { /* Internet Explorer 10-11 */
+    color: rgb(189, 189, 189);
+  }
+  
+  ::-ms-input-placeholder { /* Microsoft Edge */
+    color: rgb(189, 189, 189);
+  }
\ No newline at end of file
--- a/public/css/switchButton.css
+++ b/public/css/switchButton.css
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 45px;
+  height: 19px;
+}
+
+.switch input { 
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 11px;
+  width: 11px;
+  left: 4px;
+  bottom: 4px;
+  background-color: white;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+input:checked + .slider {
+  background-color: #2196F3;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196F3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(26px);
+  -ms-transform: translateX(26px);
+  transform: translateX(26px);
+}
+
+/* Rounded sliders */
+.slider.round {
+  border-radius: 34px;
+}
+
+.slider.round:before {
+  border-radius: 50%;
+}
\ No newline at end of file