diff --git a/index.html b/index.html
index 7068255..62beccd 100644
--- a/index.html
+++ b/index.html
@@ -199,8 +199,11 @@
                 left: var(--size-normal);
                 border-radius: var(--size-normal);
                 padding: 0 var(--size-normal);
-                opacity: 0;
                 transition: opacity 0.25s;
+                opacity: 0;
+            }
+            .app__notification--visible {
+                opacity: 1;
             }
             .app__scrollTop {
                 bottom: var(--size-normal);
@@ -287,8 +290,8 @@
             const notify = text => {
                 const el = document.querySelector('.app__notification');
                 el.textContent = text;
-                el.style.opacity = '1';
-                setTimeout(() => el.style.opacity = '0', 2000);
+                el.classList.add('app__notification--visible');
+                setTimeout(() => el.classList.remove('app__notification--visible'), 2000);
             };
             window.addEventListener('DOMContentLoaded', async () => {
                 document.querySelector('.app__scrollTop').onclick = () => window.scrollTo({ top: 0, behavior: 'smooth' });