add sliding marquee animation for the game cards - Follow Up Deployment

index.html

@@ -345,7 +345,10 @@
                 <div class="absolute -top-2 left-1/2 -translate-x-1/2 bg-gradient-to-r from-niopurple to-niogold px-2 py-0.5 rounded-full text-xs font-bold whitespace-nowrap transform -translate-y-full opacity-0 group-hover:opacity-100 group-hover:translate-y-0 transition-all duration-300">
                     <span class="text-white">Diamond Tier</span>
                     <div class="absolute bottom-0 left-1/2 w-2 h-2 bg-gradient-to-r from-niopurple to-niogold transform -translate-x-1/2 translate-y-1/2 rotate-45"></div>
+                    </div>
                 </div>
+                <div class="absolute top-0 right-0 h-full w-16 bg-gradient-to-l from-black to-transparent z-10 pointer-events-none"></div>
+                <div class="absolute top-0 left-0 h-full w-16 bg-gradient-to-r from-black to-transparent z-10 pointer-events-none"></div>
             </div>
             <span class="ml-2 text-sm hidden md:block text-transparent bg-clip-text bg-gradient-to-r from-niogold to-amber-200 font-bold">VIP 5</span>
         </div>
@@ -477,8 +480,9 @@
                     <span class="w-2 h-2 bg-red-500 rounded-full mr-1 animate-pulse"></span> LIVE
                 </span>
             </div>
-            <div class="scroll-container overflow-x-auto pb-2">
-                <div class="flex space-x-4" style="min-width: max-content;">
+            <div class="relative overflow-hidden pb-2">
+                <div class="marquee-container">
+                    <div class="marquee flex space-x-4 py-2" style="animation-duration: 40s;">
                     <!-- Repeat 10 game cards -->
                     <div class="relative card-hover">
                         <div class="w-28 h-28 rounded-xl overflow-hidden">