Work on responsive part and fixes

website/dist/index.html

@@ -46,14 +46,14 @@
         <div class="container-lg section">
             <div class="over-image">
                 <div class="row">
-                    <div class="col-6 col-md-6 my-3 my-md-0">
+                    <div class="col-10 col-md-6">
                         <div class="logo">
                             <img src="static/images/logo.png">
                         </div>
                     </div>
-                    <div class="col-6 col-md-6 my-3 my-md-0">
+                    <div class="col-2 col-md-6">
                         <div class="social-links">
-                            Share your experience
+                            <span class="share-title">Share your experience</span>
                             <a href="https://www.facebook.com/sharer/sharer.php?u=https://workadventu.re/" target="_BLANK">
                                 <img class="social-image" src="static/images/facebook.png" />
                             </a>
@@ -70,7 +70,7 @@
                     <h1>Your workplace<br/>but better</h1>
                     <h3>You are impatient to discover this new world? Click on "Play online" and meet new people or share this adventure with your colleagues and friends by clicking on "Private mode"</h3>
                 </div>
-                <div class="row justify-content-md-center pt-5" style="margin-top: 65px;">
+                <div class="row justify-content-md-center pt-5">
                     <div class="col col-lg-3">
                         <a class="custom-link play" target="_BLANK" onclick="startGame()" title="PLAY ONLINE">
                             PLAY ONLINE
@@ -92,6 +92,11 @@
         </div>
     </header>
     <div class="section bg-white how-to">
+        <div class="desktop-only text-center d-block d-md-none d-lg-none d-xl-none">
+            <img src="static/images/desktop.png" width="64" /><br />
+            Well, it's not mobile friendly yet. Try with your desktop computer.
+        </div>
+
         <div class="container-fluid container-lg">
             <div class="row justify-content-md-center">
                 <div class="col-12 col-md-12 text-center">
@@ -180,10 +185,10 @@
     <div class="bg-white footer">
         <div class="container-fluid container-lg">
             <div class="row">
-                <div class="col-6 col-md-6 my-3 my-md-0">
+                <div class="col-12 col-md-6  my-3 my-md-0">
                     <a href="https://www.thecodingmachine.com/" target="_blank"><img src="static/images/Logo TCM.png"></a>
                 </div>
-                <div class="col-6 col-md-6 my-3 my-md-0 floppy">
+                <div class="col-12 col-md-6 my-3 my-md-0 floppy">
                     <img src="static/images/floppy.png" />
                     <div>Soon available on floppy !<br/><span>otherwise, available on <a href="https://github.com/thecodingmachine/workadventure" target="_BLANK">GitHub</a></span></div>
                 </div>