diff --git a/webapp/src/App.js b/webapp/src/App.js
index dd7a425..d19d707 100644
--- a/webapp/src/App.js
+++ b/webapp/src/App.js
@@ -3,7 +3,7 @@ import React, { useReducer } from 'react'
 import { BrowserRouter, Routes, Route } from "react-router-dom"
 
 import Header from "./container/Header"
-import Leaderboard from "./components/Leaderboard"
+import Leaderboard from "./container/Leaderboard"
 import Game from "./components/Game"
 import About from "./components/About"
 
diff --git a/webapp/src/components/Loading.jsx b/webapp/src/components/Loading.jsx
new file mode 100644
index 0000000..66acbef
--- /dev/null
+++ b/webapp/src/components/Loading.jsx
@@ -0,0 +1,5 @@
+import React from "react"
+
+export default function Loading() {
+    return <div className="Loading">Loading...</div>
+}
\ No newline at end of file
diff --git a/webapp/src/components/Leaderboard/index.css b/webapp/src/container/Leaderboard.css
similarity index 100%
rename from webapp/src/components/Leaderboard/index.css
rename to webapp/src/container/Leaderboard.css
diff --git a/webapp/src/components/Leaderboard/index.jsx b/webapp/src/container/Leaderboard.jsx
similarity index 91%
rename from webapp/src/components/Leaderboard/index.jsx
rename to webapp/src/container/Leaderboard.jsx
index 2dd542d..4194048 100644
--- a/webapp/src/components/Leaderboard/index.jsx
+++ b/webapp/src/container/Leaderboard.jsx
@@ -1,10 +1,11 @@
+import './Leaderboard.css';
 import React from "react"
-import './index.css';
+import Loading from '../components/Loading';
 
 export default function Leaderboard({ leaderboard }) {
 
   if (leaderboard == null)
-    return <p>Loading...</p>
+    return <Loading />
 
   //  var listItems = Object.keys(data).map(playerName => {
   //    var rank = data[playerName];