diff --git a/app/javascript/src/javascripts/notes.js b/app/javascript/src/javascripts/notes.js
index c237ea3eb..122df40af 100644
--- a/app/javascript/src/javascripts/notes.js
+++ b/app/javascript/src/javascripts/notes.js
@@ -86,12 +86,10 @@ class Note {
 
     on_mouseenter() {
       this.note.body.show();
-      this.$note_box.addClass("hovering");
     }
 
     on_mouseleave() {
       this.note.body.hide();
-      this.$note_box.removeClass("hovering");
     }
 
     on_dragstart() {
diff --git a/app/javascript/src/styles/specific/notes.scss b/app/javascript/src/styles/specific/notes.scss
index 6fd6c9a59..ae5f3229a 100644
--- a/app/javascript/src/styles/specific/notes.scss
+++ b/app/javascript/src/styles/specific/notes.scss
@@ -95,6 +95,11 @@
     opacity: 0.5;
     z-index: 100;
 
+    /* Raise notes on hover so overlapping embedded notes are readable. */
+    &:hover {
+      z-index: 200;
+    }
+
     &.unsaved {
       border: var(--unsaved-note-box-border);
     }
@@ -108,7 +113,7 @@
       border: 1px solid transparent;
       opacity: 1;
 
-      &.hovering {
+      &:hover {
         border: var(--note-box-border);
         box-shadow: var(--note-box-shadow);
 
@@ -132,7 +137,7 @@
         border: var(--movable-note-box-border);
       }
 
-      &:not(.hovering) div.ui-resizable-handle {
+      &:not(:hover) div.ui-resizable-handle {
         display: none !important;
       }
     }