diff --git a/src/Client/Components/App.razor b/src/Client/Components/App.razor
index 6dfc104..f48a9b7 100644
--- a/src/Client/Components/App.razor
+++ b/src/Client/Components/App.razor
@@ -33,7 +33,7 @@
     <meta name="DC.Type" content="text/html">
     <base href="/">
     <link rel="icon" href="/images/favicon.png" type="image/png">
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
     <link rel="stylesheet" href="css/fonts.css">
     <link rel="stylesheet" href="css/site.css">
     <link rel="stylesheet" href="css/mobile.css">
@@ -58,6 +58,6 @@
         <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)"/>
     </Found>
 </Router>
-<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
 </body>
 </html>
diff --git a/src/Client/Components/Banner.razor b/src/Client/Components/Banner.razor
index 6eb1182..fc0476c 100644
--- a/src/Client/Components/Banner.razor
+++ b/src/Client/Components/Banner.razor
@@ -1,6 +1,6 @@
 <div class="banner">
 	<Href href="@Href" NewWindow="@NewWindow">
-		<div class="row no-gutters text-center" style="padding: 1% 0">
+		<div class="row g-0 text-center" style="padding: 1% 0">
 			<div class="col desc">
                 <div class="sign rounded-pill special-link text-center" style="min-width:125px;max-width:200px;display:inline-block;margin:10px;">
                     <div style="padding: 4px 4px 0 4px;">@BannerTypeName</div>
diff --git a/src/Client/Components/DefaultAltFeature.razor b/src/Client/Components/DefaultAltFeature.razor
index 67123f6..a9a640e 100644
--- a/src/Client/Components/DefaultAltFeature.razor
+++ b/src/Client/Components/DefaultAltFeature.razor
@@ -1,4 +1,4 @@
-<div class="row component-feature no-gutters">
+<div class="row component-feature g-0">
     <div class="col-6">
         <div class="component-feature-title">@Feature.Title</div>
         <div class="component-feature-desc">@Feature.Description</div>
diff --git a/src/Client/Components/DefaultFeature.razor b/src/Client/Components/DefaultFeature.razor
index 39542cb..4131ee8 100644
--- a/src/Client/Components/DefaultFeature.razor
+++ b/src/Client/Components/DefaultFeature.razor
@@ -1,4 +1,4 @@
-<div class="row component-feature no-gutters">
+<div class="row component-feature g-0">
     <div class="col-6 text-center">
         <div class="component-feature-img">
             <img class="img-fluid" src="@Feature.Img" alt="@Feature.Title"/>
diff --git a/src/Client/Components/Href.razor b/src/Client/Components/Href.razor
index c80a7d9..33b1400 100644
--- a/src/Client/Components/Href.razor
+++ b/src/Client/Components/Href.razor
@@ -1,5 +1,5 @@
 
-<NavLink class="@(Class + " nav-link" + (AsButton ? " border border-dark font-weight-bold btn btn-default border-black p-3" : ""))"
+<NavLink class="@(Class + (AsButton ? " border border-dark font-weight-bold btn btn-default border-black p-3" : ""))"
          target="@(NewWindow ? "_blank" : "")" role="@(AsButton ? "button" : "")" @attributes="AdditionalAttributes">@ChildContent</NavLink>
 
 @code
diff --git a/src/Client/Components/Layout/SiteFooter.razor b/src/Client/Components/Layout/SiteFooter.razor
index 9e06d76..32efa59 100644
--- a/src/Client/Components/Layout/SiteFooter.razor
+++ b/src/Client/Components/Layout/SiteFooter.razor
@@ -31,41 +31,41 @@
                 </div>
                 <div class="col" id="footer-why-col">
                     <div class="pb-2 font-weight-bold">Why Steeltoe</div>
-                    <div><Href href="/why-steeltoe">Overview</Href></div>
-                    <div><Href href="/microservices">Microservices</Href></div>
-                    <div><Href href="/cloud">Cloud</Href></div>
-                    <div><Href href="/web-applications">Web Applications</Href></div>
-                    <div><Href href="/event-driven">Event Driven</Href></div>
+                    <div><Href Class="link-light" href="/why-steeltoe">Overview</Href></div>
+                    <div><Href Class="link-light" href="/microservices">Microservices</Href></div>
+                    <div><Href Class="link-light" href="/cloud">Cloud</Href></div>
+                    <div><Href Class="link-light" href="/web-applications">Web Applications</Href></div>
+                    <div><Href Class="link-light" href="/event-driven">Event Driven</Href></div>
                 </div>
                 <div class="col" id="footer-learn-col">
                     <div class="pb-2 font-weight-bold">Learn</div>
-                    <div><Href href="/initializr" NewWindow="true">Steeltoe Initializr</Href></div>
-                    <div><Href href="@(DocsSiteOptions.Value.GuidesHome)">Guides</Href></div>
-                    <div><Href href="@(DocsSiteOptions.Value.DocsHome)">Documentation</Href></div>
-                    <div><Href href="@(DocsSiteOptions.Value.ApiBrowserHome)">API Browser</Href></div>
-                    <div><Href href="@(DocsSiteOptions.Value.BlogHome)">Blog</Href></div>
+                    <div><Href Class="link-light" href="/initializr" NewWindow="true">Steeltoe Initializr</Href></div>
+                    <div><Href Class="link-light" href="@(DocsSiteOptions.Value.GuidesHome)">Guides</Href></div>
+                    <div><Href Class="link-light" href="@(DocsSiteOptions.Value.DocsHome)">Documentation</Href></div>
+                    <div><Href Class="link-light" href="@(DocsSiteOptions.Value.ApiBrowserHome)">API Browser</Href></div>
+                    <div><Href Class="link-light" href="@(DocsSiteOptions.Value.BlogHome)">Blog</Href></div>
                 </div>
                 <div class="col" id="footer-projects-col">
                     <div class="pb-2 font-weight-bold">Projects</div>
-                    <div><Href href="/app-configuration">Application Configuration</Href></div>
-                    <div><Href href="/circuit-breakers">Circuit Breakers</Href></div>
-                    <div><Href href="/logging">Dynamic Logging</Href></div>
-                    <div><Href href="/cloud-management">Management</Href></div>
-                    <div><Href href="/messaging">Messaging</Href></div>
-                    <div><Href href="@(DocsSiteOptions.Value.FileShareHome)">Network File Sharing</Href></div>
-                    <div><Href href="/security-providers">Security</Href></div>
-                    <div><Href href="/service-connectors">Service Connectors</Href></div>
-                    <div><Href href="/service-discovery">Service Discovery</Href></div>
-                    <div><Href href="@(DocsSiteOptions.Value.DocsStreamHome)">Stream</Href></div>
+                    <div><Href Class="link-light" href="/app-configuration">Application Configuration</Href></div>
+                    <div><Href Class="link-light" href="/circuit-breakers">Circuit Breakers</Href></div>
+                    <div><Href Class="link-light" href="/logging">Dynamic Logging</Href></div>
+                    <div><Href Class="link-light" href="/cloud-management">Management</Href></div>
+                    <div><Href Class="link-light" href="/messaging">Messaging</Href></div>
+                    <div><Href Class="link-light" href="@(DocsSiteOptions.Value.FileShareHome)">Network File Sharing</Href></div>
+                    <div><Href Class="link-light" href="/security-providers">Security</Href></div>
+                    <div><Href Class="link-light" href="/service-connectors">Service Connectors</Href></div>
+                    <div><Href Class="link-light" href="/service-discovery">Service Discovery</Href></div>
+                    <div><Href Class="link-light" href="@(DocsSiteOptions.Value.DocsStreamHome)">Stream</Href></div>
                 </div>
                 <div class="col" id="footer-others-col">
                     @*<div class="pb-2 font-weight-bold"><Href href="/training">Training</Href></div>*@
-                    <div class="pb-2 font-weight-bold"><Href href="/support">Support</Href></div>
-                    <div class="pb-2 font-weight-bold"><Href href="/community">Community</Href></div>
+                    <div class="pb-2 font-weight-bold"><Href Class="link-light" href="/support">Support</Href></div>
+                    <div class="pb-2 font-weight-bold"><Href Class="link-light" href="/community">Community</Href></div>
                 </div>
             </div>
             <div class="row py-sm-0 py-4">
-                <div class="col text-right">
+                <div class="col text-end">
                     <Href href="https://github.com/SteeltoeOSS" title="Steeltoe on GitHub" NewWindow="true">
                         <svg id="github-icon" width="100px" height="50px" viewBox="0 0 1 75" xmlns="http://www.w3.org/2000/svg">
                             <defs>
@@ -94,13 +94,13 @@
                     </Href>
                 </div>
             </div>
-            <div class="row align-items-center no-gutters pt-0">
-                <div class="col text-center my-2 small text-muted">
+            <div class="row align-items-center g-0 pt-0">
+                <div class="col text-center my-2 small text-secondary">
                     Copyright &copy; 2005-@(DateTime.Now.Year) Broadcom. All Rights Reserved. The term &quot;Broadcom&quot; refers to Broadcom Inc. and/or its subsidiaries.<br />
-                    &bull;&nbsp;<Href Class="text-muted" href="https://www.vmware.com/help/privacy.html" NewWindow="true">Privacy&nbsp;Policy</Href>
-                    &bull;&nbsp;<Href Class="text-muted" href="https://www.vmware.com/help/privacy/california-privacy-rights.html" NewWindow="true">Your&nbsp;California&nbsp;Privacy&nbsp;Rights</Href>
-                    &bull;&nbsp;<Href Class="text-muted" href="https://www.vmware.com/help/legal.html" NewWindow="true">Terms&nbsp;of&nbsp;Use</Href>
-                    &bull;&nbsp;<Href Class="text-muted" href="/SteeltoeTrademarkGuidelines.pdf" NewWindow="true">Trademark&nbsp;Guidelines</Href>
+                    &bull;&nbsp;<Href Class="link-secondary" href="https://www.vmware.com/help/privacy.html" NewWindow="true">Privacy&nbsp;Policy</Href>
+                    &bull;&nbsp;<Href Class="link-secondary" href="https://www.vmware.com/help/privacy/california-privacy-rights.html" NewWindow="true">Your&nbsp;California&nbsp;Privacy&nbsp;Rights</Href>
+                    &bull;&nbsp;<Href Class="link-secondary" href="https://www.vmware.com/help/legal.html" NewWindow="true">Terms&nbsp;of&nbsp;Use</Href>
+                    &bull;&nbsp;<Href Class="link-secondary" href="/SteeltoeTrademarkGuidelines.pdf" NewWindow="true">Trademark&nbsp;Guidelines</Href>
                 </div>
             </div>
         </div>
diff --git a/src/Client/Components/Layout/SiteHeader.razor b/src/Client/Components/Layout/SiteHeader.razor
index 4c0a0c8..eac172f 100644
--- a/src/Client/Components/Layout/SiteHeader.razor
+++ b/src/Client/Components/Layout/SiteHeader.razor
@@ -1,8 +1,8 @@
 @inject IOptionsSnapshot<DocsSiteOptions> DocsSiteOptions
 
-<header class="sticky-top bg-white" style="box-shadow: 0 0 20px -4px #eeeeee;">
-    <nav class="bg-white navbar navbar-expand-xl container py-xl-2 navbar-light">
-        <Href class="navbar-brand" href="/">
+<header class="sticky-top bg-light" style="box-shadow: 0 0 20px -4px #eeeeee;">
+    <nav class="bg-light navbar navbar-expand-xl container py-xl-2">
+        <Href Class="navbar-brand" href="/">
             <img id="logo" class="svg" src="/images/logo.svg" alt="Steeltoe" style="width:211px">
         </Href>
         <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-controls="navbar" aria-expanded="false" aria-label="Toggle navigation">
@@ -11,19 +11,19 @@
         <div class="collapse navbar-collapse" id="navbar">
             <ul class="navbar-nav text-center">
                 <li class="nav-item dropdown ml-xl-5 mr-xl-2">
-                    <a class="nav-link dropdown-toggle" href="#" id="why" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="return false;">
+                    <a class="nav-link dropdown-toggle link-primary" href="#" id="why" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="return false;">
                         Why Steeltoe
                     </a>
                     <div class="dropdown-menu" aria-labelledby="why">
-                        <Href class="dropdown-item" href="/why-steeltoe">Overview</Href>
-                        <Href class="dropdown-item" href="/microservices">Microservices</Href>
-                        <Href class="dropdown-item" href="/cloud">Cloud</Href>
-                        <Href class="dropdown-item" href="/web-application">Web Applications</Href>
-                        <Href class="dropdown-item" href="/event-driven">Event Driven</Href>
+                        <Href Class="dropdown-item" href="/why-steeltoe">Overview</Href>
+                        <Href Class="dropdown-item" href="/microservices">Microservices</Href>
+                        <Href Class="dropdown-item" href="/cloud">Cloud</Href>
+                        <Href Class="dropdown-item" href="/web-application">Web Applications</Href>
+                        <Href Class="dropdown-item" href="/event-driven">Event Driven</Href>
                     </div>
                 </li>
                 <li class="nav-item dropdown mx-xl-2">
-                    <a class="nav-link dropdown-toggle" href="#" id="learn" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="return false;">
+                    <a class="nav-link dropdown-toggle link-primary" href="#" id="learn" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="return false;">
                         Get Started
                     </a>
                     <div class="dropdown-menu" aria-labelledby="learn">
@@ -35,7 +35,7 @@
                     </div>
                 </li>
                 <li class="nav-item dropdown mx-xl-2">
-                    <a class="nav-link dropdown-toggle" href="#" id="projects" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="return false;">
+                    <a class="nav-link dropdown-toggle link-primary" href="#" id="projects" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="return false;">
                         Projects
                     </a>
                     <div class="dropdown-menu" aria-labelledby="projects">
@@ -55,10 +55,10 @@
                 <Href class="nav-link" href="/training">Training</Href>
                 </li>*@
                 <li class="nav-item mx-xl-2">
-                    <Href class="nav-link" href="/support">Support</Href>
+                    <Href Class="nav-link link-primary" href="/support">Support</Href>
                 </li>
                 <li class="nav-item mx-xl-2">
-                    <Href class="nav-link" href="/community">Community</Href>
+                    <Href Class="nav-link link-primary" href="/community">Community</Href>
                 </li>
             </ul>
         </div>
diff --git a/src/Client/Components/Pages/Community.razor b/src/Client/Components/Pages/Community.razor
index 7cafb90..6296ac9 100644
--- a/src/Client/Components/Pages/Community.razor
+++ b/src/Client/Components/Pages/Community.razor
@@ -3,7 +3,7 @@
 <Template Name="Community" MetaDescription="Connect with other developers and share your project with the Steeltoe community.">
 	<Description>Connect with other developers and share your project with the Steeltoe community.</Description>
 	<OtherArea>
-		<div class="row no-gutters mb-5">
+		<div class="row g-0 mb-5">
 			<div class="col-6">
 				<div class="component-whatis-title"><h2>Developers</h2></div>
 				<div class="my-5">
diff --git a/src/Client/Components/Pages/Home.razor b/src/Client/Components/Pages/Home.razor
index 7785088..f418a0f 100644
--- a/src/Client/Components/Pages/Home.razor
+++ b/src/Client/Components/Pages/Home.razor
@@ -17,7 +17,7 @@
 
 <div class="bg-midnight-blue text-white width-all">
     <div class="width-70 container">
-        <div class="row no-gutters pt-5">
+        <div class="row g-0 pt-5">
             <div class="col text-center">
                 <h1>
                     Creating .NET microservices? <br />Modernizing existing applications?<br />
@@ -25,7 +25,7 @@
                 </h1>
             </div>
         </div>
-        <div class="row no-gutters mt-5">
+        <div class="row g-0 mt-5">
             <div class="col text-center">
                 <Href class="text-white border-white mr-4" href="/why-steeltoe" AsButton="true">WHY STEELTOE</Href>
                 <Href class="text-white border-white" href="@(DocsSiteOptions.Value.GuidesHome)" AsButton="true">GET STARTED</Href>
@@ -37,7 +37,7 @@
     <div class="width-70 container">
         <div class="width-all text-center"><h2>What Steeltoe can do</h2></div>
         <div class="">
-            <div class="row no-gutters">
+            <div class="row g-0">
                 <div class="col component">
                     <Href href="/microservices">
                         <div class="text-center"><img class="img-fluid" src="/images/icon-microservices-dfc414fd79f67718216adaffb5d99947.svg" alt="Steeltoe helps you build .NET microservices." /></div>
@@ -76,7 +76,7 @@
 </div>
 <div class="width-all">
     <div class="width-90 container py-5">
-        <div class="row no-gutters text-center mt-3">
+        <div class="row g-0 text-center mt-3">
             <div class="col stat">
                 Steeltoe has been downloaded over <span class="number">98 million</span> times on <a href="https://www.nuget.org/profiles/SteeltoeOSS">NuGet</a>!
             </div>
@@ -100,7 +100,7 @@ else
     var i = 1;
     @foreach (var calendarEvent in CalendarEventOptions?.Value.Events ?? [])
     {
-            <div class="row no-gutters">
+            <div class="row g-0">
                 <div class="col news">
                     <div class="date">@((MarkupString)calendarEvent.Date)</div>
                     <div class="title">@((MarkupString)calendarEvent.Title)</div>
@@ -110,7 +110,7 @@ else
             </div>
         @if (i++ < CalendarEventOptions?.Value.Events.Count)
         {
-            <div class="row no-gutters">
+            <div class="row g-0">
                 <div class="col"><hr class="border-steeltoe-blue" /></div>
             </div>
         }
diff --git a/src/Client/Components/Pages/Initializr/Index.razor b/src/Client/Components/Pages/Initializr/Index.razor
index db54512..596afaf 100644
--- a/src/Client/Components/Pages/Initializr/Index.razor
+++ b/src/Client/Components/Pages/Initializr/Index.razor
@@ -19,19 +19,19 @@
         Application generators can help developers to get easy access to these libraries without having to delve into docs, wade through wikis, or search in NuGet repositories.
 	</WhatIs>
 	<OtherArea>
-		<div class="row no-gutters">
+		<div class="row g-0">
 			<div class="col component-whyuse-title mt-0">
 				<h2>Using Initializr</h2>
 			</div>
 		</div>
-		<div class="row mb-5 no-gutters">
+		<div class="row mb-5 g-0">
 			<div class="col component-whyuse-desc">
                 There are a few ways you can use Steeltoe Initializr. Every option gives you the same ready-to-go .NET project. The typical use of Initializr is hosting the service in-house.
                 Because it is a nuget-distributed package included in an even simpler .NET app, hosting and staying up to date doesn't come with a bunch of debt.
                 Hosting in-house also gives teams the option to add their own private dependencies to the service, but stay up to date with the community.
 			</div>
 		</div>
-		<div class="row mb-5 no-gutters">
+		<div class="row mb-5 g-0">
 			<div class="col component-whyuse-desc">
 				<h4>Hosted Service</h4>
 				<div>
@@ -50,12 +50,12 @@
 				</div>
 			</div>
 		</div>
-		<div class="row no-gutters">
+		<div class="row g-0">
 			<div class="col component-whyuse-title mt-0">
 				<h2>About Dependencies</h2>
 			</div>
 		</div>
-		<div class="row mb-5 no-gutters">
+		<div class="row mb-5 g-0">
 			<div class="col component-whyuse-desc">
                 No matter the way you choose to use Initializr, the value is in the distribution of pre-packaged dependencies. The default dependencies included in Initializr are mostly Steeltoe focused.
                 Things like database connectors, a Spring Cloud Config Server client, a Consul service discovery client, and many others. But this is a community driven project, so it only makes sense to offer ways for the .NET community to contribute.<br /><br />
diff --git a/src/Client/Components/Pages/Training.razor b/src/Client/Components/Pages/Training.razor
index 96b813e..a09c7e0 100644
--- a/src/Client/Components/Pages/Training.razor
+++ b/src/Client/Components/Pages/Training.razor
@@ -12,13 +12,13 @@
         Courses are instructor-led, either in person or online. Some are also available privately onsite.
     </Description>
     <FeatureTemplate Context="Feature">
-        <div class="row component-feature no-gutters">
+        <div class="row component-feature g-0">
             <div class="col-6 text-center"><div class="component-feature-img"><img class="img-fluid" src="@Feature.Img" alt="@Feature.Title" /></div></div>
             <div class="col"><div class="component-feature-title">@Feature.Title</div><div class="component-feature-desc">@Feature.Description</div></div>
         </div>
     </FeatureTemplate>
     <AltFeatureTemplate Context="Feature">
-        <div class="row component-feature no-gutters">
+        <div class="row component-feature g-0">
             <div class="col-6"><div class="component-feature-title">@Feature.Title</div><div class="component-feature-desc">@Feature.Description</div></div>
             <div class="col-6 text-center"><div class="component-feature-img"><img class="img-fluid" src="@Feature.Img" alt="@Feature.Title" /></div></div>
         </div>
diff --git a/src/Client/Components/Pages/Why-Steeltoe.razor b/src/Client/Components/Pages/Why-Steeltoe.razor
index 4778ae7..ea05377 100644
--- a/src/Client/Components/Pages/Why-Steeltoe.razor
+++ b/src/Client/Components/Pages/Why-Steeltoe.razor
@@ -8,7 +8,7 @@
     <FeatureTemplate Context="Feature">
         <div class="col-sm-6 pr-sm-5">
             <div class="component-feature-title">@Feature.Title</div>
-            <div class="row no-gutters">
+            <div class="row g-0">
                 <div class="col-sm-3 component-why-img">
                     <img src="@Feature.Img" class="img-fluid" alt="@Feature.Title" />
                 </div>
@@ -19,7 +19,7 @@
     <AltFeatureTemplate Context="Feature">
         <div class="col-sm-6 pl-sm-5">
             <div class="component-feature-title">@Feature.Title</div>
-            <div class="row no-gutters">
+            <div class="row g-0">
                 <div class="col-sm-3 component-why-img">
                     <img src="@Feature.Img" class="img-fluid" alt="@Feature.Title" />
                 </div>
@@ -32,7 +32,7 @@
 	<div class="width-70 container text-white">
 		<div class="width-all text-center"><h2>What Steeltoe can do</h2></div>
 		<div class="">
-			<div class="row no-gutters">
+			<div class="row g-0">
 				<div class="col component-dark"><Href href="/microservices">
 					<div class="text-center"><img class="img-fluid" src="/images/icon-microservices-white.svg" alt="Steeltoe helps build microservices." /></div>
 					<div class="title text-white"><h3>Microservices</h3></div>
diff --git a/src/Client/Components/Template.razor b/src/Client/Components/Template.razor
index 8a82eac..7a07087 100644
--- a/src/Client/Components/Template.razor
+++ b/src/Client/Components/Template.razor
@@ -12,21 +12,21 @@
 
 <div class="width-all bg-yellow">
 	<div class="width-90 container">
-		<div class="row no-gutters"><div class="col component-title">@Name</div></div>
-		<div class="row no-gutters"><div class="col component-desc">@Description</div></div>
+		<div class="row g-0"><div class="col component-title">@Name</div></div>
+		<div class="row g-0"><div class="col component-desc">@Description</div></div>
 	</div>
 </div>
 <div class="width-all yellow-slant">
 	<div class="width-90 container">
-		<div class="row no-gutters">
+		<div class="row g-0">
 			@if (GettingStartedUrl != null) {
 			<div class="col offset-@(DocsUrl==null?"4":"2")">
-				<Href Class="component-button" href="@(GettingStartedUrl)">GET STARTED</Href>
+				<Href Class="component-button link-light" href="@(GettingStartedUrl)">GET STARTED</Href>
 			</div>
 			}
 			@if (DocsUrl != null) {
 			<div class="col @(GettingStartedUrl==null?"offset-4":"")">
-				<Href Class="component-button" href="@(DocsUrl)">READ THE DOCS</Href>
+				<Href Class="component-button link-light" href="@(DocsUrl)">READ THE DOCS</Href>
 			</div>
 			}
 		</div>
@@ -34,16 +34,16 @@
 </div>
 <div class="width-all">
 	<div class="width-90 container">
-		<div class="@(WhatIs != null || WhyUse != null ? "border-bottom-steeltoe-blue" : "") row no-gutters"
+		<div class="@(WhatIs != null || WhyUse != null ? "border-bottom-steeltoe-blue" : "") row g-0"
              style="@(WhatIs != null || WhyUse != null ? "margin-bottom:7%;padding-bottom:7%" : "")">
 			@if (WhatIs != null) {
 			<div class="col-sm mr-sm-2">
-				<div class="row no-gutters">
+				<div class="row g-0">
 					<div class="col component-whatis-title">
 						What @(NameIsPlural ? "are" : "is") @Name?
 					</div>
 				</div>
-				<div class="row no-gutters">
+				<div class="row g-0">
 					<div class="col component-whatis-desc">
 						@WhatIs
 					</div>
@@ -52,12 +52,12 @@
 			}
 			@if (WhyUse != null) {
 			<div class="col-sm ml-sm-2">
-				<div class="row no-gutters">
+				<div class="row g-0">
 					<div class="col component-whyuse-title">
 						Why use @Name?
 					</div>
 				</div>
-				<div class="row no-gutters">
+				<div class="row g-0">
 					<div class="col component-whyuse-desc">
 						@WhyUse
 					</div>
@@ -66,7 +66,7 @@
 			}
 		</div>
 		@if (Features != null) {
-			<div class="row no-gutters">
+			<div class="row g-0">
 				@foreach (var feature in Features)
                 {
                     if (FeatureTemplate == null && AltFeatureTemplate == null)
@@ -107,15 +107,15 @@
 				}
 			</div>
 		}
-		<div class="row no-gutters" style="@((GettingStartedUrl == null && DocsUrl == null) || (DocsUrl == null && !ShowBottomGetStarted) ? "":"margin: 7% 0 7% 0;")">
+		<div class="row g-0" style="@((GettingStartedUrl == null && DocsUrl == null) || (DocsUrl == null && !ShowBottomGetStarted) ? "":"margin: 7% 0 7% 0;")">
 			@if (GettingStartedUrl != null && ShowBottomGetStarted) {
 				<div class="col offset-@(DocsUrl==null&&ShowBottomGetStarted?"4":"2")">
-					<Href Class="component-button" href="@(GettingStartedUrl)">GET STARTED</Href>
+					<Href Class="component-button link-light" href="@(GettingStartedUrl)">GET STARTED</Href>
 				</div>
 			}
 			@if (DocsUrl != null && ShowBottomDocsUrl) {
 				<div class="col @(GettingStartedUrl==null&&ShowBottomDocsUrl?"offset-4":"")">
-					<Href Class="component-button" href="@DocsUrl">READ THE DOCS</Href>
+					<Href Class="component-button link-light" href="@DocsUrl">READ THE DOCS</Href>
 				</div>
 			}
 		</div>
@@ -124,7 +124,7 @@
 @if (OtherArea != null) {
 	<div class="width-all">
 		<div class="width-90 container">
-			<div class="row no-gutters">
+			<div class="row g-0">
 				@OtherArea
 			</div>
 		</div>
diff --git a/src/Client/wwwroot/css/site.css b/src/Client/wwwroot/css/site.css
index b369590..b8f1713 100644
--- a/src/Client/wwwroot/css/site.css
+++ b/src/Client/wwwroot/css/site.css
@@ -241,10 +241,6 @@ code {
     tab-size: 2;
 }
 
-/*ol {
-	margin: 0;
-	padding: 0;
-}*/
 h1 {
     font-style: normal;
     font-weight: bold;