diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..c1f2259
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,5 @@
+{
+  "search.exclude": {
+    "public/images": true
+  }
+}
\ No newline at end of file
diff --git a/src/App.scss b/src/App.scss
index b3a0d1b..4224b62 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -65,6 +65,15 @@ footer {
   text-align: center;
 }
 
+.page-loader {
+  display: flex;
+  height: 85vh;
+  flex-direction: column;
+  justify-content: center;
+  text-align: center;
+  animation: fadeIn 3s forwards;
+}
+
 #tooltip-root {
   position: absolute;
   z-index: $z-index-tooltips;
diff --git a/src/components/PageLoader.tsx b/src/components/PageLoader.tsx
index e899b97..5d0fac1 100644
--- a/src/components/PageLoader.tsx
+++ b/src/components/PageLoader.tsx
@@ -5,11 +5,11 @@ export const PageLoader: FC<Props> = ({ isLoading, pastDelay, error, retry, time
   const retryButton = <button onClick={retry}>retry</button>
 
   if (error) {
-    return <div>Something went awry... do you wish to {retryButton}?</div>
+    return <div className="page-loader">Something went awry... do you wish to {retryButton}?</div>
   } else if (timedOut) {
-    return <div>Taking some time... {retryButton}?</div>
+    return <div className="page-loader">Taking some time... {retryButton}?</div>
   } else if (pastDelay) {
-    return <div>Loading...</div>
+    return <div className="page-loader">Loading...</div>
   } else {
     return null
   }