update

public/rgc_website/css/main.css

@@ -134,3 +134,16 @@ a.button {
   /* 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;
+}
\ No newline at end of file

public/rgc_website/index.html

@@ -19,7 +19,6 @@
         <div id="menu" class="navbar"></div>
     </div> -->
 
-  <div class="content">
   <!-- <h1 id='projectname'></h1> <!--Projektname kommt aus settings.js, hier nichts einfügen -->
 
   <!-- ÄNDERUNGEN NUR NACH DIESER ZEILE -->
@@ -47,8 +46,7 @@
       <div class="container d-flex justify-content-between">
         <a href="https://www.hft-stuttgart.de" class="navbar-brand d-flex align-items-center">
           <img src="https://www.hft-stuttgart.de/typo3conf/ext/hft_sitepackage/Resources/Public/img/HFT_logo.svg"
-              class="hftlogo" width="100px" alt="wind">
-            <i class="fas fa-wind"></i>
+            class="hftlogo" width="100px">
           <h1 id='projectname'></h1>
         </a>
         <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarHeader"
@@ -73,6 +71,9 @@
     <div class="album py-5 bg-light topDownPadding">
       <div class="container">
         <h2>Our Research Projects</h2>
+
+        <p class="grey-text w-responsive mx-auto mb-5">Research Short Introduction ....</p>
+
         <div class="row">
           <div class="col-lg-4">
             <div class="card mb-4 shadow-sm extension">
@@ -85,7 +86,8 @@
                   visualization of 3D grid and heatmap. Developed at hackathon event "Neue Wege für die Mobilität in
                   Augsburg". (24 hours time limited)
                   <br>
-                    <b><i class="fas fa-user"></i> Contact Person</b>: <a href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich">Joe
+                  <b><i class="fas fa-user"></i> Contact Person</b>: <a
+                    href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich">Joe
                     T.S.</a> <br>
                   <b><i class="fas fa-star"></i> Keywords</b>: CityGML, 3D GIS, GIS Analyst, Urban Analytics
                 <form action="iStoeckHM.html" class="form-signin" method="GET">
@@ -119,9 +121,11 @@
                   various parameters from sensor systems equipped on the E-bike sharing system in the study area of a
                   city of Stuttgart, Germany.
                   <br>
-                    <b><i class="fas fa-user"></i> Contact Person</b>: <a href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich">Joe
+                  <b><i class="fas fa-user"></i> Contact Person</b>: <a
+                    href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich">Joe
                     T.S.</a> <br>
-                    <b><i class="fas fa-star"></i> Keywords </b>: SensorThings API, CityGML, 3D GIS, GIS Analyst, Urban Analytics
+                  <b><i class="fas fa-star"></i> Keywords </b>: SensorThings API, CityGML, 3D GIS, GIS Analyst, Urban
+                  Analytics
 
                 </p>
                 <a href="https://www.forschung-fachhochschulen.de/massnahmen/fhimpuls/icity" target="_blank">
@@ -265,8 +269,118 @@
         </form>
       </div>
       </div> -->
+      <hr>
+      <div class="container">
+        <h2>Our amazing team</h2>
+        <!-- Section description -->
+        <p class="grey-text w-responsive mx-auto mb-5">Team Description ....</p>
+        <section class="team-section text-center my-5">
+
+          <!-- Grid row -->
+          <div class="row">
+
+            <!-- Grid column -->
+            <div class="col-lg-3 col-md-6 mb-lg-0 mb-5">
+              <div class="avatar mx-auto">
+                <img src="./imgs/avatar/volker.Coors.jpg" class="rounded-circle z-depth-1" width="150px">
+              </div>
+              <h5 class="font-weight-bold mt-4 mb-3">Prof. Dr. Volker Coors</h5>
+              <p class="text-uppercase blue-text"><strong>Lab Leader</strong></p>
+              <p class="grey-text">Profile Description....</p>
+              <ul class="list-unstyled mb-0">
+                <!-- Facebook -->
+                <a class="p-2 fa-lg fb-ic">
+                  <i class="fab fa-facebook-f blue-text"> </i>
+                </a>
+                <!-- Twitter -->
+                <a class="p-2 fa-lg tw-ic">
+                  <i class="fab fa-twitter blue-text"> </i>
+                </a>
+                <!-- Instagram -->
+                <a class="p-2 fa-lg ins-ic">
+                  <i class="fab fa-instagram blue-text"> </i>
+                </a>
+              </ul>
+            </div>
+            <!-- Grid column -->
+
+            <!-- Grid column -->
+            <div class="col-lg-3 col-md-6 mb-lg-0 mb-5">
+              <div class="avatar mx-auto">
+                <img src="./imgs/avatar/JoeSquare.jpg" class="rounded-circle z-depth-1" width="150px">
+              </div>
+              <h5 class="font-weight-bold mt-4 mb-3">Joe T. Santhanavanich</h5>
+              <p class="text-uppercase blue-text"><strong>Researcher</strong></p>
+              <p class="grey-text">Profile Description....</p>
+              <ul class="list-unstyled mb-0">
+                <!-- Facebook -->
+                <a class="p-2 fa-lg fb-ic">
+                  <i class="fab fa-facebook-f blue-text"> </i>
+                </a>
+                <!-- Instagram -->
+                <a class="p-2 fa-lg ins-ic">
+                  <i class="fab fa-instagram blue-text"> </i>
+                </a>
+              </ul>
+            </div>
+            <!-- Grid column -->
+
+
+            <!-- Grid column -->
+
+            <!-- Grid column -->
+            <div class="col-lg-3 col-md-6">
+              <div class="avatar mx-auto">
+                <img src="./imgs/avatar/rosanny.jpg" class="rounded-circle z-depth-1" width="150px">
+              </div>
+              <h5 class="font-weight-bold mt-4 mb-3">Rosanny S.</h5>
+              <p class="text-uppercase blue-text"><strong>Researcher</strong></p>
+              <p class="grey-text">Profile Description....</p>
+              <ul class="list-unstyled mb-0">
+                <!-- Facebook -->
+                <a class="p-2 fa-lg fb-ic">
+                  <i class="fab fa-facebook-f blue-text"> </i>
+                </a>
+                <!-- Github -->
+                <a class="p-2 fa-lg ins-ic">
+                  <i class="fab fa-github blue-text"> </i>
+                </a>
+              </ul>
+            </div>
+            <!-- Grid column -->
+            <!-- Grid column -->
+            <div class="col-lg-3 col-md-6 mb-md-0 mb-5">
+              <div class="avatar mx-auto">
+                <img src="./imgs/avatar/PatrickSquare.jpg" class="rounded-circle z-depth-1" width="150px">
+              </div>
+              <h5 class="font-weight-bold mt-4 mb-3">Patrick Wuerstle</h5>
+              <p class="text-uppercase blue-text"><strong>Researcher</strong></p>
+              <p class="grey-text">Profile Description....</p>
+              <ul class="list-unstyled mb-0">
+                <!-- Facebook -->
+                <a class="p-2 fa-lg fb-ic">
+                  <i class="fab fa-facebook-f blue-text"> </i>
+                </a>
+                <!-- Instagram -->
+                <a class="p-2 fa-lg ins-ic">
+                  <i class="fab fa-instagram blue-text"> </i>
+                </a>
+                <!-- Dribbble -->
+                <a class="p-2 fa-lg ins-ic">
+                  <i class="fab fa-dribbble blue-text"> </i>
+                </a>
+              </ul>
+            </div>
+          </div>
+          <!-- Grid row -->
+
+        </section>
+        <!-- Section: Team v.1 -->
+      </div>
 
   </main>
+  <!-- Section: Team v.1 -->
+
 
   <footer class="text-white">
     <div class="container">

public/rgc_website/style.css

@@ -43,3 +43,4 @@ body {
    padding-top:10px;
    padding-bottom: 10px;
 }
+