diff --git a/templates/web/renater/index.html.tt2 b/templates/web/renater/index.html.tt2
index 75f39421296878164b0529619f4d57350aac6181..2271a06902f605b64bb49e46db737d98baf16575 100644
--- a/templates/web/renater/index.html.tt2
+++ b/templates/web/renater/index.html.tt2
@@ -92,10 +92,10 @@
 
         <footer>
             <article class="hide-for-small-only">
-                <p class="row">
-                    <span class="small-1 columns  text-left"><img src="/images/logo_renater_blanc.png"/></span>
-                    <span class="small-5 columns text-left">Réseau National de télécommunications <br/>pour la Technologie l’Enseignement et la Recherche.</span>
-                    <span class="small-5 columns text-right">
+                <p class="grid-x grid-margin-x">
+                    <span class="shrink cell text-left"><img src="/images/logo_renater_blanc.png"/></span>
+                    <span class="auto cell text-left">Réseau National de télécommunications <br/>pour la Technologie l’Enseignement et la Recherche.</span>
+                    <span class="auto cell text-right">
                         <a href="https://www.facebook.com/gip.renater" target="_blank">
                             <img src="/images/facebook.svg" alt="Facebook" data-options="disable_for_touch:true"/>
                         </a>
@@ -106,9 +106,9 @@
                 </p>
             </article>
             <aside>
-                <p class="row small-collapse medium-uncollapse">
-                    <span class="small-12 medium-5 columns text-left">&copy; RENATER 2018 - [% c.loc("All rights reserved") %]</span>
-                    <span class="small-12 medium-7 columns">
+                <p class="grid-x grid-margin-x">
+                    <span class="small-12 medium-5 cell text-left">&copy; RENATER - [% c.loc("All rights reserved") %]</span>
+                    <span class="small-12 medium-7 cell text-right">
                         <a href="#" data-open="legal_reveal" title="[% c.loc("Legal mentions") %]">[% c.loc("Legal mentions") %]</a> |
                         <a href="#" data-open="about_reveal" title="[% c.loc("About") %]">[% c.loc("About") %]</a> |
                         <a id="feedback" class="tip-top" data-tooltip="" data-options="disable_for_touch:true" data-trigger-class="none"
@@ -119,6 +119,7 @@
                 </p>
             </aside>
         </footer>
+
         <div class="reveal" id="about_reveal" data-reveal>
             <p class="text-center">[% app.name %] [% app.version %] - <a href="mailto:[% app.support_email %]">[% c.loc("contact us") %]</a></p>
         </div>