diff --git a/static/css/muistox.css b/static/css/muistox.css
index 28d6177..4bec60f 100644
--- a/static/css/muistox.css
+++ b/static/css/muistox.css
@@ -1,3 +1,11 @@
 body {
 	font: 400 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
+}
+
+.uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle {
+	min-height: 50px;
+}
+
+.uk-breadcrumb>:nth-child(n+2):not(.uk-first-column)::before {
+    margin: 0 10px 0 calc(10px - 4px);
 }
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
index 943b7c4..7650c63 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -5,6 +5,11 @@
     {% load static %}
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <!-- UIkit CSS -->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.21.16/dist/css/uikit.min.css" />
+    <!-- UIkit JS -->
+    <script src="https://cdn.jsdelivr.net/npm/uikit@3.21.16/dist/js/uikit.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/uikit@3.21.16/dist/js/uikit-icons.min.js"></script>
     <!-- Muistox CSS -->
     <link href="{% static 'css/muistox.css' %}" rel="stylesheet">
     <link rel="shortcut icon" type="image/png" href="{% static 'favicon.ico' %}" />
@@ -13,11 +18,76 @@
 
 <body>
 
+        <!-- Parallax -->
+        {% block parallax %}
+        {% endblock %}
+
+        <!-- Navbar -->
+        {% block navbar %}
+        <div uk-sticky="sel-target: .uk-navbar-container; cls-active: uk-navbar-sticky;">
+            <nav class="uk-navbar-container" uk-navbar>
+                <div class="uk-navbar-left uk-margin-left">
+                    <ul class="uk-navbar-nav">
+                        <li><a href="{% url 'gallery:main_url' %}"><span uk-icon="camera"></span></a></li>
+                        <li class="uk-visible@m"><a href="">Albums</a></li>
+                        <li class="uk-visible@m"><a href="">Photostream</a></li>
+                    </ul>
+                </div>
+                <div class="uk-navbar-right uk-margin-right">
+                    <ul class="uk-navbar-nav">
+                        <li class="uk-visible@m"><a href="#">Contact</a></li>
+                        {% if user.is_authenticated %}
+                        <li class="uk-visible@m"><a href="{% url 'admin:index' %}">Admin</a></li>
+                        {% endif %}
+                        <li class="uk-hidden@m"><a class="uk-navbar-toggle" uk-navbar-toggle-icon uk-toggle="target: #offcanvas-nav"></a></li>
+                    </ul>
+                </div>
+            </nav>
+        </div>
+        
+        <!-- Navbar mobile -->
+        <div id="offcanvas-nav" uk-offcanvas="flip: true; overlay: true">
+            <div class="uk-offcanvas-bar">
+                <button class="uk-offcanvas-close" type="button" uk-close></button>
+                <ul class="uk-nav uk-nav-default">
+                    <li><a href="{% url 'gallery:main_url' %}">Home</a></li>
+                    <li><a href="">Albums</a></li>
+                    <li><a href="">Photostream</a></li>
+                    <li><a href="#">Contact</a></li>
+                    {% if user.is_authenticated %}
+                    <li><a href="{% url 'admin:index' %}">Admin</a></li>
+                    {% endif %}
+                </ul>
+            </div>
+        </div>
+        {% endblock %}
+    
+    <!-- Header -->
+    <header class="uk-align-center uk-container-large">
+        <!-- Breadcrumb -->
+        <nav class="uk-flex uk-flex-between uk-margin-small-top uk-margin-small-bottom" aria-label="Breadcrumb">
+            <div class="uk-margin-left">
+                <ul class="uk-breadcrumb">
+                    <li><a href="{% url 'gallery:main_url' %}">Home</a></li>
+                    {% block breadcrumb %}{% endblock %}
+                </ul>
+            </div>
+            <div class="uk-margin-right">
+                Right
+            </div>
+        </nav>
+    </header>
+
     <!-- Main -->
     <main class="uk-align-center uk-container-large">
         {% block content %} No Content {% endblock %}
     </main> 
 
+    <!-- Footer -->
+    <footer class="uk-align-center uk-container-large uk-text-center uk-text-light">
+        &copy; {% now "Y" %} Nyymix, powered by <a href="https://git.hakkeri.net/nyymix/muistox">muistox</a>.
+    </footer>   
+
     <!-- Muistox JS -->
     <script src="{% static 'js/muistox.js' %}" type="text/javascript"></script>
 
