diff --git a/css/main.css b/css/main.css
index 1b7c482..6bbe79e 100644
--- a/css/main.css
+++ b/css/main.css
@@ -108,8 +108,8 @@ logo {
 logo.sidebar {
   width: 300px;
   height: 230px;
-  background-size: 289px 170px;
-  background-position: -15px 5px;
+  background-size: 285px 190px;
+  background-position: 0px -9px;
   left: 30px;
   top: 30px;
   z-index: 10;
diff --git a/images/lf-mini.gif b/images/lf-mini.gif
new file mode 100644
index 0000000..4d846a2
Binary files /dev/null and b/images/lf-mini.gif differ
diff --git a/js/main.js b/js/main.js
index 2d049ce..4861e84 100644
--- a/js/main.js
+++ b/js/main.js
@@ -19,6 +19,7 @@ document.addEventListener('alpine:init', () => {
     phases: {
       1: 'images/lf-anim-simple.gif',
       2: 'images/lf-anim.gif',
+      9: 'images/lf-mini.gif',
     },
     sidebar: false,
     init() {
@@ -26,7 +27,7 @@ document.addEventListener('alpine:init', () => {
       this.preloadPhase(1);
     },
     togglePhase() {
-      var phase = this.sidebar ? 1 : 2;
+      var phase = this.sidebar ? 9 : 2;
       if (phase in this.phases) {
         console.log("reloading logo phase", phase);
         this.$el.style.backgroundImage = 'url(' + this.phases[phase] + ')';
diff --git a/sass/main.scss b/sass/main.scss
index dc83c6b..64a4508 100644
--- a/sass/main.scss
+++ b/sass/main.scss
@@ -110,8 +110,8 @@ logo {
   &.sidebar {
     width: 300px;
     height: 230px;
-    background-size: 289px 170px;
-    background-position: -15px 5px;
+    background-size: 285px 190px;
+    background-position: 0px -9px;
     left: 30px;
     top: 30px;
     z-index: 10;