diff --git a/web/index.html b/web/index.html
index 855211419..4ba0e10df 100644
--- a/web/index.html
+++ b/web/index.html
@@ -41,25 +41,12 @@
   <script src="splash/splash.js"></script>
   <script src="worker_service/worker_service.js"></script>
   <script src="i18n/translater.js"></script>
+  <script src="https://unpkg.com/@dotlottie/player-component@2.7.12/dist/dotlottie-player.mjs" type="module"></script>
 </head>
 <body>
 
-    <picture id="splash-branding">
-        <source srcset="splash/img/branding-1x.png 1x, splash/img/branding-2x.png 2x, splash/img/branding-3x.png 3x, splash/img/branding-4x.png 4x" media="(prefers-color-scheme: light)">
-        <source srcset="splash/img/branding-dark-1x.png 1x, splash/img/branding-dark-2x.png 2x, splash/img/branding-dark-3x.png 3x, splash/img/branding-dark-4x.png 4x" media="(prefers-color-scheme: dark)">
-        <img class="bottom" aria-hidden="true" src="splash/img/branding-1x.png" alt="">
-    </picture>
-
-    <div class="center">
-        <div align="center">
-            <picture id="splash">
-                <source srcset="splash/img/light-1x.png 1x, splash/img/light-2x.png 2x, splash/img/light-3x.png 3x, splash/img/light-4x.png 4x" media="(prefers-color-scheme: light)">
-                <source srcset="splash/img/dark-1x.png 1x, splash/img/dark-2x.png 2x, splash/img/dark-3x.png 3x, splash/img/dark-4x.png 4x" media="(prefers-color-scheme: dark)">
-                <img aria-hidden="true" src="splash/img/light-1x.png" alt="">
-            </picture>
-            <div class="loader"></div>
-        </div>
-    </div>
+    <dotlottie-player class="center" src="splash/lottie-tmail.json" background="transparent" speed="1" style="width: 176px; height: 176px" direction="1" playmode="forward" autoplay=""></dotlottie-player>
+    <img src="splash/img/icon_twp.png" alt="Twake Workplace logo" class="bottom-image">
 
     <div class="smart-banner">
         <button class="button close" onClick={handleContinueTwakeMailOnWeb()}>
@@ -108,7 +95,9 @@
           _flutter.loader.load({
             onEntrypointLoaded: async function(engineInitializer) {
               const appRunner = await engineInitializer.initializeEngine();
-              await appRunner.runApp();
+              await setTimeout( async function () {
+                await appRunner.runApp();
+              }, 2000);
             }
           });
         });
@@ -116,7 +105,9 @@
       _flutter.loader.load({
         onEntrypointLoaded: async function(engineInitializer) {
           const appRunner = await engineInitializer.initializeEngine();
-          await appRunner.runApp();
+          await setTimeout( async function () {
+            await appRunner.runApp();
+          }, 2000);
         }
       });
     }
diff --git a/web/splash/img/branding-1x.png b/web/splash/img/branding-1x.png
deleted file mode 100644
index 3007ded72..000000000
Binary files a/web/splash/img/branding-1x.png and /dev/null differ
diff --git a/web/splash/img/branding-2x.png b/web/splash/img/branding-2x.png
deleted file mode 100644
index 4224569cb..000000000
Binary files a/web/splash/img/branding-2x.png and /dev/null differ
diff --git a/web/splash/img/branding-3x.png b/web/splash/img/branding-3x.png
deleted file mode 100644
index 4e78fcf0e..000000000
Binary files a/web/splash/img/branding-3x.png and /dev/null differ
diff --git a/web/splash/img/branding-4x.png b/web/splash/img/branding-4x.png
deleted file mode 100644
index eeb674767..000000000
Binary files a/web/splash/img/branding-4x.png and /dev/null differ
diff --git a/web/splash/img/branding-dark-1x.png b/web/splash/img/branding-dark-1x.png
deleted file mode 100644
index 3007ded72..000000000
Binary files a/web/splash/img/branding-dark-1x.png and /dev/null differ
diff --git a/web/splash/img/branding-dark-2x.png b/web/splash/img/branding-dark-2x.png
deleted file mode 100644
index 4224569cb..000000000
Binary files a/web/splash/img/branding-dark-2x.png and /dev/null differ
diff --git a/web/splash/img/branding-dark-3x.png b/web/splash/img/branding-dark-3x.png
deleted file mode 100644
index 4e78fcf0e..000000000
Binary files a/web/splash/img/branding-dark-3x.png and /dev/null differ
diff --git a/web/splash/img/branding-dark-4x.png b/web/splash/img/branding-dark-4x.png
deleted file mode 100644
index eeb674767..000000000
Binary files a/web/splash/img/branding-dark-4x.png and /dev/null differ
diff --git a/web/splash/img/dark-1x.png b/web/splash/img/dark-1x.png
deleted file mode 100644
index 99b90b3ba..000000000
Binary files a/web/splash/img/dark-1x.png and /dev/null differ
diff --git a/web/splash/img/dark-2x.png b/web/splash/img/dark-2x.png
deleted file mode 100644
index f9b8f6388..000000000
Binary files a/web/splash/img/dark-2x.png and /dev/null differ
diff --git a/web/splash/img/dark-3x.png b/web/splash/img/dark-3x.png
deleted file mode 100644
index e010ef3ed..000000000
Binary files a/web/splash/img/dark-3x.png and /dev/null differ
diff --git a/web/splash/img/dark-4x.png b/web/splash/img/dark-4x.png
deleted file mode 100644
index 21d15bae2..000000000
Binary files a/web/splash/img/dark-4x.png and /dev/null differ
diff --git a/web/splash/img/icon_twp.png b/web/splash/img/icon_twp.png
new file mode 100644
index 000000000..0f5631b3a
Binary files /dev/null and b/web/splash/img/icon_twp.png differ
diff --git a/web/splash/img/light-1x.png b/web/splash/img/light-1x.png
deleted file mode 100644
index 99b90b3ba..000000000
Binary files a/web/splash/img/light-1x.png and /dev/null differ
diff --git a/web/splash/img/light-2x.png b/web/splash/img/light-2x.png
deleted file mode 100644
index f9b8f6388..000000000
Binary files a/web/splash/img/light-2x.png and /dev/null differ
diff --git a/web/splash/img/light-3x.png b/web/splash/img/light-3x.png
deleted file mode 100644
index e010ef3ed..000000000
Binary files a/web/splash/img/light-3x.png and /dev/null differ
diff --git a/web/splash/img/light-4x.png b/web/splash/img/light-4x.png
deleted file mode 100644
index 21d15bae2..000000000
Binary files a/web/splash/img/light-4x.png and /dev/null differ
diff --git a/web/splash/lottie-tmail.json b/web/splash/lottie-tmail.json
new file mode 100644
index 000000000..5b5c48804
--- /dev/null
+++ b/web/splash/lottie-tmail.json
@@ -0,0 +1 @@
+{"nm":"Flow 4","ddd":0,"h":176,"w":176,"meta":{"g":"LottieFiles Figma v83"},"layers":[{"ty":0,"nm":"Mail-app-icon","sr":1,"st":0,"op":37,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":18},{"s":[54,54],"t":36}]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[88,88]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"w":176,"h":176,"refId":"1","ind":1}],"v":"5.7.0","fr":60,"op":36,"ip":0,"assets":[{"nm":"[Asset] Mail-app-icon","id":"1","layers":[{"ty":4,"nm":"Subtract","sr":1,"st":0,"op":37,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[20.11,19.86],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[20.11,19.86],"t":18},{"s":[35.8,35.72],"t":36}]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[38.98,39.14],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[38.98,39.14],"t":18},{"s":[53.97,53.9],"t":36}]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"sh","bm":0,"hd":false,"nm":"","d":1,"ks":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,0],[0,-2.32],[0,0],[-4.92,0],[0,0],[0,4.92],[0,0],[1.84,1.41],[0,0],[2.66,-2.03],[0,0]],"o":[[-1.84,1.41],[0,0],[0,4.92],[0,0],[4.92,0],[0,0],[0,-2.32],[0,0],[-2.66,-2.03],[0,0],[0,0]],"v":[[2.92,11.2],[0,17.1],[0,30.81],[8.92,39.72],[31.31,39.72],[40.23,30.81],[40.23,17.1],[37.3,11.2],[24.62,1.52],[15.61,1.52],[2.92,11.2]]}],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,0],[0,-2.32],[0,0],[-4.92,0],[0,0],[0,4.92],[0,0],[1.84,1.41],[0,0],[2.66,-2.03],[0,0]],"o":[[-1.84,1.41],[0,0],[0,4.92],[0,0],[4.92,0],[0,0],[0,-2.32],[0,0],[-2.66,-2.03],[0,0],[0,0]],"v":[[2.92,11.2],[0,17.1],[0,30.81],[8.92,39.72],[31.31,39.72],[40.23,30.81],[40.23,17.1],[37.3,11.2],[24.62,1.52],[15.61,1.52],[2.92,11.2]]}],"t":18},{"s":[{"c":true,"i":[[0,0],[0,-3.21],[0,0],[-6.82,0],[0,0],[0,6.82],[0,0],[2.55,1.95],[0,0],[3.68,-2.81],[0,0]],"o":[[-2.55,1.95],[0,0],[0,6.82],[0,0],[6.82,0],[0,0],[0,-3.21],[0,0],[-3.68,-2.81],[0,0],[0,0]],"v":[[4.05,21.56],[0,29.74],[0,59.1],[12.34,71.45],[59.25,71.45],[71.59,59.1],[71.59,29.74],[67.55,21.56],[42.04,2.11],[29.56,2.11],[4.05,21.56]]}],"t":36}]}},{"ty":"sh","bm":0,"hd":false,"nm":"","d":1,"ks":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,0],[0,0],[-1.64,0],[0,0],[0,1.64],[0,0],[0,0],[2.05,1.43],[0,0]],"o":[[0,0],[0,1.64],[0,0],[1.64,0],[0,0],[0,0],[-2.05,1.43],[0,0],[0,0]],"v":[[4.47,15.62],[4.47,32.37],[7.44,35.34],[32.79,35.34],[35.76,32.37],[35.76,15.62],[23.52,24.19],[16.7,24.19],[4.47,15.62]]}],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,0],[0,0],[-1.64,0],[0,0],[0,1.64],[0,0],[0,0],[2.05,1.43],[0,0]],"o":[[0,0],[0,1.64],[0,0],[1.64,0],[0,0],[0,0],[-2.05,1.43],[0,0],[0,0]],"v":[[4.47,15.62],[4.47,32.37],[7.44,35.34],[32.79,35.34],[35.76,32.37],[35.76,15.62],[23.52,24.19],[16.7,24.19],[4.47,15.62]]}],"t":18},{"s":[{"c":true,"i":[[0,0],[0,0],[-2.27,0],[0,0],[0,2.27],[0,0],[0,0],[2.83,1.99],[0,0]],"o":[[0,0],[0,2.27],[0,0],[2.27,0],[0,0],[0,0],[-2.83,1.99],[0,0],[0,0]],"v":[[7.95,28.55],[7.95,59.53],[12.07,63.65],[59.52,63.65],[63.64,59.53],[63.64,28.55],[40.52,44.74],[31.08,44.74],[7.95,28.55]]}],"t":36}]}},{"ty":"fl","bm":0,"hd":false,"nm":"","c":{"a":0,"k":[1,1,1]},"r":2,"o":{"a":0,"k":100}}],"ind":1},{"ty":4,"nm":"Rectangle 4459","sr":1,"st":0,"op":37,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":18},{"s":[54,54],"t":36}]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":18},{"s":[54,54],"t":36}]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"sh","bm":0,"hd":false,"nm":"","d":1,"ks":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,-14.22],[0,0],[14.22,0],[0,0],[0,14.22],[0,0],[-14.22,0],[0,0]],"o":[[0,0],[0,14.22],[0,0],[-14.22,0],[0,0],[0,-14.22],[0,0],[14.22,0]],"v":[[78,25.76],[78,52.24],[52.24,78],[25.76,78],[0,52.24],[0,25.76],[25.76,0],[52.24,0]]}],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,-14.22],[0,0],[14.22,0],[0,0],[0,14.22],[0,0],[-14.22,0],[0,0]],"o":[[0,0],[0,14.22],[0,0],[-14.22,0],[0,0],[0,-14.22],[0,0],[14.22,0]],"v":[[78,25.76],[78,52.24],[52.24,78],[25.76,78],[0,52.24],[0,25.76],[25.76,0],[52.24,0]]}],"t":18},{"s":[{"c":true,"i":[[0,-19.69],[0,0],[19.69,0],[0,0],[0,19.69],[0,0],[-19.69,0],[0,0]],"o":[[0,0],[0,19.69],[0,0],[-19.69,0],[0,0],[0,-19.69],[0,0],[19.69,0]],"v":[[108,35.67],[108,72.33],[72.33,108],[35.67,108],[0,72.33],[0,35.67],[35.67,0],[72.33,0]]}],"t":36}]}},{"ty":"gf","bm":0,"hd":false,"nm":"","e":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[76.16850280761719,3.778589963912964],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[76.16850280761719,3.778589963912964],"t":18},{"s":[105.46399688720703,5.231900215148926],"t":36}]},"g":{"p":2,"k":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[0,0.9412156862745098,0.9451372549019608,0.9529803921568627,0.9973028898239136,0.9412156862745098,0.9451372549019608,0.9529803921568627],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[0,0.9412156862745098,0.9451372549019608,0.9529803921568627,0.9973028898239136,0.9412156862745098,0.9451372549019608,0.9529803921568627],"t":18},{"s":[0,0.11768627450980393,0.5686666666666667,1,0.9973028898239136,0.18141176470588236,0.8523137254901961,0.9996078431372549],"t":36}]}},"t":1,"a":{"a":0,"k":0},"h":{"a":0,"k":0},"s":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[10.937999725341797,69.80460357666016],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[10.937999725341797,69.80460357666016],"t":18},{"s":[15.145000457763672,96.65249633789062],"t":36}]},"r":1,"o":{"a":0,"k":100}}],"ind":2},{"ty":4,"nm":"Mail-app-icon Bg","sr":1,"st":0,"op":37,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":18},{"s":[54,54],"t":36}]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[39,39],"t":18},{"s":[54,54],"t":36}]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"sh","bm":0,"hd":false,"nm":"","d":1,"ks":{"a":1,"k":[{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[78,0],[78,78],[0,78],[0,0]]}],"t":0},{"o":{"x":0.33,"y":1},"i":{"x":0.68,"y":1},"s":[{"c":true,"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[78,0],[78,78],[0,78],[0,0]]}],"t":18},{"s":[{"c":true,"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[108,0],[108,108],[0,108],[0,0]]}],"t":36}]}}],"ind":3}]}]}
\ No newline at end of file
diff --git a/web/splash/style.css b/web/splash/style.css
index aa71731d8..780d58829 100644
--- a/web/splash/style.css
+++ b/web/splash/style.css
@@ -5,7 +5,7 @@ html {
 body {
   margin: 0;
   min-height: 100%;
-  background-color: #000000;
+  background-color: #ffffff;
   background-size: 100% 100%;
 }
 
@@ -55,23 +55,11 @@ body {
   right: 0;
 }
 
-.loader {
-  margin: 16px;
-  border: 2px solid #f3f3f3;
-  border-radius: 50%;
-  border-top: 2px solid #007AFF;
-  width: 18px;
-  height: 18px;
-  -webkit-animation: spin 2s linear infinite;
-  animation: spin 2s linear infinite;
-}
-
-@-webkit-keyframes spin {
-  0% { -webkit-transform: rotate(0deg); }
-  100% { -webkit-transform: rotate(360deg); }
-}
-
-@keyframes spin {
-  0% { transform: rotate(0deg); }
-  100% { transform: rotate(360deg); }
+.bottom-image {
+    position: absolute; /* Position relative to the .container */
+    bottom: 40px; /* 40px from the bottom */
+    width: 210px; /* Fixed width */
+    height: auto; /* Maintain aspect ratio */
+    left: 50%; /* Start from the horizontal center */
+    transform: translateX(-50%); /* Adjust to truly center the image */
 }
\ No newline at end of file
