diff --git a/src/app/app.component.html b/src/app/app.component.html
index c127571..f56c0d5 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,11 +1,10 @@
-<nav>
-  <ul ngbNav [activeId]="route.fragment | async" class="nav-tabs">
-    <li ngbNavItem="/edit"><a ngbNavLink routerLink="/edit" routerLinkActive="active"><i class="bi bi-pencil-square"></i>{{ data.getPlayers().length }}</a></li>
-    <li ngbNavItem="/basic"><a ngbNavLink routerLink="/basic" routerLinkActive="active"><i class="bi bi-shuffle"></i></a></li>
-    <li ngbNavItem="/rotations"><a ngbNavLink routerLink="/rotations" routerLinkActive="active"><i class="bi bi-arrow-repeat"></i></a></li>
-  </ul>
-</nav>
-<p></p>
 <main class="main">
     <router-outlet></router-outlet>
-</main>
\ No newline at end of file
+</main>
+<nav>
+  <ul ngbNav [activeId]="route.fragment | async" class="nav-tabs custom-navbar bg-body-secondary">
+    <li ngbNavItem="/edit" class="custom-navitem"><a ngbNavLink routerLink="/edit" routerLinkActive="active"><i class="bi bi-pencil-square"></i>{{ data.getPlayers().length }}</a></li>
+    <li ngbNavItem="/basic" class="custom-navitem"><a ngbNavLink routerLink="/basic" routerLinkActive="active"><i class="bi bi-shuffle"></i></a></li>
+    <li ngbNavItem="/rotations" class="custom-navitem"><a ngbNavLink routerLink="/rotations" routerLinkActive="active"><i class="bi bi-arrow-repeat"></i></a></li>
+  </ul>
+</nav>
\ No newline at end of file
diff --git a/src/app/app.component.less b/src/app/app.component.less
index b6c917b..4217717 100644
--- a/src/app/app.component.less
+++ b/src/app/app.component.less
@@ -15,4 +15,24 @@ tr{
 .wrap-cell{
     word-break: break-all;
     white-space: normal;
+}
+.main{
+    margin-bottom: 5rem;
+    padding: 1rem;
+    overflow-y: auto;
+}
+.custom-navbar{
+    height: 3rem;
+    width: 100vw;
+    position: fixed;
+    bottom: 0;
+    display: flex;
+    justify-content: space-around; /* Distribute items evenly */
+    z-index: 1000;
+}
+.custom-navitem{
+    text-align: center; /* Center the content of each item */
+    flex: 1;
+}
+.nav-link.active{
 }
\ No newline at end of file
diff --git a/src/app/data.service.ts b/src/app/data.service.ts
index a95eee9..122aa63 100644
--- a/src/app/data.service.ts
+++ b/src/app/data.service.ts
@@ -8,11 +8,13 @@ export class DataService {
   private players: Player[] = [];
 
   setPlayers(players: Player[]){
-    this.players = players;
+    for (let player of players){
+      this.addPlayer(player);
+    }
   }
   
   addPlayer(player: Player): boolean{
-    if (Player.isNew(player, this.players)){
+    if (player.name.trim() && Player.isNew(player, this.players)){
       this.players.push(player);
       return true
     }