diff --git a/app/views/layouts/_branding.html.erb b/app/views/layouts/_branding.html.erb
index 846b598..62ec0d1 100644
--- a/app/views/layouts/_branding.html.erb
+++ b/app/views/layouts/_branding.html.erb
@@ -1,27 +1,26 @@
-<nav id="org-navbar" class="navbar navbar-default" role="navigation" style="">
+<nav id="org-navbar" class="navbar navbar-default" role="navigation">
   <div class="container-fluid">
     <!-- Brand and toggle get grouped for better mobile display -->
     <div class="navbar-header" >
-      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar2" aria-expanded="false">
+      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#org-navbar-menu" aria-expanded="false">
         <span class="sr-only">Toggle navigation</span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </button>
-      <a class="not_navbar-brand" href="#">
-
-        <div class="RRhome-logo img-responsive">
-          <% if user_signed_in? && !current_user.org.nil? && current_user.org.logo.present? %>
-            <%= link_to(image_tag(current_user.org.logo.thumb('100x100%').url, alt: current_user.org.name, height: "100", style: "padding-right:15px"), current_user.org.target_url) %>
-          <% end %>
-        </div>
-      </a>
+      <% if user_signed_in? && !current_user.org.nil? && current_user.org.logo.present? %>
+        <%= link_to(image_tag(current_user.org.logo.thumb('100x100%').url,
+                              alt: current_user.org.name,
+                              class: "org-logo",
+                              title: current_user.org.name),
+                    current_user.org.target_url) %>
+      <% end %>
     </div>
 
     <!-- Collect the nav links, forms, and other content for toggling -->
-    <div class="collapse navbar-collapse" id="navbar2">
+    <div class="collapse navbar-collapse" id="org-navbar-menu">
       <% if user_signed_in? && !current_user.org.nil? %>
-          <ul class="nav navbar-nav" style="line-height:100px; height:100px; padding-top:0">
+          <ul class="nav navbar-nav">
             <li>
               <a><%= current_user.org.name %></a>
             </li>
@@ -94,4 +93,3 @@
     </div><!-- /.navbar-collapse -->
   </div><!-- /.container-fluid -->
 </nav>
-
diff --git a/app/views/layouts/_footer.html.erb b/app/views/layouts/_footer.html.erb
index c302cfc..d9ebf63 100644
--- a/app/views/layouts/_footer.html.erb
+++ b/app/views/layouts/_footer.html.erb
@@ -1,5 +1,5 @@
 <!-- footer container -->
-<div id="footer-navbar" class="navbar navbar-inverse" role="navigation">
+<div id="footer-navbar" class="navbar-inverse" role="navigation">
   <div class="container-fluid">
     <ul class="nav navbar-nav">
       <li><%= link_to "&copy; 2004 - #{Time.now.year} #{Rails.configuration.branding[:organisation][:name]}".sanitize, "#{Rails.configuration.branding[:organisation][:url]}"%></li>
diff --git a/app/views/layouts/_navigation.html.erb b/app/views/layouts/_navigation.html.erb
index 0006037..7944147 100644
--- a/app/views/layouts/_navigation.html.erb
+++ b/app/views/layouts/_navigation.html.erb
@@ -1,26 +1,26 @@
-<nav id="main-navbar" class="navbar navbar-inverse" role="navigation">
+<nav id="app-navbar" class="navbar navbar-inverse" role="navigation">
   <div class="container-fluid" >
     <!-- Brand and toggle get grouped for better mobile display -->
     <div class="navbar-header">
-      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
+      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-menu" aria-expanded="false">
         <span class="sr-only">Toggle navigation</span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </button>
-      <a class="not_navbar-brand" href="#">
-        <div class="RRhome-logo RRroadmap-logo img-responsive">
-          <%= link_to(image_tag("logo.png", alt: "#{Rails.configuration.branding[:application][:name]} #{_('logo')}", height: "50px", style: "padding-right:15px"), root_path, title: Rails.configuration.branding[:application][:name]) %>
-        </div>
-      </a>
+      <%= link_to(image_tag("logo.png",
+                            alt: "#{Rails.configuration.branding[:application][:name]} #{_('logo')}",
+                            class: "app-logo",
+                            title: Rails.configuration.branding[:application][:name]),
+                  root_path) %>
     </div>
 
     <!-- Collect the nav links, forms, and other content for toggling -->
-    <div class="collapse navbar-collapse" id="navbar">
+    <div class="collapse navbar-collapse" id="app-navbar-menu">
       <ul class="nav navbar-nav">
         <% if user_signed_in? %>
           <li class="<%= ' active' if isActivePage(root_path) %>">
-            <%= link_to _('Dashboard'), plans_path %>
+            <%= link_to _('My Dashboard'), plans_path %>
           </li>
           <li <%= 'class=active' if isActivePage(new_plan_path) %>>
             <%= link_to _('Create plans'), new_plan_path %>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 7c33b7d..7cb9508 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -1,6 +1,5 @@
 <!DOCTYPE html>
-<html lang="<%= FastGettext.locale %>"   style="position: relative;
-  min-height: 100%; ">
+<html lang="<%= FastGettext.locale %>">
   <head>
     <title>
       <%= _('%{application_name}') % { :application_name => Rails.configuration.branding[:application][:name] } %>
@@ -52,11 +51,11 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 
   </head>
-  <body style="margin-bottom:75px;">
+  <body>
     <!--p class="alert alert-danger">The DMPRoadmap service will be down from 1600 BST (UTC+1) on Friday, 15th May 2015 to allow essential updates.  Please ensure you have saved your data and logged out before this time to avoid any problems.  We will be back again as soon as possible on Friday evening.</p-->
       <!--p class="alert alert-success">Our essential updates have been completed, and DMPRoadmap is up and running again. Many thanks for your patience.</p -->
 
-      <!-- header renedering -->
+      <!-- header rendering -->
       <header>
         <%= render partial: "layouts/header" %>
       </header>
@@ -66,10 +65,12 @@
       has_notice = (notice || flash[:notice])
       %>
 
-      <main class="container" style="<% if !user_signed_in? or current_user.org.nil? %>padding-top:75px;<% end %>">
+      <!-- main page content rendering -->
+      <main class="container">
         <div id="notification-area"
-             class="roadmap-<%= has_alert ? 'alert' : 'info' %>-box"
-             style="visibility: <%= (has_alert || has_notice) ? 'visible' : 'hidden' %>;"<%= (has_notice ? ' role=status' : (has_alert ? ' role=alert' : '')) %>>
+             class="<%= has_alert ? 'alert-warning ' : 'alert-info ' %>
+                    <%= (has_alert or has_notice) ? 'alert show' : 'hide' %>"
+             role="<%= (has_notice ? 'status' : (has_alert ? 'alert' : '')) %>">
           <i class="fa <%= has_alert ? ' fa-times-circle' : ' fa-check-circle' %>" aria-hidden="true"></i>
           <span class="aria-only"><%= has_alert ? _('Error:') : _('Notice:') %></span>
           <span><%= raw (has_alert ? alert : notice) %></span>
diff --git a/app/views/shared/_register_form.html.erb b/app/views/shared/_register_form.html.erb
index fc26824..ce4aa1e 100644
--- a/app/views/shared/_register_form.html.erb
+++ b/app/views/shared/_register_form.html.erb
@@ -36,7 +36,7 @@
         <a href="#"><%= _("My organisation isn't listed.") %></a>
       </div>
       <% other_organisations = Org.where("parent_id IS ? AND is_other = ?", nil, true).pluck(:id) %>
-      <div id="other-org-name" class="form-input" style="display:none" data-orgs="<%= other_organisations.join(',') %>">
+      <div id="other-org-name" class="form-input hide" data-orgs="<%= other_organisations.join(',') %>">
         <%= f.label _('Organisation Name'), for: :other_organisation %>
         <%= f.text_field :other_organisation, :autocomplete => "off", :class => 'left-indent has-tooltip', 'data-toggle' => "tooltip", 'data-container' => "body", 'title' => _('Please enter the name of your organisation.') %>
       </div>
diff --git a/lib/assets/stylesheets/dmproadmap.scss b/lib/assets/stylesheets/dmproadmap.scss
index e93ebeb..5b2909c 100644
--- a/lib/assets/stylesheets/dmproadmap.scss
+++ b/lib/assets/stylesheets/dmproadmap.scss
@@ -1,18 +1,38 @@
-/**** font configuration ****/
+/**** Main layout configuration ****/
 
+/* For sticky footer */
+main {
+  margin-bottom: 100px;
+  @media (max-width: 768px) {
+    margin-bottom: 420px;
+  }
+  @media (min-width: 768px) and (max-width: 1000px) {
+    margin-bottom: 200px;
+  }
+}
+
+
+html {
+  position: relative;
+  min-height: 100%;
+}
+
+
+/**** font configuration ****/
+/*
 @font-face {
   font-family: 'GillSansLight';
   src: font-url('GillSansLight.ttf') format('truetype');
   font-weight: normal;
 }
 
-/*
 $black: #000;
 $white: #FFF;
 $highlight-color: $black;
 $highlight-background-color: #F36F24;
 */
 
+
 /* MESSAGES */
 /*
 $error-color: $white;
@@ -25,12 +45,14 @@
 $tooltip-background: #333;
 */
 
+
 /* BUTTONS */
 /*
 $disabled-button-color: #808080;
 $cancel-button-color: #F17D04;
 */
 
+
 /* HEADER STYLING */
 /*
 $header-height: 165px;
@@ -40,25 +62,22 @@
 $header-background: linear-gradient(#ED6406, #F59503);
 */
 
-#main-navbar {
+#app-navbar {
   border-radius: 0px;
-  height: 50px;
 }
 
+/* For org navbar custom height */
 #org-navbar {
   border-radius: 0px;
   margin-top: -20px;
-  height: 100px;
 }
-
 @media (min-width: 768px) {
-  #navbar2 .navbar-nav li a {
-    line-height: 100px;
-    height: 100px;
+  #org-navbar .navbar-nav li a {
+    line-height: 102px;
+    height: 102px;
     padding-top: 0;
   }
 }
-
 @media (min-width: 768px) {
   #admin-dropdown ul li a, #super-admin-dropdown ul li a {
     line-height: 26px !important;
@@ -67,6 +86,7 @@
   }
 }
 
+/* For dark (inverse) navbars */
 .inverse-dropdown {
   background-color: #222 !important;
   border-color: #080808 !important;
@@ -83,20 +103,27 @@
   }
 }
 
-/* FOOTER STYLING */
-  #footer-navbar {
-    margin-bottom: 0px;
-    position: absolute;
-    bottom: 0;
-    width: 100%;
-    border-radius:0px;
-    ul {
-      padding-right:15px;
-    }
-  }
+/* HEADER LOGOS */
+.app-logo {
+  height: 50px;
+  padding-right:15px;
+}
+.org-logo {
+  height: 100px;
+  padding-right:15px;
+}
 
-/* HEADER LOGO POSITIONING */
-/*
-$header-logo-top-margin: 20px;
-$header-logo-left-margin: 10px;
-*/
+
+/* FOOTER STYLING */
+
+/* For sticky footer */
+#footer-navbar {
+  margin-bottom: 0px;
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  border-radius:0px;
+  ul {
+    padding-right:15px;
+  }
+}