diff --git a/app/static/css/default.css b/app/static/css/default.css
new file mode 100644
index 0000000..e69de29
diff --git a/app/templates/_game_player_info.html b/app/templates/_game_player_info.html
index c1d6c65..43d868d 100644
--- a/app/templates/_game_player_info.html
+++ b/app/templates/_game_player_info.html
@@ -1,21 +1,29 @@
 <h2>Game Info</h2>
-<div class="table-responsive">
+<div class="table">
     <table class="table">
-        <tr>
-            <th>My Role</th>
-            <td>{{ current_user.role_in_game(game).name }}</td>
-        </tr>
-        <tr>
-            <th>Game State</th>
-            <td>{{ game.state.name }}</td>
-        </tr>
-        <tr>
-            <th>Start Time</th>
-            <td>{% if game.start_time %}{{ moment(game.start_time).format('DD-MM-YYYY, hh:mm')}}{% else %}-{% endif %}</td>
-        </tr>
-        <tr>
-            <th>End Time</th>
-            <td>{% if game.end_time %}{{ moment(game.end_time).format('DD-MM-YYYY, hh:mm')}}{% else %}-{% endif %}</td>
-        </tr>
+      <tr>
+        <th>My Game</th>
+        <td>{{ game.name.title() }}</td>
+      </tr>
+      <tr>
+          <th>My Name</th>
+          <td>{{ current_user.name.title() }}</td>
+      </tr>
+      <tr>
+          <th>My Role</th>
+          <td>{{ current_user.role_in_game(game).name.title() }}</td>
+      </tr>
+      <tr>
+        <th>Game State</th>
+        <td>{{ game.state.name.title() }}</td>
+      </tr>
+      <tr>
+        <th>Start Time</th>
+        <td>{% if game.start_time %}{{ moment(game.start_time).format('DD-MM-YYYY, hh:mm')}}{% else %}-{% endif %}</td>
+      </tr>
+      <tr>
+        <th>End Time</th>
+        <td>{% if game.end_time %}{{ moment(game.end_time).format('DD-MM-YYYY, hh:mm')}}{% else %}-{% endif %}</td>
+      </tr>
     </table>
-</div>
\ No newline at end of file
+</div>
diff --git a/app/templates/auth/login.html b/app/templates/auth/login.html
index c345890..ec88b87 100644
--- a/app/templates/auth/login.html
+++ b/app/templates/auth/login.html
@@ -2,12 +2,14 @@
 {% import 'bootstrap/wtf.html' as wtf %}
 
 {% block app_content %}
-    <h1>Sign In</h1>
     <div class="row">
-        <div class="col-md-4">
-            {{ wtf.quick_form(form, button_map={'submit': 'primary'}) }}
+      <div class="col-xs-0 col-md-1"></div>
+        <div class="col-xs-8 col-md-4">
+          <h1>Sign In</h1>
+          {{ wtf.quick_form(form, button_map={'submit': 'primary'}) }}
+          <br>
+          <p>New User? <a href="{{ url_for('auth.register') }}">Click to Register!</a></p>
         </div>
+      <div class="col-xs-0 col-md-7"></div>
     </div>
-    <br>
-    <p>New User? <a href="{{ url_for('auth.register') }}">Click to Register!</a></p>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/app/templates/auth/register.html b/app/templates/auth/register.html
index af31b5c..54eeb5a 100644
--- a/app/templates/auth/register.html
+++ b/app/templates/auth/register.html
@@ -2,12 +2,14 @@
 {% import 'bootstrap/wtf.html' as wtf %}
 
 {% block app_content %}
-    <h1>Register</h1>
-    <div class="row">
-        <div class="col-md-4">
-            {{ wtf.quick_form(form, button_map={'submit': 'primary'}) }}
-        </div>
+<div class="row">
+  <div class="col-xs-0 col-md-1"></div>
+    <div class="col-xs-8 col-md-4">
+      <h1>Register</h1>
+      {{ wtf.quick_form(form, button_map={'submit': 'primary'}) }}
+      <br>
+      <p>Already have an account? <a href="{{ url_for('auth.login') }}">Click to Sign In!</a></p>
     </div>
-    <br>
-    <p>Already have an account? <a href="{{ url_for('auth.login') }}">Click to Sign In!</a></p>
-{% endblock %}
\ No newline at end of file
+  <div class="col-xs-0 col-md-7"></div>
+</div>
+{% endblock %}
diff --git a/app/templates/auth/user_hash_login.html b/app/templates/auth/user_hash_login.html
index cf1785f..4a4cd4a 100644
--- a/app/templates/auth/user_hash_login.html
+++ b/app/templates/auth/user_hash_login.html
@@ -2,13 +2,19 @@
 {% import 'bootstrap/wtf.html' as wtf %}
 
 {% block app_content %}
-    <h1>Welcome, {{ user.name }}!</h1>
-    <p>
+<div class="row">
+  <div class="col-xs-0 col-md-1"></div>
+    <div class="col-xs-12 col-md-10">
+      <h1>Welcome, {{ user.name }}!</h1>
+      <p>
         If you found this page, it probably means someone who is organising a hunt invited you by
         sending a link or QR-code to this page. You can start playing right away, if and if you get
         logged out just visit this page again. However, if you want to be sure other people can't
         steal this account, please set a password.
-    </p>
-    <a href="{{ url_for('main.index') }}"><button class="btn btn-primary">Set Password</button></a>
-    <a href="{{ url_for('auth.user_hash_login', auth_hash=user.auth_hash, login='true') }}"><button class="btn btn-primary">Start Playing!</button></a>
-{% endblock %}
\ No newline at end of file
+      </p>
+      <a href="{{ url_for('main.index') }}"><button class="btn btn-primary">Set Password</button></a>
+      <a href="{{ url_for('auth.user_hash_login', auth_hash=user.auth_hash, login='true') }}"><button class="btn btn-primary">Start Playing!</button></a>
+    </div>
+  <div class="col-xs-0 col-md-1"></div>
+</div>
+{% endblock %}
diff --git a/app/templates/base.html b/app/templates/base.html
index 903727d..68ad074 100644
--- a/app/templates/base.html
+++ b/app/templates/base.html
@@ -1,5 +1,10 @@
 {% extends 'bootstrap/base.html' %}
 
+{% block styles %}
+{{ super() }}
+<link rel="stylesheet" href="{{ url_for('static', filename='css/default.css') }}">
+{% endblock %}
+
 {% block title %}
 {% if title %}{{ title }} - The Hunt{% else %}Welcome to The Hunt{% endif %}
 {% endblock %}
@@ -27,6 +32,7 @@
         {% if current_user.is_anonymous %}
         <li><a href="{{ url_for('auth.login') }}">Login</a></li>
         {% else %}
+        <li><a href="#"><div class="hidden-xs hidden-sm">{{ current_user.name }}{% if game is defined %}/{{ game.name }}{% endif %}</div></a></li>
         <li><a href="{{ url_for('auth.logout') }}">Logout</a></li>
         {% endif %}
       </ul>
diff --git a/app/templates/game_bunny_dashboard.html b/app/templates/game_bunny_dashboard.html
index 46cb04a..4f0836c 100644
--- a/app/templates/game_bunny_dashboard.html
+++ b/app/templates/game_bunny_dashboard.html
@@ -8,11 +8,14 @@
 {% endblock %}
 
 {% block player_app_content %}
-<h1>{{ game.name }}: {{ current_user.name }}</h1>
-{% include '_game_player_info.html' %}
+<div class="row">
+  <div class="col-xs-0 col-md-1"></div>
+
+    <div class="col-xs-12 col-md-7">
+
 <h2>Objective Locations:</h2>
 {% if game.objectives %}
-<div class="table-responsive">
+<div class="table">
     <table class="table">
         <thead>
             <tr>
@@ -34,9 +37,21 @@
         </tbody>
     </table>
 </div>
-<div id="map" style=" height: 500px; border-radius: 10px; " class="col-md-6 col-xs-12"></div>
 {% endif %}
 
+</div>
+<div class="col-xs-12 col-md-3">
+  {% include '_game_player_info.html' %}
+</div>
+</div>
+
+{% if game.objectives %}
+<div class="row">
+  <div class="col-xs-1 col-md-1"></div>
+  <div id="map" style=" height: 500px; border-radius: 10px; " class="col-xs-10 col-md-10"></div>
+  <div class="col-xs-1 col-md-1"></div>
+</div>
+{% endif %}
 
 {% endblock %}
 
@@ -70,4 +85,4 @@
     }
 
 </script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/app/templates/game_hunter_dashboard.html b/app/templates/game_hunter_dashboard.html
index 56c9e59..3d25668 100644
--- a/app/templates/game_hunter_dashboard.html
+++ b/app/templates/game_hunter_dashboard.html
@@ -8,22 +8,17 @@
 {% endblock %}
 
 {% block player_app_content %}
-<h1>{{ game.name }}: {{ current_user.name }}</h1>
-{% include '_game_player_info.html' %}
-<h2>Bunnies:</h2>
-<a href="{{ url_for('main.catch_bunny', game_name=game.name) }}">
-    <button class="btn btn-success">Catch Bunny</button>
-</a>
-<div class="table-responsive">
-    <table class="table">
+<div class="row">
+  <div class="col-xs-0 col-md-1"></div>
+
+  <div class="col-xs-12 col-md-7">
+    <h2>Bunnies</h2>
+    <div class="table">
+      <table class="table">
         <thead>
             <tr>
                 <th scope="col">Player Name</th>
-                <th scope="col">Times Caught
-                    <span style="font-size: smaller;">
-                        (<span style="color:green;">Accepted</span>/<span style="color:red;">Denied</span>/<span style="color:gray;">Not reviewed</span>)
-                    </span>
-                </th>
+                <th scope="col">Times Caught</th>
                 <th scope="col">Last location</th>
                 <th scope="col"></th>
             </tr>
@@ -33,7 +28,7 @@
             {% for bunny in game.bunnies() %}
             <tr>
                 <td>{{ bunny.user.name }}</td>
-                <td><span style="color:green;">{{ bunny.player_caught_by_players | selectattr('catching_player', '==', player) | selectattr('review.name', '==', 'accepted') |list|length}}</span> / 
+                <td><span style="color:green;">{{ bunny.player_caught_by_players | selectattr('catching_player', '==', player) | selectattr('review.name', '==', 'accepted') |list|length}}</span> /
                     <span style="color:red;">{{ bunny.player_caught_by_players | selectattr('catching_player', '==', player) | selectattr('review.name', '==', 'denied') |list|length}}</span> /
                     <span style="color:gray;">{{ bunny.player_caught_by_players | selectattr('catching_player', '==', player) | selectattr('review.name', '==', 'none') |list|length}}</span>
                 </td>
@@ -43,15 +38,28 @@
                 {% endwith %}</td>
                 <td>
                     <a href="{{ url_for('main.catch_bunny', game_name=game.name, bunny_name=bunny.user.name) }}">
-                        <button class="btn btn-success">Catch</button>
+                        <button class="btn btn-success btn-sm">Catch</button>
                     </a>
                 </td>
             </tr>
             {% endfor %}
         </tbody>
-    </table>
+      </table>
+      <span style="font-size: smaller;">
+          (<span style="color:green;">Accepted</span>/<span style="color:red;">Denied</span>/<span style="color:gray;">Not reviewed</span>)
+      </span>
+    </div>
+  </div>
+  <div class="col-xs-12 col-md-3">
+    {% include '_game_player_info.html' %}
+  </div>
+</div>
+
+<div class="row">
+  <div class="col-xs-1 col-md-1"></div>
+  <div id="map" style=" height: 500px; border-radius: 10px; " class="col-xs-10 col-md-10"></div>
+  <div class="col-xs-1 col-md-1"></div>
 </div>
-<div id="map" style=" height: 500px; border-radius: 10px; " class="col-md-6 col-xs-12"></div>
 
 {% endblock %}
 
@@ -72,8 +80,8 @@
     L.tileLayer( 'https://geodata.nationaalgeoregister.nl/tiles/service/wmts/brtachtergrondkaartpastel/EPSG:3857/{z}/{x}/{y}.png', {
         attribution: 'Kaartgegevens &copy; <a href="https://kadaster.nl">Kadaster</a>'
     }).addTo( map );
-    
-    var bunnies = JSON.parse('{{ json.dumps(game.last_locations(game.bunnies()), cls=location_encoder)|safe }}') 
+
+    var bunnies = JSON.parse('{{ json.dumps(game.last_locations(game.bunnies()), cls=location_encoder)|safe }}')
     for (var i = 0; i < bunnies.length; i++){
         addPlayerMarker(map, bunnies[i])
     }
@@ -84,4 +92,4 @@
     }
 
 </script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/app/templates/index.html b/app/templates/index.html
index 74fd73b..b530da6 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -1,11 +1,19 @@
 {% extends 'player_base.html' %}
 
 {% block player_app_content %}
-<h1>Hi, {{ current_user.name }}!</h1>
-
+<div class="row">
+  <div class="col-xs-0 col-md-1"></div>
+  <div class="col-xs-12 col-md-10">
 <h2>My games:</h2>
+  </div>
+  <div class="col-xs-0 col-md-1"></div>
+</div>
+
 {% if current_user.games %}
-<div class="table-responsive">
+<div class="row">
+  <div class="col-xs-0 col-md-1"></div>
+  <div class="col-xs-12 col-md-10">
+<div class="table">
     <table class="table">
         <thead>
             <tr>
@@ -20,12 +28,12 @@
             {% for game in current_user.games %}
             <tr>
                 <td><a href="{{ url_for('main.game_dashboard', game_name = game.name) }}">{{ game.name }}</a></td>
-                <td>{{ game.state.name}}</td>
+                <td>{{ game.state.name.title() }}</td>
                 <td>{{ game.start_time }}</td>
                 <td>{{ game.end_time }}</td>
                 <td>
                     {% for gameplayer in current_user.user_games if gameplayer.game == game %}
-                        {{ gameplayer.role.name }}
+                        {{ gameplayer.role.name.title() }}
                     {% endfor %}
                 </td>
             </tr>
@@ -33,9 +41,13 @@
         </tbody>
     </table>
 </div>
+</div>
+<div class="col-xs-0 col-md-1"></div>
+</div>
+
 {% else %}
 <div class="alert alert-info" role="alert">
     You don't participate in any game yet 😢
 </div>
 {% endif %}
-{% endblock %}
\ No newline at end of file
+{% endblock %}