diff --git a/awx/ui/client/src/bread-crumb/bread-crumb.block.less b/awx/ui/client/src/bread-crumb/bread-crumb.block.less
index af6f4f57de..abcce2aff0 100644
--- a/awx/ui/client/src/bread-crumb/bread-crumb.block.less
+++ b/awx/ui/client/src/bread-crumb/bread-crumb.block.less
@@ -39,6 +39,29 @@
     flex: initial;
 }
 
+.BreadCrumb > ol {
+      padding: 0px 15px;
+      list-style: none;
+      background-color: #FFFFFF;
+      border-radius: 4px;
+      line-height: 40px;
+}
+
+.BreadCrumb > ol > li {
+    display: inline-block;
+    //   content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
+    padding: 0 5px;
+    color: #b7b7b7;
+}
+
+.BreadCrumb > ol > li:before {
+
+}
+
+.BreadCrumb > ol > li > .active {
+    color: #123123;
+}
+
 @breadcrumb-breakpoint: 900px;
 
 @media screen and (max-width: @breadcrumb-breakpoint) {
diff --git a/awx/ui/client/src/partials/breadcrumb.html b/awx/ui/client/src/partials/breadcrumb.html
index 5722bbd2d8..ed0da680b0 100644
--- a/awx/ui/client/src/partials/breadcrumb.html
+++ b/awx/ui/client/src/partials/breadcrumb.html
@@ -1,4 +1,4 @@
-<ol class="breadcrumb">
+<ol>
     <li ng-repeat="step in steps | limitTo:(steps.length-1)">
         <a href="{{step.ncyBreadcrumbLink}}" ng-bind-html="step.ncyBreadcrumbLabel"></a>
     </li>