diff --git a/frontend/static/css/index.css b/frontend/static/css/index.css
index 183fb117..b4957e16 100644
--- a/frontend/static/css/index.css
+++ b/frontend/static/css/index.css
@@ -3,6 +3,7 @@ body {
   height: 100%;
   margin: 0;
   padding: 0;
+  font-family: 'Roboto';
 }
 
 #main {
@@ -18,27 +19,6 @@ body {
   height: 100%;
 }
 
-.loaderCenter{
-  margin:0 auto;
-  position: absolute;
-  left:50%;
-  top:50%;
-  margin-left:-76px;
-  margin-top:-60px;
-  width:170px;
-  height:120px;
-}
-.loaderSpinner {
-  position: relative;
-  border: 16px solid #f3f3f3; 
-  border-top: 16px solid #1976d2;
-  border-bottom: 16px solid #9c27b0;
-  border-radius: 50%;
-  width: 120px;
-  height: 120px;
-  animation: spin 4s linear infinite;
-}
-
 @keyframes spin {
   0% { transform: rotate(0deg); }
   100% { transform: rotate(360deg); }
diff --git a/frontend/static/css/loader.css b/frontend/static/css/loader.css
new file mode 100644
index 00000000..cdc671e9
--- /dev/null
+++ b/frontend/static/css/loader.css
@@ -0,0 +1,272 @@
+
+.loaderCenter{
+    margin:0 auto;
+    position: absolute;
+    left:50%;
+    top:50%;
+    margin-top:-120px;
+    margin-left:-190px;
+    width:350px;
+    height:120px;
+  }
+  .loaderSpinner {
+    position: relative;
+    left: 115px;
+    border: 16px solid #f3f3f3; 
+    border-top: 16px solid #1976d2;
+    border-bottom: 16px solid #9c27b0;
+    border-radius: 50%;
+    width: 120px;
+    height: 120px;
+    animation: spin 4s linear infinite;
+  }
+
+.content-slider {
+    width: 100%;
+    height: 360px;
+  }
+  
+  .slider {
+    height: 320px;
+    width: 350px;
+    margin: 40px auto 0;
+    overflow: visible;
+    position: relative;
+  }
+  
+  .mask {
+    overflow: hidden;
+    height: 320px;
+  }
+  
+  .slider ul {
+    margin: 0;
+    padding: 0;
+    position: relative;
+  }
+  
+  .slider li {
+    width: 350px;
+    height: 320px;
+    position: absolute;
+    top: -325px;
+    list-style: none;
+  }
+  
+  .slider .quote {
+    text-align: center;
+    font-size: 30px;
+    font-style: italic;
+  }
+  
+  .slider li.anim1 {
+    animation: cycle 15s linear infinite;
+  }
+  
+  .slider li.anim2 {
+    animation: cycle2 15s linear infinite;
+  }
+  
+  .slider li.anim3 {
+    animation: cycle3 15s linear infinite;
+  }
+  
+  .slider li.anim4 {
+    animation: cycle4 15s linear infinite;
+  }
+  
+  .slider li.anim5 {
+    animation: cycle5 15s linear infinite;
+  }
+  
+  .slider:hover li {
+    animation-play-state: paused;
+  }
+  
+  @keyframes cycle {
+    0% {
+      top: 0px;
+    }
+    4% {
+      top: 0px;
+    }
+    16% {
+      top: 0px;
+      opacity: 1;
+      z-index: 0;
+    }
+    20% {
+      top: 325px;
+      opacity: 0;
+      z-index: 0;
+    }
+    21% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+    50% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+    92% {
+      top: -325px;
+      opacity: 0;
+      z-index: 0;
+    }
+    96% {
+      top: -325px;
+      opacity: 0;
+    }
+    100% {
+      top: 0px;
+      opacity: 1;
+    }
+  }
+  
+  @keyframes cycle2 {
+    0% {
+      top: -325px;
+      opacity: 0;
+    }
+    16% {
+      top: -325px;
+      opacity: 0;
+    }
+    20% {
+      top: 0px;
+      opacity: 1;
+    }
+    24% {
+      top: 0px;
+      opacity: 1;
+    }
+    36% {
+      top: 0px;
+      opacity: 1;
+      z-index: 0;
+    }
+    40% {
+      top: 325px;
+      opacity: 0;
+      z-index: 0;
+    }
+    41% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+    100% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+  }
+  
+  @keyframes cycle3 {
+    0% {
+      top: -325px;
+      opacity: 0;
+    }
+    36% {
+      top: -325px;
+      opacity: 0;
+    }
+    40% {
+      top: 0px;
+      opacity: 1;
+    }
+    44% {
+      top: 0px;
+      opacity: 1;
+    }
+    56% {
+      top: 0px;
+      opacity: 1;
+      z-index: 0;
+    }
+    60% {
+      top: 325px;
+      opacity: 0;
+      z-index: 0;
+    }
+    61% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+    100% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+  }
+  
+  @keyframes cycle4 {
+    0% {
+      top: -325px;
+      opacity: 0;
+    }
+    56% {
+      top: -325px;
+      opacity: 0;
+    }
+    60% {
+      top: 0px;
+      opacity: 1;
+    }
+    64% {
+      top: 0px;
+      opacity: 1;
+    }
+    76% {
+      top: 0px;
+      opacity: 1;
+      z-index: 0;
+    }
+    80% {
+      top: 325px;
+      opacity: 0;
+      z-index: 0;
+    }
+    81% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+    100% {
+      top: -325px;
+      opacity: 0;
+      z-index: -1;
+    }
+  }
+  
+  @keyframes cycle5 {
+    0% {
+      top: -325px;
+      opacity: 0;
+    }
+    76% {
+      top: -325px;
+      opacity: 0;
+    }
+    80% {
+      top: 0px;
+      opacity: 1;
+    }
+    84% {
+      top: 0px;
+      opacity: 1;
+    }
+    96% {
+      top: 0px;
+      opacity: 1;
+      z-index: 0;
+    }
+    100% {
+      top: 325px;
+      opacity: 0;
+      z-index: 0;
+    }
+  }
\ No newline at end of file
diff --git a/frontend/templates/frontend/index.html b/frontend/templates/frontend/index.html
index cc9a1140..ea4f7741 100644
--- a/frontend/templates/frontend/index.html
+++ b/frontend/templates/frontend/index.html
@@ -12,6 +12,7 @@
     <title>RoboSats - Simple and Private Bitcoin Exchange</title>
     {% load static %}
     <link rel="stylesheet" href="{% static "css/fonts.css" %}"/>
+    <link rel="stylesheet" type="text/css" href="{% static "css/loader.css" %}"/>
     <link rel="stylesheet" type="text/css" href="{% static "css/index.css" %}"/>
   </head>
   <body>
@@ -27,7 +28,28 @@
         <div class="loaderCenter">
           <div class="loaderSpinner"></div>
           <br/>
-          <div>Fetching robot parts ...</div>
+          <div class="content-slider">
+            <div class="slider">
+              <div class="mask">
+                <ul>
+                  <li class="anim1">
+                    <div class="quote">Fetching robot parts ...</div>
+                  </li>
+                  <li class="anim2">
+                    <div class="quote">Zipping Sats at light speed ...</div>
+                  </li>
+                  <li class="anim3">
+                    <div class="quote">Adding layers to the onion ...</div>
+                  </li>
+                  <li class="anim4">
+                    <div class="quote">Winning at game theory ...</div>
+                  </li>
+                  <li class="anim5">
+                    <div class="quote">Hiding you on 2^256 bits of entropy...</div>
+                  </li>
+                </ul>
+              </div>
+            </div>
         </div>
       </div>
     </div>