diff --git a/js/public/img/pics/Heidelberg_Altstadt_Schloss_Luftbild.jpg b/js/public/img/pics/Heidelberg_Altstadt_Schloss_Luftbild.jpg
new file mode 100644
index 000000000..28c5e1fd5
Binary files /dev/null and b/js/public/img/pics/Heidelberg_Altstadt_Schloss_Luftbild.jpg differ
diff --git a/js/public/img/pics/SOTM_2019_Group_Photo.jpg b/js/public/img/pics/SOTM_2019_Group_Photo.jpg
new file mode 100644
index 000000000..ae170f0f7
Binary files /dev/null and b/js/public/img/pics/SOTM_2019_Group_Photo.jpg differ
diff --git a/js/src/components/Footer.vue b/js/src/components/Footer.vue
index 43061ba6c..dc9167a59 100644
--- a/js/src/components/Footer.vue
+++ b/js/src/components/Footer.vue
@@ -1,9 +1,12 @@
 <template>
   <footer class="footer" ref="footer">
-<!--    <img :src="`/img/pics/footer_${random}.jpg`" alt="" />-->
-    <a href="https://openstreetmap.fr">
-    OpenStreetMap.fr
 
+    <!--    <img :src="`/img/pics/footer_${random}.jpg`" alt="" />-->
+    <a href="https://openstreetmap.fr">
+      <h1 class="title is-1">
+
+        OpenStreetMap.fr
+      </h1>
     </a>
     <ul>
       <li>
@@ -26,14 +29,14 @@
         <a slot="mobilizon" href="https://joinmobilizon.org">{{ $t("Mobilizon") }}</a>
         <span slot="date">{{ new Date().getFullYear() }}</span>
         <a href="https://joinmobilizon.org/hall-of-fame" slot="contributors">{{
-          $t("more than 1360 contributors")
-        }}</a>
+            $t("more than 1360 contributors")
+          }}</a>
       </i18n>
     </div>
   </footer>
 </template>
 <script lang="ts">
-import { Component, Vue } from "vue-property-decorator";
+import {Component, Vue} from "vue-property-decorator";
 import RouteName from "../router/name";
 
 @Component
@@ -80,6 +83,7 @@ footer.footer {
     li {
       display: inline-flex;
       margin: auto 5px;
+
       a {
         font-size: 1.1rem;
       }
diff --git a/js/src/views/Home.vue b/js/src/views/Home.vue
index be59db90d..bec8a56a7 100644
--- a/js/src/views/Home.vue
+++ b/js/src/views/Home.vue
@@ -54,7 +54,7 @@
     </div>
     <div id="picture" v-if="config && (!currentUser.id || !currentActor.id)">
       <div class="picture-container">
-        <img src="/img/pics/2020-10-06-mobilizon-illustration-A_homepage.jpg" alt="" />
+        <img src="/img/pics/Heidelberg_Altstadt_Schloss_Luftbild.JPG" alt="photo Heidelberg_Altstadt_Schloss_Luftbild" />
       </div>
       <div class="container section">
         <div class="columns">
@@ -168,6 +168,8 @@
         <b-message v-else type="is-danger">{{ $t("No events found") }}</b-message>
       </section>
     </div>
+    <img width="100%" src="/img/pics/SOTM_2019_Group_Photo.jpg" alt="photo Heidelberg_Altstadt_Schloss_Luftbild"/>
+
   </div>
 </template>
 
@@ -477,7 +479,7 @@ section.hero {
 
 #featured_events {
   padding: 1rem 0;
-  min-height: calc(100vh - 400px);
+  min-height: calc(50vh - 400px);
   z-index: 10;
 
   .title {