diff --git a/coffee_scale/urls.py b/coffee_scale/urls.py
index f750576..acaa103 100644
--- a/coffee_scale/urls.py
+++ b/coffee_scale/urls.py
@@ -1,4 +1,5 @@
 from django.conf.urls import url
+from django.conf import settings
 from django.views.generic.base import RedirectView
 
 from .views import coffee_view
@@ -6,7 +7,10 @@ from .views import coffee_view
 favicon_view = RedirectView.as_view(url='static/img/favicon.ico', permanent=True)
 
 urlpatterns = [
-
     # landing page
     url(r'^$', coffee_view),
 ]
+
+if settings.DEBUG:
+    from django.contrib.staticfiles.urls import staticfiles_urlpatterns
+    urlpatterns += staticfiles_urlpatterns()
diff --git a/infoscreen/static/css/infoscreen_admin.css b/infoscreen/static/css/admin.css
similarity index 89%
rename from infoscreen/static/css/infoscreen_admin.css
rename to infoscreen/static/css/admin.css
index f4ceb48..5a43ebc 100644
--- a/infoscreen/static/css/infoscreen_admin.css
+++ b/infoscreen/static/css/admin.css
@@ -49,7 +49,12 @@ td {
   }
 }
 
-
 #header {
     max-width: 100%;
 }
+
+.logout-button {
+  float: right;
+  margin-top: 10px;
+  margin-right: 30px;
+}
diff --git a/infoscreen/templates/base.html b/infoscreen/templates/base.html
new file mode 100644
index 0000000..8091d50
--- /dev/null
+++ b/infoscreen/templates/base.html
@@ -0,0 +1,41 @@
+{% load i18n %}
+{% load static %}
+{% load staticfiles %}
+
+<!DOCTYPE html>
+
+{% block html %}
+<html ng-app="{% block appname %}{% endblock appname %}">
+    <head>
+        <meta charset="utf-8" name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1" />
+        <title>
+        {% block title %}
+        {% endblock title %}
+        </title>
+
+        {% block libraries %}
+        <script src="{% static "js/lib/angular.js" %}"></script>
+        <script src="{% static "js/lib/ng-file-upload-bower-12.2.11/ng-file-upload-all.js" %}"></script>
+        <script src="{% static "js/lib/jquery-3.1.0.min.js" %}"></script>
+        <script src="{% static "js/lib/bootstrap.min.js" %}"></script>
+        <script src="{% static "js/lib/underscore-min.js" %}"></script>
+        <script src="{% static "js/lib/moment.js" %}"></script>
+        <script src="{% static "js/lib/angular-route.js" %}"></script>
+        <script src="{% static "js/lib/angular-animate.js" %}"></script>
+        <link rel="stylesheet" href="{% static "css/lib/bootstrap.min.css" %}"></link>
+        {% endblock libraries %}
+
+        {% block styles %}
+        <link rel="stylesheet" href="{% static "css/admin.css" %}"></link>
+        {% endblock styles %}
+
+        {% block controllers %}
+        <script src="{% static "js/infoadmin_controllers.js" %}"></script>
+        {% endblock controllers %}
+    </head>
+    <body>
+        {% block body %}
+        {% endblock body %}
+    </body>
+</html>
+{% endblock html %}
\ No newline at end of file
diff --git a/infoscreen/templates/infoscreen_admin.html b/infoscreen/templates/infoscreen_admin.html
index 9ab758e..4e57597 100644
--- a/infoscreen/templates/infoscreen_admin.html
+++ b/infoscreen/templates/infoscreen_admin.html
@@ -1,154 +1,154 @@
+{% extends "infoscreen:base.html" %}
+
 {% load i18n %}
 {% load static %}
 {% load staticfiles %}
-<!DOCTYPE html>
-<html ng-app="infoAdmin">
-    <head>
-        <meta charset="utf-8" name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1" />
-        <title>Infoscreen admin</title>
-        <script src="{% static "js/lib/angular.js" %}"></script>
-        <script src="{% static "js/lib/ng-file-upload-bower-12.2.11/ng-file-upload-all.js" %}"></script>
-        <script src="{% static "js/lib/jquery-3.1.0.min.js" %}"></script>
-        <script src="{% static "js/lib/bootstrap.min.js" %}"></script>
-        <script src="{% static "js/lib/underscore-min.js" %}"></script>
-        <script src="{% static "js/infoadmin_controllers.js" %}"></script>
 
-        <link rel="stylesheet" href="{% static "css/lib/bootstrap.min.css" %}"></link>
-        <link rel="stylesheet" href="{% static "css/base.css" %}"></link>
-        <link rel="stylesheet" href="{% static "css/infoscreen_admin.css" %}"></link>
-    </head>
-    <body>
-        <div id="header" class="row">
-            <div class="logout-button">
-                <form action="/logout" method="post"> {% csrf_token %}
-                    <input type="Submit" value="{% trans "Log out" %}" name="Logout" class="btn btn-danger"/>
-                </form>
-            </div>
+{% block appname %}infoAdmin{% endblock appname %}
+
+{% block title %}
+{% trans "Infoscreen admin" %}
+{% endblock title %}
+
+{% block styles %}
+<link rel="stylesheet" href="{% static "css/admin.css" %}"></link>
+{% endblock styles %}
+
+{% block controllers %}
+<script src="{% static "js/infoadmin_controllers.js" %}"></script>
+{% endblock controllers %}
+
+{% block body %}
+<div id="header" class="row">
+    <div class="logout-button">
+        <form action="/logout" method="post"> {% csrf_token %}
+            <input type="Submit" value="{% trans "Log out" %}" name="Logout" class="btn btn-danger"/>
+        </form>
+    </div>
+</div>
+<div class="container" ng-controller="infoadmin_ctrl">
+    <div class="row">
+        <div class="col-md-12">
+            <h1>{% trans "Infoscreen Admin Pane" %}</h1>
         </div>
-        <div class="container" ng-controller="infoadmin_ctrl">
-            <div class="row">
-                <div class="col-md-12">
-                    <h1>{% trans "Infoscreen Admin Pane" %}</h1>
-                </div>
-            </div>
-            <ul class="nav nav-tabs" role="tablist">
-                <li class="active"><a data-toggle="tab" href="#slides" role="tab">{% trans "Manage Slides" %}</a></li>
-                <li class="dropdown">
-                    <a data-toggle="dropdown" href="#">{% trans "Manage Rotations" %}<span class="caret"></span></a>
-                    <ul class="dropdown-menu">
-                        <li ng-repeat="r in rotations"><a href="#rotations" ng-click="selectRotation(r.id)" data-toggle="tab">{$ r.name $}</a></li>
-                        <li class="divider">
-                        <li class="nav-item"><a data-toggle="tab" href="#deleterot" role="tab">{% trans "Create/Delete" %}</a></li>
-                    </ul>
+    </div>
+    <ul class="nav nav-tabs" role="tablist">
+        <li class="active"><a data-toggle="tab" href="#slides" role="tab">{% trans "Manage Slides" %}</a></li>
+        <li class="dropdown">
+            <a data-toggle="dropdown" href="#">{% trans "Manage Rotations" %}<span class="caret"></span></a>
+            <ul class="dropdown-menu">
+                <li ng-repeat="r in rotations"><a href="#rotations" ng-click="selectRotation(r.id)" data-toggle="tab">{$ r.name $}</a></li>
+                <li class="divider">
+                <li class="nav-item"><a data-toggle="tab" href="#deleterot" role="tab">{% trans "Create/Delete" %}</a></li>
             </ul>
-            <div class="tab-content row">
-                <div id="slides" class="tab-pane active">
-                    <div ng-controller="infoadmin_ctrl">
-                        <div class="col-xs-12 col-md-6">
-                            <h2>{% trans "Create new item" %}</h2>
-                            <div>{% trans "Create a new item by type" %}</div>
-                            <table class="table table-striped">
-                                <tr>
-                                    <td>{% trans "Item type" %}</td>
-                                    <td>
-                                        <select class="form-control form-control-sm" ng-model="createtype", ng-options="t.name for t in infotypes | orderBy: 'name'">
-                                            <option value=""></option>
-                                        </select>
-                                    </td>
-                                </tr>
-                            </table>
-                            <div ng-include="createtype.create_template_url"></div>
-                        </div>
-                        <div class="col-xs-12 col-md-6">
-                            <h2>{% trans "Info items" %}</h2>
-                            <div>{% trans "Infoitems available for rotations" %}</div>
-                            <table class="table table-striped">
-                                <tr>
-                                    <th>{% trans "Item" %}</th>
-                                    <th>{% trans "Type" %}</th>
-                                    <th>{% trans "Delete" %}</th>
-                                </tr>
-                                <tr ng-repeat="i in infoitems | orderBy:['display_name','name']">
-                                    <td>{$ i.name $}</td>
-                                    <td>{$ i.display_name $}</td>
-                                    <td><input type="button" class="btn btn-danger" ng-click="deleteItem(i.item_type, i.id);" value="{% trans "Delete" %}"></input></td>
-                                </tr>
-                            </table>
-
-                        </div>
-                    </div>
+    </ul>
+    <div class="tab-content row">
+        <div id="slides" class="tab-pane active">
+            <div ng-controller="infoadmin_ctrl">
+                <div class="col-xs-12 col-md-6">
+                    <h2>{% trans "Create new item" %}</h2>
+                    <div>{% trans "Create a new item by type" %}</div>
+                    <table class="table table-striped">
+                        <tr>
+                            <td>{% trans "Item type" %}</td>
+                            <td>
+                                <select class="form-control form-control-sm" ng-model="createtype", ng-options="t.name for t in infotypes | orderBy: 'name'">
+                                    <option value=""></option>
+                                </select>
+                            </td>
+                        </tr>
+                    </table>
+                    <div ng-include="createtype.create_template_url"></div>
                 </div>
-                <div id="rotations" class="tab-pane" ng-controller="infoadmin_ctrl">
-                    <div class="col-xs-12 col-md-6">
-                        <h2>{% trans "Info items" %}</h2>
-                        <div>{% trans "Infoitems available for rotations" %}</div>
-                        <table class="table table-striped">
-                            <tr>
-                                <th>{% trans "Item" %}</th>
-                                <th>{% trans "Type" %}</th>
-                                <th>{% trans "Set duration" %}</th>
-                                <th>{% trans "Add to rotation" %}</th>
-                                <th>{% trans "Delete" %}</th>
-                            </tr>
-                            <tr ng-repeat="i in infoitems | orderBy:['display_name','name']">
-                                <td>{$ i.name $}</td>
-                                <td>{$ i.display_name $}</td>
-                                <td><input type="number" min="1" max="60" class="form-control" ng-model="i.duration"></input></td>
-                                <td><input type="button" class="btn btn-success" ng-click="createInstance(selected_rot.id, i.id, i.item_type, i.duration);" value="{% trans "Add" %}"></input></td>
-                                <td><input type="button" class="btn btn-danger" ng-click="deleteItem(i.item_type, i.id);" value="{% trans "Delete" %}"></input></td>
-                            </tr>
-                        </table>
+                <div class="col-xs-12 col-md-6">
+                    <h2>{% trans "Info items" %}</h2>
+                    <div>{% trans "Infoitems available for rotations" %}</div>
+                    <table class="table table-striped">
+                        <tr>
+                            <th>{% trans "Item" %}</th>
+                            <th>{% trans "Type" %}</th>
+                            <th>{% trans "Delete" %}</th>
+                        </tr>
+                        <tr ng-repeat="i in infoitems | orderBy:['display_name','name']">
+                            <td>{$ i.name $}</td>
+                            <td>{$ i.display_name $}</td>
+                            <td><input type="button" class="btn btn-danger" ng-click="deleteItem(i.item_type, i.id);" value="{% trans "Delete" %}"></input></td>
+                        </tr>
+                    </table>
 
-                    </div>
-
-                    <div class="col-xs-12 col-md-6">
-                        <h2>{% trans "Rotation" %}: {$ selected_rot.name $}<a href="/infoscreen/{$ selected_rot.id $}"><input type="button" class="btn btn-primary pull-right" value="{% trans "Preview" %}"></a></h2>
-                        <div>{% trans "Instances in currently selected rotation" %}:</div>
-                        <table class="table table-striped">
-                            <tr>
-                                <th>{% trans "Instance" %}</th>
-                                <th>{% trans "Duration" %}</th>
-                                <th>{% trans "Delete" %}</th>
-                            </tr>
-                            <tr ng-repeat="i in selected_rot.instances">
-                                <td>{$ i.item.name $}</td><td>{$ i.duration $} s</td>
-                                <td><input type="button" ng-click="deleteInstance(i.id);" value="{% trans "Delete" %}" class="btn btn-danger"></input></td>
-                            </tr>
-                        </table>
-                    </div>
                 </div>
-                <div id="deleterot" class="tab-pane">
-                    <div class="col-xs-12 " ng-controller="infoadmin_ctrl">
-                        <h2>{% trans "Rotations" %}</h2>
-                        <div>
-                            {% trans "Select rotation to edit" %}:
-                        </div>
-                        <table class="table table-striped">
-                            <tr>
-                                <th>{% trans "Rotation" %}</th>
-                                <th>{% trans "id" %}</th>
-                                <th>{% trans "Preview" %}</th>
-                                <th>{% trans "Delete" %}</th>
-                            </tr>
-                            <tr ng-repeat="r in rotations">
-                                <td>{$ r.name $}</td>
-                                <td>{$ r.id $}</td>
-                                <td><a href="/infoscreen/{$ r.id $}"><input type="button" class="btn btn-primary" value="{% trans "Preview" %}"></a></td>
-                                <td><input type="button" class="btn btn-danger" ng-click="deleteRotation(r.id)" value="{% trans "Delete" %}"></input></td>
-                            </tr>
-                            <tr>
-                                <td><input type="text" class="form-control" ng-model="r.name" placeholder="{% trans "Name" %}"></input></td>
-                                <td><input type="button" class="btn btn-success" ng-click="createRotation(r.name)" value="{% trans "Create new" %}"></input></td>
-                                <td></td>
-                                <td></td>
-                            </tr>
-                        </table>
-                    </div>
-                </div>
-            </div>
-            <div style="margin-top: 100px;">
-                {% include "footer.html" %}
             </div>
         </div>
-    </body>
-</html>
+        <div id="rotations" class="tab-pane" ng-controller="infoadmin_ctrl">
+            <div class="col-xs-12 col-md-6">
+                <h2>{% trans "Info items" %}</h2>
+                <div>{% trans "Infoitems available for rotations" %}</div>
+                <table class="table table-striped">
+                    <tr>
+                        <th>{% trans "Item" %}</th>
+                        <th>{% trans "Type" %}</th>
+                        <th>{% trans "Set duration" %}</th>
+                        <th>{% trans "Add to rotation" %}</th>
+                        <th>{% trans "Delete" %}</th>
+                    </tr>
+                    <tr ng-repeat="i in infoitems | orderBy:['display_name','name']">
+                        <td>{$ i.name $}</td>
+                        <td>{$ i.display_name $}</td>
+                        <td><input type="number" min="1" max="60" class="form-control" ng-model="i.duration"></input></td>
+                        <td><input type="button" class="btn btn-success" ng-click="createInstance(selected_rot.id, i.id, i.item_type, i.duration);" value="{% trans "Add" %}"></input></td>
+                        <td><input type="button" class="btn btn-danger" ng-click="deleteItem(i.item_type, i.id);" value="{% trans "Delete" %}"></input></td>
+                    </tr>
+                </table>
+
+            </div>
+
+            <div class="col-xs-12 col-md-6">
+                <h2>{% trans "Rotation" %}: {$ selected_rot.name $}<a href="/infoscreen/{$ selected_rot.id $}"><input type="button" class="btn btn-primary pull-right" value="{% trans "Preview" %}"></a></h2>
+                <div>{% trans "Instances in currently selected rotation" %}:</div>
+                <table class="table table-striped">
+                    <tr>
+                        <th>{% trans "Instance" %}</th>
+                        <th>{% trans "Duration" %}</th>
+                        <th>{% trans "Delete" %}</th>
+                    </tr>
+                    <tr ng-repeat="i in selected_rot.instances">
+                        <td>{$ i.item.name $}</td><td>{$ i.duration $} s</td>
+                        <td><input type="button" ng-click="deleteInstance(i.id);" value="{% trans "Delete" %}" class="btn btn-danger"></input></td>
+                    </tr>
+                </table>
+            </div>
+        </div>
+        <div id="deleterot" class="tab-pane">
+            <div class="col-xs-12 " ng-controller="infoadmin_ctrl">
+                <h2>{% trans "Rotations" %}</h2>
+                <div>
+                    {% trans "Select rotation to edit" %}:
+                </div>
+                <table class="table table-striped">
+                    <tr>
+                        <th>{% trans "Rotation" %}</th>
+                        <th>{% trans "id" %}</th>
+                        <th>{% trans "Preview" %}</th>
+                        <th>{% trans "Delete" %}</th>
+                    </tr>
+                    <tr ng-repeat="r in rotations">
+                        <td>{$ r.name $}</td>
+                        <td>{$ r.id $}</td>
+                        <td><a href="/infoscreen/{$ r.id $}"><input type="button" class="btn btn-primary" value="{% trans "Preview" %}"></a></td>
+                        <td><input type="button" class="btn btn-danger" ng-click="deleteRotation(r.id)" value="{% trans "Delete" %}"></input></td>
+                    </tr>
+                    <tr>
+                        <td><input type="text" class="form-control" ng-model="r.name" placeholder="{% trans "Name" %}"></input></td>
+                        <td><input type="button" class="btn btn-success" ng-click="createRotation(r.name)" value="{% trans "Create new" %}"></input></td>
+                        <td></td>
+                        <td></td>
+                    </tr>
+                </table>
+            </div>
+        </div>
+    </div>
+    <div style="margin-top: 100px;">
+        {% include "footer.html" %}
+    </div>
+</div>
+{% endblock body %}
\ No newline at end of file
diff --git a/infoscreen/templates/infoscreen_index.html b/infoscreen/templates/infoscreen_index.html
index 58c37e2..820a1a3 100644
--- a/infoscreen/templates/infoscreen_index.html
+++ b/infoscreen/templates/infoscreen_index.html
@@ -1,29 +1,25 @@
+{% extends "infoscreen:base.html" %}
 {% load static %}
+{% load i18n %}
 
-<!DOCTYPE html>
-<html ng-app="infoApp">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
+{% block appname %}infoApp{% endblock appname %}
 
-        <title>Infoscreen</title>
-        <script src="{% static "js/lib/moment.js" %}"></script>
-        <script src="{% static "js/lib/angular.js" %}"></script>
-        <script src="{% static "js/lib/angular-route.js" %}"></script>
-        <script src="{% static "js/lib/angular-animate.js" %}"></script>
-        <script src="{% static "js/lib/jquery-3.1.0.min.js" %}"></script>
-        <script src="{% static "js/lib/bootstrap.min.js" %}"></script>
-        <script src="{% static "js/lib/underscore-min.js" %}"></script>
-        <script src="{% static "js/infoscreen_controllers.js" %}"></script>
+{% block title %}
+{% trans "Infoscreen" %}
+{% endblock title %}
 
-        <link rel="stylesheet" href="{% static "css/lib/bootstrap.min.css" %}"></link>
-        <link rel="stylesheet" href="{% static "css/infoscreen.css" %}"></link>
-    </head>
-    <body>
-        <div class="container ng-scope" ng-controller="infoscreen_main" ng-init="init({{ rotation }})">
-            <div ng-animate-swap="index" class="cell swap-animation">
-                <div id="infocontent" ng-include="active.template" onload="active.onload()"></div>
-            </div>
-        </div>
-    </body>
-</html>
+{% block controllers %}
+<script src="{% static "js/infoscreen_controllers.js" %}"></script>
+{% endblock controllers %}
+
+{% block styles %}
+<link rel="stylesheet" href="{% static "css/infoscreen.css" %}"></link>
+{% endblock styles %}
+
+{% block body %}
+<div class="container ng-scope" ng-controller="infoscreen_main" ng-init="init({{ rotation }})">
+    <div ng-animate-swap="index" class="cell swap-animation">
+        <div id="infocontent" ng-include="active.template" onload="active.onload()"></div>
+    </div>
+</div>
+{% endblock body %}
\ No newline at end of file
diff --git a/infoscreen/urls.py b/infoscreen/urls.py
index 5a16fe7..8236b00 100644
--- a/infoscreen/urls.py
+++ b/infoscreen/urls.py
@@ -1,6 +1,7 @@
 """File containing infoscreen urls."""
 
 from django.conf.urls import url
+from django.conf import settings
 
 from infoscreen.views import index
 from infoscreen.views import admin
@@ -52,5 +53,8 @@ urlpatterns = [
     url(r'^hsl_data$', CurrentHSLView),
     url(r'^hsl_data/settings$', hsl_timetable_settings),
     url(r'^apyjson', get_apy_json),
-
 ]
+
+if settings.DEBUG:
+    from django.contrib.staticfiles.urls import staticfiles_urlpatterns
+    urlpatterns += staticfiles_urlpatterns()
diff --git a/kaehmy/forms.py b/kaehmy/forms.py
index d8440c4..8947bd9 100644
--- a/kaehmy/forms.py
+++ b/kaehmy/forms.py
@@ -5,6 +5,7 @@ from django.core.exceptions import ValidationError
 from kaehmy.models import PresetRole, CustomRole, Application, Comment
 from webapp.models import BaseRole
 
+
 class CheckboxSelectMultiple(forms.widgets.CheckboxSelectMultiple):
     option_template_name = 'checkbox_option.html'
 
@@ -86,4 +87,4 @@ class CommentForm(forms.ModelForm):
 
     class Meta:
         model = Comment
-        fields = ['name', 'email', 'message', 'parent']
\ No newline at end of file
+        fields = ['name', 'email', 'message', 'parent']
diff --git a/kaehmy/static/css/base.css b/kaehmy/static/css/base.css
new file mode 100644
index 0000000..710269e
--- /dev/null
+++ b/kaehmy/static/css/base.css
@@ -0,0 +1,35 @@
+.page-content {
+    margin-top: 1vh;
+    width: 90%;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+body {
+    max-width: 1000px;
+    margin-left: auto !important;
+    margin-right: auto !important;
+}
+
+div.tooltip-inner {
+    max-width: 25rem;
+}
+
+.tooltip {
+    margin-left: 1rem;
+}
+
+.role-filter-form {
+    max-width: 30rem;
+    width: auto;
+    margin-bottom: 1rem;
+}
+
+.kaehmy-content {
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+}
+
+p {
+    overflow-wrap: break-word;
+}
\ No newline at end of file
diff --git a/kaehmy/static/css/footer.css b/kaehmy/static/css/footer.css
new file mode 100644
index 0000000..bf63819
--- /dev/null
+++ b/kaehmy/static/css/footer.css
@@ -0,0 +1,34 @@
+#footer-div {
+    height:10vh;
+}
+
+footer {
+    /* position: absolute; */
+    bottom: 0;
+    width: 100%;
+    height: 60px; /* Set the fixed height of the footer here */
+    /* line-height: 60px; /* Vertically center the text there */ */
+    margin-top: 2rem;
+    margin-bottom: 1rem;
+}
+
+footer .container .col .nav .nav-item {
+    display: inline-block;
+    margin-right: 3vh;
+}
+
+.lang-button {
+    height: 4vh;
+    width: 6vh;
+    margin-left: 1vh;
+    margin-right: 1vh;
+}
+
+.lang-select {
+    width: 10rem;
+    display: inline-block;
+}
+
+footer .lang-form {
+    margin: 1rem auto 0;
+}
diff --git a/kaehmy/static/css/header.css b/kaehmy/static/css/header.css
new file mode 100644
index 0000000..4e20d7e
--- /dev/null
+++ b/kaehmy/static/css/header.css
@@ -0,0 +1,37 @@
+.header-content {
+
+}
+
+.header-content .logo {
+
+}
+
+.header-content .logo img {
+    display: block;
+    height: auto;
+    margin: auto;
+}
+
+.kaehmy-banner {
+    max-width: 1000px;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+@media screen and (min-width: 1000px) {
+    .kaehmy_header-content {
+        position: absolute;
+        left: 0;
+        top: 0;
+        background-color: #052f5f;
+        width: 100%;
+    }
+
+    .kaehmy_header {
+        margin-bottom: 331px;
+    }
+}
+
+.kaehmy-banner-image {
+    width: 100%;
+}
diff --git a/kaehmy/static/css/nav.css b/kaehmy/static/css/nav.css
new file mode 100644
index 0000000..ee7db33
--- /dev/null
+++ b/kaehmy/static/css/nav.css
@@ -0,0 +1,11 @@
+.kaehmy_navigation {
+    margin-bottom: 10px;
+}
+
+.navbar-border {
+    border-bottom: 2px solid #282b3b;
+}
+
+.navbar-light .navbar-nav .nav-link {
+    color: black;
+}
diff --git a/kaehmy/static/css/readme.md b/kaehmy/static/css/readme.md
new file mode 100644
index 0000000..e69de29
diff --git a/kaehmy/templates/base.html b/kaehmy/templates/base.html
index c3fdd28..4e66d42 100644
--- a/kaehmy/templates/base.html
+++ b/kaehmy/templates/base.html
@@ -3,6 +3,10 @@
 {% load static %}
 {% load i18n %}
 
+{% block styles %}
+<link rel="stylesheet" href="{% static "css/base.css" %}">
+{% endblock styles %}
+
 {% block body %}
 
 {% block header %}
diff --git a/kaehmy/templates/navigation.html b/kaehmy/templates/navigation.html
index 6b10bf7..7655ba9 100644
--- a/kaehmy/templates/navigation.html
+++ b/kaehmy/templates/navigation.html
@@ -1,6 +1,7 @@
 {% load i18n %}
+{% load static %}
 
-<link rel="stylesheet" href="/static/css/kaehmy_nav.css">
+<link rel="stylesheet" href="{% static "css/nav.css" %}">
 <div class="kaehmy_navigation">
     <nav class="navbar-border navbar navbar-toggleable-md navbar-light bg-faded">
         <div class="navbar-nav">
diff --git a/kaehmy/urls.py b/kaehmy/urls.py
index 8f32c7d..e385559 100644
--- a/kaehmy/urls.py
+++ b/kaehmy/urls.py
@@ -1,7 +1,8 @@
 """Kaehmy urls."""
 
 from django.conf.urls import url
-# from django.utils.translation import ugettext_lazy as _
+from django.conf import settings
+from django.utils.translation import ugettext_lazy as _
 
 from kaehmy.views import view
 from kaehmy.views import list_view
@@ -19,3 +20,7 @@ urlpatterns = [
     url(r'^export', export_view),
     url(r'^$', list_view),
 ]
+
+if settings.DEBUG:
+    from django.contrib.staticfiles.urls import staticfiles_urlpatterns
+    urlpatterns += staticfiles_urlpatterns()
diff --git a/members/urls.py b/members/urls.py
index 707571e..8afeebb 100644
--- a/members/urls.py
+++ b/members/urls.py
@@ -1,6 +1,7 @@
 """File containing Member application URLs."""
 
 from django.conf.urls import url
+from django.conf import settings
 from django.contrib.auth.decorators import login_required, permission_required
 from django.views.generic.base import RedirectView
 
@@ -131,3 +132,7 @@ urlpatterns = [
 
     url(r'^check', CheckByEmail.as_view())
 ]
+
+if settings.DEBUG:
+    from django.contrib.staticfiles.urls import staticfiles_urlpatterns
+    urlpatterns += staticfiles_urlpatterns()
diff --git a/static/css/base.css b/static/css/base.css
deleted file mode 100644
index 5f36203..0000000
--- a/static/css/base.css
+++ /dev/null
@@ -1,5 +0,0 @@
-.logout-button {
-    float: right;
-    margin-top: 10px;
-    margin-right: 30px;
-}
diff --git a/templates/project.html b/templates/project.html
index 16299ec..690ba73 100644
--- a/templates/project.html
+++ b/templates/project.html
@@ -6,6 +6,7 @@
 
 <html>
     <head>
+        {% block head %}
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
         <meta name="description" content="Aalto-yliopiston Sähköinsinöörikilta ry">
@@ -29,6 +30,11 @@
             console.log('pippeli')
         })
         </script>
+
+        {% block styles %}
+        {% endblock styles %}
+
+        {% endblock head %}
     </head>
     <body>
         {% block body %}
diff --git a/webapp/templates/ohlhafv/base.html b/webapp/templates/ohlhafv/base.html
index f65d6c6..9bd93b6 100644
--- a/webapp/templates/ohlhafv/base.html
+++ b/webapp/templates/ohlhafv/base.html
@@ -3,7 +3,6 @@
 {% load static %}
 {% load i18n %}
 
-
 {% block header %}
     <link rel="stylesheet" href="/static/css/ohlhafv/base.css">
     {% include "ohlhafv/header.html" %}
diff --git a/webapp/urls.py b/webapp/urls.py
index 33ac14d..23067db 100644
--- a/webapp/urls.py
+++ b/webapp/urls.py
@@ -1,7 +1,8 @@
 """Webapp urls."""
 
 from django.conf.urls import url
-# from django.utils.translation import ugettext_lazy as _
+from django.conf import settings
+from django.utils.translation import ugettext_lazy as _
 
 from webapp.views import main_index
 from webapp.views import login_view
@@ -45,3 +46,8 @@ urlpatterns = [
     url(r'^ohlhafv/list', ohlhafv_list),
     url(r'^ohlhafv', ohlhafv_view),
 ]
+
+
+if settings.DEBUG:
+    from django.contrib.staticfiles.urls import staticfiles_urlpatterns
+    urlpatterns += staticfiles_urlpatterns()
diff --git a/webapp/views.py b/webapp/views.py
index 2c38347..e4ef5aa 100644
--- a/webapp/views.py
+++ b/webapp/views.py
@@ -170,4 +170,4 @@ def ohlhafv_list(request, *args, **kwargs):
         'challenges': challenges,
         'challenge_count': len(challenges),
     }
-    return render(request, 'ohlhafv/list.html', context)
\ No newline at end of file
+    return render(request, 'ohlhafv/list.html', context)
