diff --git a/leaderboard.html b/leaderboard.html
index c78822d..06d388b 100644
--- a/leaderboard.html
+++ b/leaderboard.html
@@ -1,13 +1,259 @@
-
- Flappy Leader Board
-
-
-
-
-
-
-
This Page displays the leader board!
-
-
+
+ Flappy Leader Board
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
195 points
+
+
+
+
+
+
+
185 points
+
+
+
+
+
+
+
160 points
+
+
+
+
+
+
+
130 points
+
+
+
+
+
+
+
110 points
+
+
+
+
+
+
+
+
+
1195 points
+
+
+
+
+
+
+
1185 points
+
+
+
+
+
+
+
1160 points
+
+
+
+
+
+
+
1130 points
+
+
+
+
+
+
+
1110 points
+
+
+
+
+
+
+
+
+
2195 points
+
+
+
+
+
+
+
2185 points
+
+
+
+
+
+
+
2160 points
+
+
+
+
+
+
+
2130 points
+
+
+
+
+
+
+
2110 points
+
+
+
+
+
+
diff --git a/style/leaderboard.css b/style/leaderboard.css
new file mode 100644
index 0000000..b4c6cf6
--- /dev/null
+++ b/style/leaderboard.css
@@ -0,0 +1,114 @@
+.wrapper {
+ width: 100%;
+ height: 100%;
+}
+
+#leaderheader {
+ padding-top: 10px;
+ text-align: center;
+}
+
+.lboard_section {
+ width: 500px;
+ height: 400px;
+ margin: 100px auto 0;
+ background: #f94f62;
+ padding: 25px 40px;
+ position: relative;
+ border-radius: 5px;
+}
+
+.lboard_section .lboard_tabs ul {
+ display: flex;
+}
+
+.lboard_section .lboard_tabs ul li {
+ margin-right: 50px;
+ font-size: 18px;
+ font-weight: 600;
+ color: #3a3d51;
+ cursor: pointer;
+}
+
+.lboard_section .lboard_tabs ul li:hover,
+.lboard_section .lboard_tabs ul li.active {
+ color: #fff;
+}
+
+.lboard_wrap {
+ position: absolute;
+ top: 70px;
+ left: 40px;
+ background: #ffd300;
+ width: 100%;
+ height: 100%;
+ border-radius: 5px;
+}
+
+.lboard_wrap .lboard_item {
+ padding: 25px;
+}
+
+.lboard_wrap .lboard_mem {
+ display: flex;
+ align-items: center;
+ padding: 15px 0;
+ border-bottom: 1px solid #ffe773;
+}
+
+.lboard_wrap .lboard_mem:first-child {
+ padding-top: 0;
+}
+
+.lboard_wrap .lboard_mem:last-child {
+ padding-bottom: 0;
+ border-bottom: 0;
+}
+
+.lboard_wrap .lboard_mem .img {
+ width: 50px;
+}
+
+.lboard_wrap .lboard_mem img {
+ display: block;
+ width: 100%;
+}
+
+.lboard_wrap .lboard_mem .name_bar {
+ margin: 0 20px;
+ width: calc(100% - 150px);
+}
+
+.lboard_wrap .lboard_mem .name_bar p {
+ color: #3a3d51;
+}
+
+.lboard_wrap .lboard_mem .name_bar p span {
+ margin-right: 5px;
+}
+
+.lboard_wrap .lboard_mem .points {
+ width: 100px;
+ color: #3a3d51;
+}
+
+.lboard_wrap .lboard_mem .name_bar .bar_wrap {
+ width: 100%;
+ height: 5px;
+ background: #d5b000;
+ margin-top: 5px;
+ border-radius: 5px;
+ position: relative;
+ overflow: hidden;
+}
+
+.lboard_wrap .lboard_mem .name_bar .bar_wrap .inner_bar {
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 5px;
+ background: #fff;
+ border-radius: 5px;
+ border-top-right-radius: 0px;
+ border-bottom-right-radius: 0px;
+}