diff --git a/frontend/src/client/backgroundAnim.css b/frontend/src/client/backgroundAnim.css
index 5319940..59d4fba 100644
--- a/frontend/src/client/backgroundAnim.css
+++ b/frontend/src/client/backgroundAnim.css
@@ -26,9 +26,12 @@
     0% {
         background-color: rgba( 0, 0, 0, 0.2 );
     }
-    50% {
+    20% {
         background-color: rgba( 0, 0, 0, 0 );
     }
+    100% {
+        background-color: rgba( 0, 0, 0, 0.2 );
+    }
 }
 
 @keyframes gradientAnim {
diff --git a/frontend/src/components/player.vue b/frontend/src/components/player.vue
index a3bc19b..2a3699b 100644
--- a/frontend/src/components/player.vue
+++ b/frontend/src/components/player.vue
@@ -207,9 +207,9 @@ export default {
                     this.control( 'play' );
                     this.isPlaying = true;
                     this.sendUpdate( 'isPlaying' );
-                    this.sendUpdate( 'playingSong' );
                     this.sendUpdate( 'pos' );
                 }
+                this.sendUpdate( 'playingSong' );
                 const minuteCount = Math.floor( this.playingSong.duration / 60 );
                 this.durationBeautified = minuteCount + ':';
                 if ( ( '' + minuteCount ).length === 1 ) {