diff --git a/src/components/gallery.ts b/src/components/gallery.ts
index 97a53ccd..3a32ff9d 100644
--- a/src/components/gallery.ts
+++ b/src/components/gallery.ts
@@ -485,7 +485,9 @@ export class FrigateCardGalleryCore extends LitElement {
         // ... and there is a thumbnail rendered that is selected.
         this._refSelected.value
       ) {
-        this._refSelected.value.scrollIntoView();
+        this._refSelected.value.scrollIntoView({
+          block: 'center',
+        });
       }
     });
   }
diff --git a/src/scss/menu.scss b/src/scss/menu.scss
index 36efbbf2..840f352a 100644
--- a/src/scss/menu.scss
+++ b/src/scss/menu.scss
@@ -125,7 +125,6 @@ div.opposing {
 :host([data-style*='hover']),
 :host([data-style='hidden'][expanded]) {
   overflow: visible;
-  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
 }
 
 :host([data-style='overlay'][data-position='top']),
@@ -136,6 +135,9 @@ div.opposing {
 :host([data-style='hidden'][data-position='bottom'][expanded]) {
   width: 100%;
   height: auto;
+
+  // Linear fade left to right.
+  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
 }
 
 :host([data-style='overlay'][data-position='left']),
@@ -146,4 +148,7 @@ div.opposing {
 :host([data-style='hidden'][data-position='right'][expanded]) {
   width: auto;
   height: 100%;
+
+  // Linear fade top to bottom.
+  background: linear-gradient(180deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
 }