diff --git a/AJAX_Full_Project_GULP/css/style.css b/AJAX_Full_Project_GULP/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/AJAX_Full_Project_GULP/css/style.css
+++ b/AJAX_Full_Project_GULP/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/AJAX_Full_Project_GULP/scss/core/_layout.scss b/AJAX_Full_Project_GULP/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/AJAX_Full_Project_GULP/scss/core/_layout.scss
+++ b/AJAX_Full_Project_GULP/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/AJAX_Full_Project_GULP/scss/core/navigation/_sidebar.scss b/AJAX_Full_Project_GULP/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/AJAX_Full_Project_GULP/scss/core/navigation/_sidebar.scss
+++ b/AJAX_Full_Project_GULP/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;
diff --git a/AJAX_Starter_GULP/css/style.css b/AJAX_Starter_GULP/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/AJAX_Starter_GULP/css/style.css
+++ b/AJAX_Starter_GULP/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/AJAX_Starter_GULP/scss/core/_layout.scss b/AJAX_Starter_GULP/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/AJAX_Starter_GULP/scss/core/_layout.scss
+++ b/AJAX_Starter_GULP/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/AJAX_Starter_GULP/scss/core/navigation/_sidebar.scss b/AJAX_Starter_GULP/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/AJAX_Starter_GULP/scss/core/navigation/_sidebar.scss
+++ b/AJAX_Starter_GULP/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;
diff --git a/Angular2_CLI_Full_Project/src/assets/css/style.css b/Angular2_CLI_Full_Project/src/assets/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/Angular2_CLI_Full_Project/src/assets/css/style.css
+++ b/Angular2_CLI_Full_Project/src/assets/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/Angular2_CLI_Full_Project/src/scss/core/_layout.scss b/Angular2_CLI_Full_Project/src/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/Angular2_CLI_Full_Project/src/scss/core/_layout.scss
+++ b/Angular2_CLI_Full_Project/src/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/Angular2_CLI_Full_Project/src/scss/core/navigation/_sidebar.scss b/Angular2_CLI_Full_Project/src/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/Angular2_CLI_Full_Project/src/scss/core/navigation/_sidebar.scss
+++ b/Angular2_CLI_Full_Project/src/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;
diff --git a/Angular2_CLI_Starter/src/assets/css/style.css b/Angular2_CLI_Starter/src/assets/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/Angular2_CLI_Starter/src/assets/css/style.css
+++ b/Angular2_CLI_Starter/src/assets/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/Angular2_CLI_Starter/src/scss/core/_layout.scss b/Angular2_CLI_Starter/src/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/Angular2_CLI_Starter/src/scss/core/_layout.scss
+++ b/Angular2_CLI_Starter/src/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/Angular2_CLI_Starter/src/scss/core/navigation/_sidebar.scss b/Angular2_CLI_Starter/src/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/Angular2_CLI_Starter/src/scss/core/navigation/_sidebar.scss
+++ b/Angular2_CLI_Starter/src/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;
diff --git a/Angular_Full_Project_GULP/css/style.css b/Angular_Full_Project_GULP/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/Angular_Full_Project_GULP/css/style.css
+++ b/Angular_Full_Project_GULP/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/Angular_Full_Project_GULP/scss/core/_layout.scss b/Angular_Full_Project_GULP/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/Angular_Full_Project_GULP/scss/core/_layout.scss
+++ b/Angular_Full_Project_GULP/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/Angular_Full_Project_GULP/scss/core/navigation/_sidebar.scss b/Angular_Full_Project_GULP/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/Angular_Full_Project_GULP/scss/core/navigation/_sidebar.scss
+++ b/Angular_Full_Project_GULP/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;
diff --git a/Angular_Starter_GULP/css/style.css b/Angular_Starter_GULP/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/Angular_Starter_GULP/css/style.css
+++ b/Angular_Starter_GULP/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/Angular_Starter_GULP/scss/core/_layout.scss b/Angular_Starter_GULP/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/Angular_Starter_GULP/scss/core/_layout.scss
+++ b/Angular_Starter_GULP/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/Angular_Starter_GULP/scss/core/navigation/_sidebar.scss b/Angular_Starter_GULP/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/Angular_Starter_GULP/scss/core/navigation/_sidebar.scss
+++ b/Angular_Starter_GULP/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;
diff --git a/Static_Full_Project_GULP/css/style.css b/Static_Full_Project_GULP/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/Static_Full_Project_GULP/css/style.css
+++ b/Static_Full_Project_GULP/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/Static_Full_Project_GULP/scss/core/_layout.scss b/Static_Full_Project_GULP/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/Static_Full_Project_GULP/scss/core/_layout.scss
+++ b/Static_Full_Project_GULP/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/Static_Full_Project_GULP/scss/core/navigation/_sidebar.scss b/Static_Full_Project_GULP/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/Static_Full_Project_GULP/scss/core/navigation/_sidebar.scss
+++ b/Static_Full_Project_GULP/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;
diff --git a/Static_Starter_GULP/css/style.css b/Static_Starter_GULP/css/style.css
index 929baf32245adf252f6fe1cd8a26a638ec253e2c..4e46cf0ab3c9e93ee9f3b045a825eb57c17e9ff1 100644
--- a/Static_Starter_GULP/css/style.css
+++ b/Static_Starter_GULP/css/style.css
@@ -5216,10 +5216,10 @@ body:not(.top-nav) .sidebar {
   display: inline;
   padding-top: 55px !important; }
 
-body:not(.top-nav).compact-nav .main {
+body:not(.top-nav).sidebar-nav.compact-nav .main {
   padding-left: 50px; }
 
-body:not(.top-nav).compact-nav .footer {
+body:not(.top-nav).sidebar-nav.compact-nav .footer {
   left: 50px; }
 
 body:not(.top-nav).fixed-nav .sidebar {
@@ -5457,29 +5457,29 @@ body:not(.top-nav) .sidebar {
         background-color: #455b66 !important; }
 
 @media (min-width: 576px) {
-  body.sidebar-nav.compact-nav .sidebar {
+  body.compact-nav .sidebar {
     z-index: 1029;
     width: 50px; }
-    body.sidebar-nav.compact-nav .sidebar .sidebar-nav {
+    body.compact-nav .sidebar .sidebar-nav {
       overflow: visible; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-title, body.sidebar-nav.compact-nav .sidebar ul.nav li.divider {
+    body.compact-nav .sidebar ul.nav li.nav-title, body.compact-nav .sidebar ul.nav li.divider {
       display: none; }
-    body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item {
+    body.compact-nav .sidebar ul.nav li.nav-item {
       border-left: 0 !important;
       overflow: hidden;
       width: 50px; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         background: #263238; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
+      body.compact-nav .sidebar ul.nav li.nav-item a.nav-link {
         position: relative;
         padding: 0 15px 0 0;
         margin: 0;
         line-height: 50px;
         white-space: nowrap;
         border-left: 0 !important; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link.nav-dropdown-toggle::before {
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link i {
           display: block;
           float: left;
           width: 50px;
@@ -5488,50 +5488,50 @@ body:not(.top-nav) .sidebar {
           margin: 0;
           font-size: 18px;
           line-height: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link .tag {
           position: absolute;
           top: 14px;
           right: 15px;
           display: none; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
+        body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover {
           width: 200px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
+          body.compact-nav .sidebar ul.nav li.nav-item a.nav-link:hover .tag {
             display: inline; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul {
+      body.compact-nav .sidebar ul.nav li.nav-item ul {
         position: absolute;
         top: 50px;
         left: 50px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li {
+        body.compact-nav .sidebar ul.nav li.nav-item ul li {
           position: relative;
           padding: 0; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li a.nav-link {
             width: 150px; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item ul li ol {
+          body.compact-nav .sidebar ul.nav li.nav-item ul li ul, body.compact-nav .sidebar ul.nav li.nav-item ul li ol {
             position: absolute;
             top: 0;
             left: 100%; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
+      body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open {
         background: #304047; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > a.nav-link i {
           color: #20a8d8; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item.nav-dropdown.open > ol {
           display: none; }
-      body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover {
+      body.compact-nav .sidebar ul.nav li.nav-item:hover {
         width: 250px;
         overflow: visible;
         background: #20a8d8;
         transition: 0s; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > a.nav-link {
           width: 250px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol {
           max-height: 10000px;
           display: inline;
           transition: 0s; }
-          body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
+          body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li {
             width: 200px; }
-            body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
+            body.compact-nav .sidebar ul.nav li.nav-item:hover > ul li a.nav-link, body.compact-nav .sidebar ul.nav li.nav-item:hover > ol li a.nav-link {
               width: 200px; }
-        body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.sidebar-nav.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
+        body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ul, body.compact-nav .sidebar ul.nav li.nav-item:hover.nav-dropdown.open > ol {
           display: inline; } }
 
 nav.top-nav {
diff --git a/Static_Starter_GULP/scss/core/_layout.scss b/Static_Starter_GULP/scss/core/_layout.scss
index 4199bf7e6e52fb14c7ca1c88b8d6a354881ede4a..cf8153587cbead2a253139d8e64ed511fecc2be9 100644
--- a/Static_Starter_GULP/scss/core/_layout.scss
+++ b/Static_Starter_GULP/scss/core/_layout.scss
@@ -84,12 +84,11 @@ body:not(.top-nav) {
     }
 
     .sidebar {
-        //left: 0;
         display: inline;
         padding-top: $navbar-height !important;
     }
 
-    &.compact-nav {
+    &.sidebar-nav.compact-nav {
 
         .main {
             padding-left: $sidebar-compact-width;
diff --git a/Static_Starter_GULP/scss/core/navigation/_sidebar.scss b/Static_Starter_GULP/scss/core/navigation/_sidebar.scss
index 45c3080333768b292e6c098999a612f1467f21b3..cb48ad65cf640ab0fea738cbe70ccd23fb98fad9 100644
--- a/Static_Starter_GULP/scss/core/navigation/_sidebar.scss
+++ b/Static_Starter_GULP/scss/core/navigation/_sidebar.scss
@@ -254,7 +254,7 @@ body:not(.top-nav) {
 
 @include media-breakpoint-up(sm) {
 
-    body.sidebar-nav.compact-nav {
+    body.compact-nav {
         .sidebar {
             z-index: $zindex-navbar-fixed - 1;
             width: $sidebar-compact-width;