diff --git a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/Pages/_Layout.cshtml b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/Pages/_Layout.cshtml
index 4ef85543d..128798178 100644
--- a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/Pages/_Layout.cshtml
+++ b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/Pages/_Layout.cshtml
@@ -19,7 +19,7 @@
 </head>
 <body>
     <nav class="navbar navbar-inverse navbar-fixed-top">
-        <div class="container">
+        <div class="container-fluid">
             <div class="navbar-header">
                 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                     <span class="sr-only">Toggle navigation</span>
diff --git a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/wwwroot/css/site.css b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/wwwroot/css/site.css
index e89c7811c..37061850f 100644
--- a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/wwwroot/css/site.css
+++ b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap3/wwwroot/css/site.css
@@ -1,5 +1,6 @@
-﻿/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\ 
+﻿/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\
 for details on configuring this project to bundle and minify static web assets. */
+
 body {
     padding-top: 50px;
     padding-bottom: 20px;
diff --git a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/Pages/_Layout.cshtml b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/Pages/_Layout.cshtml
index 0123072b1..c07287574 100644
--- a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/Pages/_Layout.cshtml
+++ b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/Pages/_Layout.cshtml
@@ -19,8 +19,8 @@
 </head>
 <body>
     <header>
-        <nav class="navbar navbar-expand-sm navbar-light navbar-toggleable-sm bg-white border-bottom box-shadow mb-3">
-            <div class="container">
+        <nav class="navbar navbar-expand-sm navbar-toggleable-sm border-bottom box-shadow mb-3">
+            <div class="container-fluid">
                 <a class="navbar-brand" href="~/">@Model.ApplicationName</a>
                 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
                         aria-expanded="false" aria-label="Toggle navigation">
diff --git a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/wwwroot/css/site.css b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/wwwroot/css/site.css
index e1ca50bc9..b7251a0ec 100644
--- a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/wwwroot/css/site.css
+++ b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap4/wwwroot/css/site.css
@@ -1,23 +1,22 @@
 ﻿/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\
 for details on configuring this project to bundle and minify static web assets. */
 
-a.navbar-brand {
-  white-space: normal;
-  text-align: center;
-  word-break: break-all;
-}
-
-/* Sticky footer styles
--------------------------------------------------- */
 html {
   font-size: 14px;
 }
-@media (min-width: 768px) {
+
+@media (min-width: 576px) {
   html {
     font-size: 16px;
   }
 }
 
+a.navbar-brand {
+  white-space: normal;
+  text-align: center;
+  word-break: break-all;
+}
+
 .container {
   max-width: 960px;
 }
@@ -42,24 +41,27 @@ button.accept-policy {
   line-height: inherit;
 }
 
-/* Sticky footer styles
--------------------------------------------------- */
-html {
-  position: relative;
-  min-height: 100%;
+.header {
+  background-color: var(--bs-body-bg);
 }
 
-body {
-  /* Margin bottom by footer height */
-  margin-bottom: 60px;
-}
 .footer {
-  position: absolute;
-  bottom: 0;
-  width: 100%;
-  overflow: scroll;
+  background-color: var(--bs-body-bg);
   white-space: nowrap;
-  /* Set the fixed height of the footer here */
-  height: 60px;
-  line-height: 60px; /* Vertically center the text there */
+  line-height: 45px;
+}
+
+@media (min-width: 576px) {
+
+  body {
+    margin-bottom: 45px;
+  }
+
+  .footer {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    z-index: 9;
+  }
+
 }
diff --git a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/Pages/_Layout.cshtml b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/Pages/_Layout.cshtml
index d8c0ec068..dc46c94c2 100644
--- a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/Pages/_Layout.cshtml
+++ b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/Pages/_Layout.cshtml
@@ -28,9 +28,9 @@
     </environment>
 </head>
 <body>
-    <header>
-        <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
-            <div class="container">
+    <header class="header sticky-sm-top">
+        <nav class="navbar navbar-expand-sm navbar-toggleable-sm border-bottom box-shadow mb-3">
+            <div class="container-fluid">
                 <a class="navbar-brand" href="~/">@Model.ApplicationName</a>
                 <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" aria-controls="navbarSupportedContent"
                         aria-expanded="false" aria-label="Toggle navigation">
diff --git a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/wwwroot/css/site.css b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/wwwroot/css/site.css
index d18b278b6..ad62ee121 100644
--- a/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/wwwroot/css/site.css
+++ b/src/Scaffolding/VS.Web.CG.Mvc/Templates/Identity/Bootstrap5/wwwroot/css/site.css
@@ -1,6 +1,25 @@
 /* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\
 for details on configuring this project to bundle and minify static web assets. */
 
+html {
+  font-size: 14px;
+}
+
+@media (min-width: 576px) {
+  html {
+    font-size: 16px;
+  }
+}
+
+.btn-link.nav-link:focus {
+  outline: black auto 1px;
+}
+
+.form-control:focus {
+  border-color: #0077cc;
+  box-shadow: 0 0 0 0.2rem #0077cc;
+}
+
 a.navbar-brand {
   white-space: normal;
   text-align: center;
@@ -11,11 +30,6 @@ a {
   color: #0077cc;
 }
 
-.form-control:focus {
-    border-color: #0077cc;
-    box-shadow: 0 0 0 0.2rem #0077cc;
-}
-
 .btn-primary {
   color: #fff;
   background-color: #1b6ec2;
@@ -28,19 +42,6 @@ a {
   border-color: #1861ac;
 }
 
-.btn-link.nav-link:focus {
-  outline: black auto 1px;
-}
-
-html {
-  font-size: 14px;
-}
-@media (min-width: 768px) {
-  html {
-    font-size: 16px;
-  }
-}
-
 .container {
   max-width: 960px;
 }
@@ -65,19 +66,27 @@ button.accept-policy {
   line-height: inherit;
 }
 
-html {
-  position: relative;
-  min-height: 100%;
+.header {
+  background-color: var(--bs-body-bg);
 }
 
-body {
-  margin-bottom: 60px;
-}
 .footer {
-  position: absolute;
-  bottom: 0;
-  width: 100%;
-  overflow: scroll;
+  background-color: var(--bs-body-bg);
   white-space: nowrap;
-  line-height: 60px;
+  line-height: 45px;
+}
+
+@media (min-width: 576px) {
+
+  body {
+    margin-bottom: 45px;
+  }
+
+  .footer {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    z-index: 9;
+  }
+
 }
