diff --git a/caimira/apps/static/css/style.css b/caimira/apps/static/css/style.css
index 4f5d97c1..fddd7503 100644
--- a/caimira/apps/static/css/style.css
+++ b/caimira/apps/static/css/style.css
@@ -179,6 +179,13 @@ body {
   height: 4em;
 }
 
+.submenu-division {
+  border-right: 3px white solid;
+  width: 25px; 
+  height: 30px;
+  margin-right: 10px;
+}
+
 /*===== FIXED BACKGROUND IMG =====*/
 
 .fixed-background {
@@ -223,7 +230,7 @@ footer img {
 
   .paragraph-title {
     text-align: left;
-    font-size: 2rem;
+    font-size: 1.5rem;
   }
 
   .split > * + * {
@@ -325,6 +332,9 @@ footer img {
   .h1-text {
     font-size: 1.5rem;
   }
+  .mobile-sub-section {
+    width: 100%!important;
+  }
 }
 
 /* Devices under 768px (md) */
diff --git a/caimira/apps/templates/base/index.html.j2 b/caimira/apps/templates/base/index.html.j2
index d9ab3be8..b7aa72cb 100644
--- a/caimira/apps/templates/base/index.html.j2
+++ b/caimira/apps/templates/base/index.html.j2
@@ -28,23 +28,41 @@
           </p>
           <br>
       </div>
+      <div id="apps_section" class="d-none">
+        <div class="d-flex flex-row" >
+          <div class="pr-3"><a href="{{ calculator_prefix }}" role="button" class="btn btn-lg btn-outline-primary"><div class="d-flex d-row"><i class="icon-calculator"></i><span class="pl-2">Calculator</div></a></div>
+          <br>
+          <div class="expert_app_button"><a href="/expert-app" role="button" class="btn btn-lg btn-outline-secondary"><div class="d-flex d-row"><i class="icon-expert"></i><span class="pl-2">Expert (beta)</div></a></div>
+        </div>
+        <br>
+      </div>
     </div>
     <div class="align-self-center">
       <img src="static/images/CAiMIRA_1_Vs3_Colour.jpg" class="caimira_home_image">
     </div>
   </div>
-  <br>
   
-  <div id="apps_section" class="d-none">
-    <div class="d-flex flex-row" >
-      <h2 class="paragraph-title pr-4 align-self-center">Apps:</h2>
-      <br>
-      <div class="pr-3"><a href="{{ calculator_prefix }}" role="button" class="btn btn-lg btn-outline-primary"><div class="d-flex d-row"><i class="icon-calculator"></i><span class="pl-2">Calculator</div></a></div>
-      <br>
-      <div class="expert_app_button"><a href="/expert-app" role="button" class="btn btn-lg btn-outline-secondary"><div class="d-flex d-row"><i class="icon-expert"></i><span class="pl-2">Expert (beta)</div></a></div>
+  <div class="d-flex justify-content-between">
+  <div class="split">
+    <div class="w-25 mobile-sub-section"><hr width="95%">
+      <div class="d-flex m-2 align-items-center"><i class="bi bi-window" style="font-size: 25px"></i><div><p class="paragraph-title ml-2">Applications</p></div></div>
+      <div class="m-2">CAiMIRA is composed of two applications, the <a href="{{ calculator_prefix }}">Calculator</a> and the <a href="/expert-app">Expert App</a>.</div>
+    </div>
+    <div class="w-25 mobile-sub-section"><hr width="95%">
+      <div class="d-flex m-2 align-items-center"><i class="bi bi-info-square-fill" style="font-size: 25px"></i><div><p class="paragraph-title ml-2">About</p></div></div>
+      <div class="m-2"><a href="/about">About</a> page for details on methodology, assumptions and limitations of CAiMIRA.</div>
+    </div>
+    <div class="w-25 mobile-sub-section"><hr width="95%">
+      <div class="d-flex m-2 align-items-center"><i class="bi bi-journal-text" style="font-size: 25px"></i><div><p class="paragraph-title ml-2">Documentation</p></div></div>
+      <div class="m-2">Documentation for CAiMIRA, available <a href="https://caimira.readthedocs.io/">here</a>.<br></div>
+    </div>
+    <div class="w-25 mobile-sub-section"><hr width="95%">
+      <div class="d-flex m-2 align-items-center"><i class="bi bi-git" style="font-size: 25px"></i><div><p class="paragraph-title ml-2">Git</p></div></div>
+      <div class="m-2">Official CAiMIRA GitLab <a href="https://gitlab.cern.ch/cara/caimira">repository</a>.<br></div>
     </div>
-    <hr width="95%">
   </div>
+  </div>
+  <br>
 
   {% block caimira_at_cern %}
   {% endblock caimira_at_cern %}
diff --git a/caimira/apps/templates/base/layout.html.j2 b/caimira/apps/templates/base/layout.html.j2
index e7ac6dea..bb5bc7b8 100644
--- a/caimira/apps/templates/base/layout.html.j2
+++ b/caimira/apps/templates/base/layout.html.j2
@@ -16,6 +16,7 @@
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
   <link rel="stylesheet" href="/static/css/style.css">
   <link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css">
   
 
   {% block extra_headers %}
@@ -41,9 +42,9 @@
               <a class="nav-link dropdown-toggle {{ "header-navbar nav-link active" if "calculator/" in active_page else "header-navbar nav-link" }}" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                 Apps
               </a>
-              <ul class="dropdown-menu dropwown-navbar-colors text-right" style="min-width: 12rem;" aria-labelledby="navbarDropdown">
+              <ul class="dropdown-menu dropwown-navbar-colors" style="min-width: 12rem;" aria-labelledby="navbarDropdown">
                 <li><a href="{{ calculator_prefix }}" class="{{ "header-navbar nav-link active" if "calculator/" == active_page else "header-navbar nav-link" }}">Calculator</a></li>
-                <li><a href="{{ calculator_prefix }}/user-guide" style="margin-left: 2rem" class="{{ "header-navbar nav-link active" if "user-guide" in active_page else "header-navbar nav-link" }}">User Guide</a></li>
+                <li><div class="d-flex"><span class="d-flex align-self-center submenu-division"></span><a href="{{ calculator_prefix }}/user-guide" class="{{ "header-navbar nav-link active" if "user-guide" in active_page else "header-navbar nav-link" }}">User Guide</a></div></li>
                 <li><a href="/expert-app" class="{{ "header-navbar nav-link active" if "/expert-app" == active_page else "header-navbar nav-link" }}">Expert app (beta)</a></li>
               </ul>
             </li>