diff --git a/customize.dist/pages.js b/customize.dist/pages.js
index a3da6746b..18d5a0fd5 100644
--- a/customize.dist/pages.js
+++ b/customize.dist/pages.js
@@ -79,6 +79,69 @@ define([
         ];
     };
 
+    var footerCol = function (title, L, literal) {
+        return h('div.col', [
+            h('ul.list-unstyled', [
+                h('li.title', {
+                    'data-localization': title,
+                }, title? Msg[title]: literal )
+                ].concat(L.map(function (l) {
+                    return h('li', [ l ]);
+                }))
+            )
+        ]);
+    };
+
+    var footLink = function (ref, loc, text) {
+        var attrs =  {
+            href: ref,
+        };
+        if (!/^\//.test(ref)) {
+            attrs.target = '_blank';
+            attrs.rel = 'noopener noreferrer';
+        }
+        if (loc) {
+            attrs['data-localization'] =  loc;
+            text = Msg[loc];
+        }
+        return h('a', attrs, text);
+    };
+
+    var infopageFooter = function () {
+        return h('footer', [
+            h('div.container', [
+                h('div.row', [
+                    footerCol(null, [
+                        footLink('/about.html', 'about'),
+                        footLink('/terms.html', 'terms'),
+                        footLink('/privacy.html', 'privacy'),
+                    ], 'CryptPad'),
+                    footerCol('footer_applications', [
+                        footLink('/drive/', 'main_drive'),
+                        footLink('/pad/', 'main_richText'),
+                        footLink('/code/', 'main_code'),
+                        footLink('/slide/', 'main_slide'),
+                        footLink('/poll/', 'main_poll'),
+                        footLink('/whiteboard/', null, Msg.type.whiteboard)
+                    ]),
+                    footerCol('footer_aboutUs', [
+                        footLink('https://blog.cryptpad.fr', 'blog'),
+                        footLink('https://labs.xwiki.com', null, 'XWiki Labs'),
+                        footLink('http://www.xwiki.com', null, 'XWiki SAS'),
+                        footLink('https://www.open-paas.org', null, 'OpenPaaS')
+                    ]),
+                    footerCol('footer_contact', [
+                        footLink('https://riot.im/app/#/room/#cryptpad:matrix.org', null, 'Chat'),
+                        footLink('https://twitter.com/cryptpad', null, 'Twitter'),
+                        footLink('https://github.com/xwiki-labs/cryptpad', null, 'GitHub'),
+                        footLink('/contact.html', null, 'Email')
+                    ])
+                ])
+            ]),
+            h('div.cp-version-footer', "CryptPad v1.13.0 (Naiad)")
+        ]);
+    };
+
     Pages['/about.html'] = function () {
         return h('div#main_other', [
             h('center', [
@@ -129,9 +192,13 @@ define([
     };
 
     Pages['/contact.html'] = function () {
-        return h('div#main_other', [
-            h('center', h('h1', Msg.contact)),
-            setHTML(h('p'), Msg.main_about_p2)
+        return h('div#cp-main.cp-page-contact', [
+            infopageTopbar(),
+            h('div.container.cp-container', [
+                h('center', h('h1', Msg.contact)),
+                setHTML(h('p'), Msg.main_about_p2)
+            ]),
+            infopageFooter(),
         ]);
     };
 
diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less
index 26274ff1e..3ece30827 100644
--- a/customize.dist/src/less2/include/colortheme.less
+++ b/customize.dist/src/less2/include/colortheme.less
@@ -1,3 +1,8 @@
+@colortheme_link-color: #0275D8;
+@colortheme_link-color-visited: #005999;
+@colortheme_info-background: #fafafa;
+
+
 @colortheme_pad-bg: #1c4fa0;
 @colortheme_pad-color: #fff;
 
diff --git a/customize.dist/src/less2/include/infopages.less b/customize.dist/src/less2/include/infopages.less
index b7bce8f75..c5d09dabe 100644
--- a/customize.dist/src/less2/include/infopages.less
+++ b/customize.dist/src/less2/include/infopages.less
@@ -1,10 +1,17 @@
+@import (once) "./colortheme.less";
+
+@infopages_infobar-height: 64px;
+
 // Basic setup for info pages, this should be used at the global level
 .infopages_main () {
     min-height: 100vh;
-    background-color: #FAFAFA;
+    background-color: @colortheme_info-background;
 
     a {
-        color: #FFF;
+        color: @colortheme_link-color;
+        &:visited {
+            color: @colortheme_link-color-visited;
+        }
         //opacity: 0.8;
         //transition: opacity 0.2s;
     }
@@ -17,12 +24,16 @@
 	margin: 0;
 
 	font-size: 14px;
-	font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
+    font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
+
+    .cp-container {
+        padding-top: @infopages_infobar-height;
+    }
 };
 
 .infopages_link () {
     text-decoration: none;
-    color: #FFF;
+    color: #0275D8;
     cursor: pointer;
     display: inline-flex;
     &:hover {
@@ -33,6 +44,8 @@
 // Apply this to the top bar div
 .infopages_topbar () {
     .cp-topbar {
+        background: #fff;
+        z-index: 9001;
         position: fixed;
         top: 0;
 
@@ -43,7 +56,7 @@
 
         box-sizing: border-box;
         width: 100%;
-        height: 64px;
+        height: @infopages_infobar-height;
         padding-left: 0.5em;
         padding-right: 0.5em;
         vertical-align: middle;
diff --git a/customize.dist/src/less2/main.less b/customize.dist/src/less2/main.less
index 242e22fc2..05ee01c8b 100644
--- a/customize.dist/src/less2/main.less
+++ b/customize.dist/src/less2/main.less
@@ -2,4 +2,7 @@
 	font-family: Neuropolitical;
 	src: url(./customize/fonts/neuropolitical.ttf)
 }
-div#cp-main.cp-page-index { @import "./pages/page-index.less"; }
\ No newline at end of file
+div#cp-main.cp-page-index { @import "./pages/page-index.less"; }
+div#cp-main.cp-page-contact { @import "./pages/page-contact.less"; }
+div#cp-main.cp-page-login { @import "./pages/page-login.less"; }
+div#cp-main.cp-page-register { @import "./pages/page-register.less"; }
\ No newline at end of file
diff --git a/customize.dist/src/less2/pages/page-contact.less b/customize.dist/src/less2/pages/page-contact.less
new file mode 100644
index 000000000..6c7f0ac04
--- /dev/null
+++ b/customize.dist/src/less2/pages/page-contact.less
@@ -0,0 +1,4 @@
+@import (once) "../include/infopages.less";
+
+.infopages_main();
+.infopages_topbar();
diff --git a/customize.dist/src/less2/pages/page-index.less b/customize.dist/src/less2/pages/page-index.less
index 557712820..5f7750cde 100644
--- a/customize.dist/src/less2/pages/page-index.less
+++ b/customize.dist/src/less2/pages/page-index.less
@@ -1,5 +1,3 @@
-//@import (once) "./variables.less";
-
 @import (once) "../include/infopages.less";
 @import (once) "../include/colortheme.less";
 
@@ -7,6 +5,15 @@
 .infopages_main();
 .infopages_topbar();
 
+.cp-topbar {
+    background: transparent;
+    position: fixed;
+    a {
+        color: #fff;
+    }
+}
+
+
 @background_lighter: rgba(0,0,0,0.1);
 @background_darker: rgba(0,0,0,0.4);
 &#cp-main {
@@ -38,7 +45,7 @@
 		&:hover {
 			transform: scale(1.05);
 		}
-	} 
+	}
 }
 .cp-title {
     display: flex;
diff --git a/customize.dist/src/less2/pages/page-login.less b/customize.dist/src/less2/pages/page-login.less
new file mode 100644
index 000000000..e69de29bb
diff --git a/customize.dist/src/less2/pages/page-register.less b/customize.dist/src/less2/pages/page-register.less
new file mode 100644
index 000000000..e69de29bb
diff --git a/customize.dist/template.js b/customize.dist/template.js
index d9e6e1a7f..cf5adb46d 100644
--- a/customize.dist/template.js
+++ b/customize.dist/template.js
@@ -178,12 +178,7 @@ $(function () {
         'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
         '/bower_components/bootstrap/dist/js/bootstrap.min.js'
     ], function () {
-        if (pathname === '/') {
-            // TODO(cjd): This is a hack because the template system doesn't make it easy.
-            $body.append($main);
-            return;
-        }
-        $body.append($topbar).append($main).append($footer);
+        $body.append($main);
 
         if (/^\/user\//.test(pathname)) {
             require([ '/user/main.js'], function () {});