diff --git a/src/App.vue b/src/App.vue
index 47e13a4e..1b0eee5e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,7 +5,7 @@
       <v-container v-else class="full-height-content">
         <router-view></router-view>
       </v-container>
-      <Foot :class="{'tall-footer': customLayout}"></Foot>
+      <Foot :class="['padding-footer', { 'tall-footer': customLayout }]"></Foot>
       <Interval
         v-if="this.$store.getters.isLoggedIn && !this.$store.getters.currentUser.verified"
         :callback="checkVerified"
@@ -45,10 +45,12 @@ export default {
 /* https://brizzo.net/tips/hide-recaptcha-v3-badge/ */
 .grecaptcha-badge { opacity:0;}
 
-  .full-height-content {
-    height: 100%
-  }
-
+.full-height-content {
+  height: 100%
+}
+.padding-footer.footer {
+  margin-top: 56px;
+}
 .tall-footer.footer {
   height: 100%;
 }
diff --git a/src/components/Layout/Foot.vue b/src/components/Layout/Foot.vue
index df1ffef6..73691815 100644
--- a/src/components/Layout/Foot.vue
+++ b/src/components/Layout/Foot.vue
@@ -1,44 +1,81 @@
 <template>
-  <footer data-test-id="footer" class="footer">
-  <v-footer color="primary lighten-1">
-    <v-container>
-      <ul class="footer-list">
-          <li><a target="_blank" rel="noopener noreferrer" href="https://wikiba.se/about-us/">About</a></li>
-          <li><router-link to="/discovery">Discovery</router-link></li>
-          <li><a target="_blank" rel="noopener noreferrer" href="https://www.mediawiki.org/wiki/Wikibase/Wikibase.cloud">Documentation</a></li>
-          <li><a target="_blank" rel="noopener noreferrer" href="https://status.wikibase.cloud">Platform Status</a></li>
-          <li><a target="_blank" rel="noopener noreferrer" href="https://github.com/wbstack">Github</a></li>
-          <li><router-link to="/privacy-policy">Privacy Policy</router-link></li>
-          <li><router-link to="/terms-of-use">Terms of Use</router-link></li>
-          <li><a target="_blank" rel="noopener noreferrer" href="https://www.wikimedia.de/impressum/">Imprint</a></li>
-          <li><router-link to="/contact">Contact</router-link></li>
-      </ul>
-    </v-container>
+  <v-footer data-test-id="footer" class="footer">
+    <v-row class="row-margin" no-gutters>
+      <v-col class="col-margin" ref="col1" cols="auto">
+        <nav aria-label="Wikibase Cloud links">
+          <h3 class="footer-list-title">Wikibase Cloud</h3>
+          <ul class="footer-list">
+            <li><a target="_blank" rel="noopener noreferrer" href="https://wikiba.se/about-us/">About</a></li>
+            <li><router-link to="/discovery">Discovery</router-link></li>
+            <li><a target="_blank" rel="noopener noreferrer" href="https://www.mediawiki.org/wiki/Wikibase/Wikibase.cloud">Documentation</a></li>
+            <li><a target="_blank" rel="noopener noreferrer" href="https://status.wikibase.cloud">Platform Status</a></li>
+            <li><a target="_blank" rel="noopener noreferrer" href="https://github.com/wbstack">GitHub</a></li>
+            <li><router-link to="/contact">Contact us</router-link></li>
+          </ul>
+        </nav>
+      </v-col>
+      <v-col ref="col2" cols="auto">
+        <nav aria-label="Legal links">
+          <h3 class="footer-list-title">Legal</h3>
+          <ul class="footer-list">
+            <li><router-link to="/privacy-policy">Privacy Policy</router-link></li>
+            <li><router-link to="/terms-of-use">Terms of Use</router-link></li>
+            <li><a target="_blank" rel="noopener noreferrer" href="https://www.wikimedia.de/impressum/">Imprint</a></li>
+            <li><router-link to="/complaint">Report illegal content</router-link></li>
+          </ul>
+        </nav>
+      </v-col>
+    </v-row>
   </v-footer>
-
-  </footer>
 </template>
 
 <script>
 export default {
-  name: 'Foot'
+  name: 'Footer'
 }
 </script>
 
 <style scoped>
-  ul.footer-list {
-    list-style: none;
-    padding-left: 0 !important;
-  }
-
-  ul.footer-list a,
-  .white-footer-links a{
-    color: white !important;
-  }
-  .footer {
-    height: auto;
+.footer-list {
+  list-style: none;
+  padding-left: 0;
+}
+.footer-list-title {
+  font-weight: bold;
+  color: white;
+  margin-bottom: 8px;
+}
+.footer-list li {
+  margin-bottom: 5px;
+}
+.footer-list a, .footer-list :deep(a) {
+  color: white !important;
+  text-decoration: none;
+  transition: text-decoration 0.2s, color 0.2s;
+}
+.footer-list a:hover, .footer-list :deep(a:hover) {
+  text-decoration: underline;
+  color: white !important;
+}
+.v-footer {
+  background-color: #0063BF !important;
+  padding: 0;
+}
+.row-margin {
+  margin: 48px !important;
+  display: flex;
+}
+.col-margin {
+  margin-right: 80px !important;
+}
+@media (max-width: 480px) {
+  .row-margin {
+    margin: 24px !important;
+    flex-direction: column !important;
   }
-  .v-footer, .container {
-    height: 100%;
+  .col-margin {
+    margin-right: 0 !important;
+    margin-bottom: 40px !important;
   }
+}
 </style>