Adjust position of loader in splash

aleksis/core/assets/components/Loading.vue

 <template>
-  <div v-if="splash" id="logo-container">
-    <img src="/logo" alt="Logo" id="logo" width="600" />
+  <div v-if="splash">
+    <div id="logo-container">
+      <img src="/logo" alt="Logo" id="logo" width="600" />
+    </div>
     <div class="lds-ellipsis">
       <div></div>
       <div></div>
@@ -54,7 +56,10 @@ export default {
 
 .lds-ellipsis {
   display: inline-block;
-  position: relative;
+  position: absolute;
+  bottom: 5%;
+  left: 50%;
+  transform: translate(-50%);
   width: 80px;
   height: 80px;
 }

aleksis/core/templates/core/partials/splash_screen.html

@@ -7,18 +7,18 @@
     id="logo"
     width="600"
   >
-  <div class="lds-ellipsis">
-    <div></div>
-    <div></div>
-    <div></div>
-    <div></div>
-  </div>
   <noscript>
     {% blocktrans %}
       This webbrowser doesn't support JavaScript, or it's execution is blocked. Please use another browser to continue.
     {% endblocktrans %}
   </noscript>
 </div>
+<div class="lds-ellipsis">
+  <div></div>
+  <div></div>
+  <div></div>
+  <div></div>
+</div>
 
 <style>
   #logo {
@@ -41,7 +41,10 @@
 
   .lds-ellipsis {
     display: inline-block;
-    position: relative;
+    position: absolute;
+    bottom: 5%;
+    left: 50%;
+    transform: translate(-50%);
     width: 80px;
     height: 80px;
   }