diff --git a/media/css/layout.css b/media/css/layout.css
index b9fb57f..f824ffa 100644
--- a/media/css/layout.css
+++ b/media/css/layout.css
@@ -79,6 +79,48 @@ nav#nav_home li {
 
 }
 
+nav#nav_mobile ul {
+
+    list-style-type: none;
+    padding:0px;
+    margin:0px;
+    width:100%;
+
+}
+
+nav#nav_mobile li {
+
+    display:block;
+    color: #fff;
+
+}
+
+nav#nav_mobile li a{
+
+    display:block;
+    width:100%;
+    background:#6e84ff;
+    color: #fff;
+    padding:5px 10px;
+    border: solid  #fbfbfb;
+    border-width: 1px 0px 0px 0px;
+
+}
+
+nav#nav_mobile li a:active{
+
+    background:#7f95ff;
+
+}
+
+nav#nav_mobile li a i{
+
+    display:inline-block;
+    width:20px;
+    text-align:center;
+
+}
+
 .header_nav {
 
     background: #253062;
@@ -162,6 +204,12 @@ nav#nav_home a:hover {
 
 }
 
+#logo {
+
+    position:relative;
+
+}
+
 #logo img {
 
     width:250px;
@@ -315,3 +363,74 @@ a.button {
 
 }
 
+#nav_home_mobile {
+
+    display:none;
+
+}
+
+/*Layout*/
+
+@media only screen and (max-width: 1040px) {
+
+    nav#nav_home {
+    
+        display: none;
+    
+    }
+    
+    .container {
+    
+        width:100%;
+        max-width:100%;
+        min-width:100%;
+    
+    }
+    
+    #nav_home_mobile {
+    
+        display:inline-block;
+        position:absolute;
+        /*width:50px;*/
+        /*border: solid #f00 1px;*/
+        right:5px;
+        /*right:50px;*/
+    
+    }
+    
+    #nav_home_mobile a {
+    
+        color: #fff;
+        display:block;
+        font-size: 32px;
+    
+    }
+    
+    .column_50 {
+    
+    
+        width:100%;
+        margin-top:15px;
+    
+    }
+    
+    .logo {
+    
+        /*width:200px;
+        position:absolute;
+        top:0px;
+        left:0px;
+        z-index:20;
+        clear:both;*/
+        width:100%;
+    
+    }
+    
+    #menu_big {
+    
+        display:none;
+    
+    }
+
+}
+
diff --git a/templates/about.phtml b/templates/about.phtml
index 903ff95..ccc5654 100644
--- a/templates/about.phtml
+++ b/templates/about.phtml
@@ -2,10 +2,10 @@
 <%block name="content">
 <div align="center" style="padding-top:40px;min-height:90vh;">
 <img src="${make_media_url('images/logo.png', 'cuchulublog')}" />
-<h1>About</h1>
+<h1>${lang('cuchulublog', 'about', 'About')}</h1>
 <section>
 <p><strong>Antonio de la Rosa Caballero</strong></p>
-<p style="max-width:500px;">${lang('cuchulublog', 'geek_enthusiast_linux_user', 'Geek enthusiast. Linux user, <strong>Debian user, Archlinux user, Gentoo user, Fedora user</strong>. <strong>Free software supporter</strong>. Specialized in <strong>Linux</strong> sysadmin, backend, and frontend')}.</p>
+<p style="max-width:500px;">${lang('cuchulublog', 'geek_enthusiast_linux_user', 'Geek enthusiast. Linux user, <strong>Debian user, Archlinux user, Gentoo user, Fedora user</strong>. <strong>Free software supporter</strong>. Specialized in <strong>Linux</strong> sysadmin, backend, and frontend')|n}.</p>
 
 <h2>${lang('cuchulublog', 'projects', 'Projects')}</h2>
     
diff --git a/templates/home.phtml b/templates/home.phtml
index ae43300..cda39cd 100644
--- a/templates/home.phtml
+++ b/templates/home.phtml
@@ -26,12 +26,15 @@
     </div>
     <div class="container-top">
         <div class="container" style="background: #fbfbfb;border: solid #cbcbcb;border-width: 0px 1px;">
-        <div class="column_left logo">
+            <div class="column_left logo">
                 <div class="center_flex" style="height:50px;font-size:24px;font-family:Open Sans;background: #253062;color: #fff;">
                     Cuchulu.com
+                    <div id="nav_home_mobile">
+                        <a href="#" id="nav_button"><i class="fa fa-bars" aria-hidden="true"></i></a>
+                    </div>
                 </div>
             </div>
-            <div class="column_content">
+            <div class="column_content" id="menu_big">
                 <div class="right_flex header_nav">
                 <nav id="nav_home">
                     <ul>
@@ -54,6 +57,25 @@
                 </nav>
                 </div>
             </div>
+        <nav id="nav_mobile" style="display:none;">
+            <ul>
+                <li>
+                    <a href="${url_for('.cuchulublog_home')}"><i class="fa fa-home" aria-hidden="true"></i>&nbsp;&nbsp; ${lang('cuchulublog', 'home', 'Home')}</a>
+                </li>
+                <li>
+                    <a href="${url_for('.cuchulublog_projects')}"><i class="fa fa-globe" aria-hidden="true"></i>&nbsp;&nbsp; ${lang('cuchulublog', 'projects', 'Projects')}</a>
+                </li>
+                <li>
+                    <a href="${url_for('.cuchulublog_all_posts')}"><i class="fa fa-comments" aria-hidden="true"></i>&nbsp;&nbsp; ${lang('cuchulublog', 'blog', 'Blog')}</a>
+                </li>
+                <li>
+                    <a href="${url_for('.cuchulublog_contact')}"><i class="fa fa-envelope-o" aria-hidden="true"></i>&nbsp;&nbsp; ${lang('cuchulublog', 'contact', 'Contact')}</a>
+                </li>
+                <li>
+                    <a href="${url_for('.cuchulublog_about')}"><i class="fa fa-info" aria-hidden="true"></i>&nbsp;&nbsp; ${lang('cuchulublog', 'about', 'About')}</a>
+                </li>
+            </ul>
+        </nav>
         <div id="content_home">
     <%block name="content">
             
@@ -103,6 +125,24 @@
         </div>
     </div>
     <script language="Javascript" src="${make_media_url('js/jquery.min.js', 'admin')}"></script>
+    <script>
+        $('a#nav_button').click(function () {
+        
+            if($('#nav_mobile').css('display')=='none') {
+                
+               $('#nav_mobile').show(); 
+                
+            }
+            else {
+                
+                $('#nav_mobile').hide();
+                
+            }
+        
+            return false;
+        
+        });
+    </script>
     <%block name="js_footer">
     <script>