diff --git a/aio/src/styles/1-layouts/_sidenav.scss b/aio/src/styles/1-layouts/_sidenav.scss
index 915d253470..03ba05b117 100644
--- a/aio/src/styles/1-layouts/_sidenav.scss
+++ b/aio/src/styles/1-layouts/_sidenav.scss
@@ -21,21 +21,8 @@ aio-nav-menu {
   }
 }
 
-mat-sidenav.mat-sidenav.sidenav {
-  position: fixed;
-  top: 64px;
-  bottom: 0;
-  left: 0;
-  min-width: 260px;
-  background-color: $superlightgray;
-  border-right: 1px solid $lightgray;
-
-  &.collapsed {
-    top: 56px;
-  }
-}
-
 mat-sidenav-container.sidenav-container {
+  background-color: $white;
   min-height: 100%;
   height: auto !important;
   max-width: 100%;
@@ -45,14 +32,44 @@ mat-sidenav-container.sidenav-container {
   &.has-floating-toc {
     max-width: 82%;
   }
-}
 
-mat-sidenav-container.sidenav-container.mat-drawer-container.mat-sidenav-container {
-  background-color: $white;
-}
+  .sidenav-content {
+    height: auto;
+  }
 
-mat-sidenav-container div.mat-sidenav-content {
-  height: auto;
+  mat-sidenav.sidenav {
+    position: fixed;
+    top: 64px;
+    bottom: 0;
+    left: 0;
+    min-width: 260px;
+    background-color: $superlightgray;
+    border-right: 1px solid $lightgray;
+
+    &.collapsed {
+      top: 56px;
+    }
+
+    // Angular Version Selector
+    .doc-version {
+      padding: 8px;
+      border-top: 1px solid $lightgray;
+
+      select {
+        outline: none;
+        width: 100%;
+        background: rgba($lightgray, 0.5);
+        height: 32px;
+        border: 1px solid $lightgray;
+        color: $darkgray;
+
+        option {
+          font-family: $main-font;
+          @include font-size(14);
+        }
+      }
+    }
+  }
 }
 
 .vertical-menu-item {
@@ -120,12 +137,10 @@ button.vertical-menu-item {
     transition: visibility 275ms, opacity 275ms, max-height 280ms;
     transition-timing-function: ease-out;
   }
-}
 
-.no-animations {
-  .heading-children.expanded,
-  .heading-children.collapsed {
-    transition: none! important;
+  .no-animations &.expanded,
+  .no-animations &.collapsed {
+    transition: none !important;
   }
 }
 
@@ -173,23 +188,3 @@ button.vertical-menu-item {
     @include rotate(90deg);
   }
 }
-
-// Angular Version Selector
-mat-sidenav .doc-version {
-  padding: 8px;
-  border-top: 1px solid $lightgray;
-
-  select {
-    outline: none;
-    width: 100%;
-    background: rgba($lightgray, 0.5);
-    height: 32px;
-    border: 1px solid $lightgray;
-    color: $darkgray;
-
-    option {
-      font-family: $main-font;
-      @include font-size(14);
-    }
-  }
-}
diff --git a/aio/src/styles/2-modules/_notification.scss b/aio/src/styles/2-modules/_notification.scss
index a4cfcb4972..36265feca9 100644
--- a/aio/src/styles/2-modules/_notification.scss
+++ b/aio/src/styles/2-modules/_notification.scss
@@ -69,15 +69,17 @@ aio-notification {
 // Here are all the hacks to make the content and sidebars the right height
 // when the notification is visible
 .aio-notification-show {
-  .sidenav-content {
-    padding-top: 80px + $notificationHeight;
-  }
+  mat-sidenav-container.sidenav-container {
+    .sidenav-content {
+      padding-top: 80px + $notificationHeight;
+    }
 
-  mat-sidenav.mat-sidenav.sidenav {
-    top: 64px + $notificationHeight;
+    mat-sidenav.sidenav {
+      top: 64px + $notificationHeight;
 
-    @media (max-width: 600px) {
-      top: 56px + $notificationHeight;
+      @media (max-width: 600px) {
+        top: 56px + $notificationHeight;
+      }
     }
   }
 
@@ -90,7 +92,7 @@ aio-notification {
   }
 
   &.page-home, &.page-resources, &.page-events, &.page-features, &.page-presskit, &.page-contribute  {
-    main {
+    .sidenav-content {
       padding-top: $notificationHeight;
     }
   }
@@ -104,7 +106,8 @@ aio-notification {
   .sidenav-content {
     transition: padding-top 250ms ease;
   }
-  mat-sidenav.mat-sidenav.sidenav, .toc-container {
+
+  mat-sidenav.sidenav, .toc-container {
     transition: top 250ms ease;
   }
 }