diff --git a/src/App.js b/src/App.js
index ebb2c4b..ae2720c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -13,6 +13,7 @@ import { Tabs } from 'antd';
 import 'antd/lib/tabs/style/index.css';
 import 'antd/lib/input/style/index.css';
 import 'antd/lib/button/style/index.css';
+import 'antd/lib/steps/style/index.css';
 
 // import 'antd/dist/antd.css';
 
diff --git a/src/components/Nav.js b/src/components/Nav.js
index c72bac4..3280bdf 100644
--- a/src/components/Nav.js
+++ b/src/components/Nav.js
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { slide as Menu } from 'react-burger-menu'
+import { Button } from 'antd';
 
 const Nav = () => {
   const [isOpen, setIsOpen] = useState(false)
@@ -17,23 +18,33 @@ const Nav = () => {
             <img src={require('../images/status-network-logo.svg')} className='logo' alt="Status Logo"/>
           </a>
         </div >
-        <Menu right disableAutoFocus pageWrapId={ "nav" } outerContainerId={ "main" } isOpen={ isOpen } >
-          <a href="https://github.com/status-im/translate.status.im#how-to-help-translate" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
-            <FormattedMessage id="nav.how-to-contribute" defaultMessage="How to contribute" />
-          </a>
-          <a href="https://github.com/status-im/translate.status.im#contributors" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
-            <FormattedMessage id="nav.contributors" defaultMessage="Contributors" />
-          </a>
-          <a href="https://statusnetwork.com/" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
-              <FormattedMessage id="nav.aboutus" defaultMessage="About us" />
-          </a>
-          <a href="https://github.com/status-im" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
-              <FormattedMessage id="nav.github" defaultMessage="Github" />
-          </a>
-          <a href="https://our.status.im/" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
-              <FormattedMessage id="nav.blog" defaultMessage="Blog" />
-          </a>
-      </Menu>
+        <div className="nav-button-wrapper nav-desktop">
+          <Button className="nav-button nav-margin-right">
+            <a className="nav-link" href="https://github.com/status-im/translate.status.im#translate-status-into-your-language" target="_blank" rel="noopener noreferrer">How to contribute</a>
+          </Button>
+          <Button className="nav-button" type="primary">
+            <a className="nav-link" href="https://status.im/get/" target="_blank" rel="noopener noreferrer">Get Status</a>
+          </Button>
+        </div>
+        <div className="nav-mobile">
+          <Menu right disableAutoFocus pageWrapId={ "nav" } outerContainerId={ "main" } isOpen={ isOpen } >
+            <a href="https://github.com/status-im/translate.status.im#how-to-help-translate" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
+              <FormattedMessage id="nav.how-to-contribute" defaultMessage="How to contribute" />
+            </a>
+            <a href="https://github.com/status-im/translate.status.im#contributors" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
+              <FormattedMessage id="nav.contributors" defaultMessage="Contributors" />
+            </a>
+            <a href="https://statusnetwork.com/" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
+                <FormattedMessage id="nav.aboutus" defaultMessage="About us" />
+            </a>
+            <a href="https://github.com/status-im" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
+                <FormattedMessage id="nav.github" defaultMessage="Github" />
+            </a>
+            <a href="https://our.status.im/" target="_blank" rel="noopener noreferrer" onClick={closeNav}>
+                <FormattedMessage id="nav.blog" defaultMessage="Blog" />
+            </a>
+          </Menu>
+        </div>
     </nav>
   );
 }
diff --git a/src/components/Tutorial.js b/src/components/Tutorial.js
index 5a0a992..c5e2789 100644
--- a/src/components/Tutorial.js
+++ b/src/components/Tutorial.js
@@ -2,8 +2,6 @@ import React, { useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import ScrollableAnchor from 'react-scrollable-anchor'
 import { Steps, Button } from 'antd';
-import 'antd/lib/steps/style/index.css';
-import 'antd/lib/button/style/index.css';
 
 const { Step } = Steps;
 
diff --git a/src/index.css b/src/index.css
index 67e0345..a0248c4 100644
--- a/src/index.css
+++ b/src/index.css
@@ -83,6 +83,32 @@ p {
 
 /*------------- NAVIGATION BAR -------------------*/
 
+.nav-button-wrapper {
+  display: inline-block;
+  position: absolute;
+  top: 30px;
+  right: 50px;
+}
+
+.nav-mobile {
+  display: none;
+}
+
+.nav-margin-right {
+  margin-right: 25px;
+}
+
+.nav-button {
+  width: auto;
+  display: inline-block;
+  font-size: 18px !important;
+  height: auto !important;
+}
+
+.nav-link {
+  text-decoration: none !important;
+}
+
 .logo-container {
   margin: 20px;
 }
@@ -192,7 +218,6 @@ Note: Beware of modifying this element as it can break the animations - you shou
   margin: 20px;
   font-size: 20px !important;
   padding: 6px 20px;
-  width: 150px !important;
   height: 50px !important;
 }
 
@@ -412,10 +437,6 @@ main div p{
   margin-top: 24px;
 }
 
-.ant-btn {
-  width: 120px;
-}
-
  /*------------- countries -------------------*/
 
 div.languages {
@@ -703,6 +724,16 @@ footer ul {
   justify-content: center;
 }
 
+@media (max-width:700px) { 
+  .nav-mobile {
+    display: inline;
+  }
+
+  .nav-desktop {
+    display: none;
+  }
+}
+
 @media (max-width:499px) { 
   .ant-tabs-tab {
     font-size: 13px !important;