diff --git a/src/components/LoadingIndicator/LoadingIndicator.jsx b/src/components/LoadingIndicator/LoadingIndicator.jsx
index 905081ebc..796df0dd8 100644
--- a/src/components/LoadingIndicator/LoadingIndicator.jsx
+++ b/src/components/LoadingIndicator/LoadingIndicator.jsx
@@ -3,7 +3,7 @@ import React from 'react'
 require('./LoadingIndicator.scss')
 
 const LoadingIndicator = () => {
-  const backgroundImageUrl = { backgroundImage: `url(${require('./ripple.svg')})` }
+  const backgroundImageUrl = { backgroundImage: `url(${require('./loader.gif')})` }
 
   return (
     <div
diff --git a/src/components/LoadingIndicator/LoadingIndicator.scss b/src/components/LoadingIndicator/LoadingIndicator.scss
index 74eafa83e..41d87fd7e 100644
--- a/src/components/LoadingIndicator/LoadingIndicator.scss
+++ b/src/components/LoadingIndicator/LoadingIndicator.scss
@@ -1,7 +1,6 @@
 .loading-indicator {
-  height: 100px;
-  width: 100px;
-  margin: 150px auto;
-  background-repeat: no-repeat;
-  background-position: center;
+  height: 80%;
+  width: 100%;
+  background: 50% 50% no-repeat;
+  background-size: 70px 70px;
 }
diff --git a/src/components/LoadingIndicator/loader.gif b/src/components/LoadingIndicator/loader.gif
new file mode 100644
index 000000000..f8d75834d
Binary files /dev/null and b/src/components/LoadingIndicator/loader.gif differ
diff --git a/src/components/LoadingIndicator/ripple.svg b/src/components/LoadingIndicator/ripple.svg
deleted file mode 100644
index 9e84418e4..000000000
--- a/src/components/LoadingIndicator/ripple.svg
+++ /dev/null
@@ -1 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?><svg width='100px' height='100px' xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="uil-ripple"><rect x="0" y="0" width="100" height="100" fill="none" class="bk"></rect><g> <animate attributeName="opacity" dur="2s" repeatCount="indefinite" begin="0s" keyTimes="0;0.33;1" values="1;1;0"></animate><circle cx="50" cy="50" r="40" stroke="#0096FF" fill="none" strokeWidth="3" stroke-linecap="round"><animate attributeName="r" dur="2s" repeatCount="indefinite" begin="0s" keyTimes="0;0.33;1" values="0;22;44"></animate></circle></g><g><animate attributeName="opacity" dur="2s" repeatCount="indefinite" begin="1s" keyTimes="0;0.33;1" values="1;1;0"></animate><circle cx="50" cy="50" r="40" stroke="#85ccff" fill="none" strokeWidth="3" stroke-linecap="round"><animate attributeName="r" dur="2s" repeatCount="indefinite" begin="1s" keyTimes="0;0.33;1" values="0;22;44"></animate></circle></g></svg>