diff --git a/.gitignore b/.gitignore
index 2bbdbfe..1141f09 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,3 @@
 .direnv
 result
+public
diff --git a/config.toml b/config.toml
new file mode 100644
index 0000000..c758f30
--- /dev/null
+++ b/config.toml
@@ -0,0 +1,17 @@
+# The URL the site will be built for
+base_url = "https://sondell.org"
+
+# Whether to automatically compile all Sass files in the sass directory
+compile_sass = false
+
+# Whether to build a search index to be used later on by a JavaScript library
+build_search_index = false
+
+[markdown]
+# Whether to do syntax highlighting
+# Theme can be customised by setting the `highlight_theme` variable to a theme supported by Zola
+highlight_code = true
+
+[extra]
+# Put all your custom variables here
+icon = "icon"
diff --git a/content/_index.md b/content/_index.md
new file mode 100644
index 0000000..e650c31
--- /dev/null
+++ b/content/_index.md
@@ -0,0 +1,5 @@
++++
+title = "Selfhosted Services"
++++
+
+
diff --git a/content/nextcloud/_index.md b/content/nextcloud/_index.md
new file mode 100644
index 0000000..2dcff85
--- /dev/null
+++ b/content/nextcloud/_index.md
@@ -0,0 +1,10 @@
++++
+title = "Nextcloud"
+[extra]
+icon ="./nextcloud_icon_14.png"
++++
+
+Nextcloud is a suite of client-server software for creating and using file
+hosting services. Our nextcloud server is integrated with OnlyOffice and can
+provide functionality similar to Dropbox, Office 365 or Google Drive.
+
diff --git a/content/nextcloud/footer/1desktop.md b/content/nextcloud/footer/1desktop.md
new file mode 100644
index 0000000..d07da1e
--- /dev/null
+++ b/content/nextcloud/footer/1desktop.md
@@ -0,0 +1,7 @@
++++
+title = "googleplay"
++++
+
+<a class="app-link desktop" href="https://www.onlyoffice.com/download-desktop.aspx#desktop">
+  <p>Desktop App</p>
+</a>
diff --git a/content/nextcloud/footer/_index.md b/content/nextcloud/footer/_index.md
new file mode 100644
index 0000000..f05d887
--- /dev/null
+++ b/content/nextcloud/footer/_index.md
@@ -0,0 +1,21 @@
++++
+title= "footer"
+template ="footer.html"
+sort_by = "slug"
++++
+
+#### Get Started
+
+<p>
+Download the app for your device and login with the server adress:
+<code class="link">
+  https://cloud.sondell.org/
+</code>
+<button class="url" _="on click
+    writeText(my previousElementSibling's innerText) into navigator's clipboard
+    put 'copied!' into me
+    wait 1s
+    put 'copy url' into me">
+  copy url
+</button>
+</p>
diff --git a/content/nextcloud/footer/googleplay.md b/content/nextcloud/footer/googleplay.md
new file mode 100644
index 0000000..cca3da4
--- /dev/null
+++ b/content/nextcloud/footer/googleplay.md
@@ -0,0 +1,10 @@
++++
+title = "googleplay"
++++
+
+<a class="app-link" href="https://play.google.com/store/apps/details?id=com.nextcloud.client" rel="nofollow">
+  <img src="./googleplay-trim.png" alt="Download from Google Play" height="40"
+    data-canonical-src="https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png"
+    style="max-width: 100%;">
+</a>
+
diff --git a/content/nextcloud/footer/ios.md b/content/nextcloud/footer/ios.md
new file mode 100644
index 0000000..0996404
--- /dev/null
+++ b/content/nextcloud/footer/ios.md
@@ -0,0 +1,12 @@
++++
+title = "ios store"
++++
+
+<a class="app-link" href="https://itunes.apple.com/us/app/nextcloud/id1125420102" rel="nofollow">
+  <img
+    src="https://camo.githubusercontent.com/c4395f930c17c2f878dbd98b55d461375f6feb7a998e0ac6e3be2376b8429b8a/68747470733a2f2f646576656c6f7065722e6170706c652e636f6d2f6173736574732f656c656d656e74732f6261646765732f646f776e6c6f61642d6f6e2d7468652d6170702d73746f72652e737667"
+    alt="the Nextcloud iOS files app" height="40"
+    data-canonical-src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
+    style="max-width: 100%;">
+</a>
+
diff --git a/content/nextcloud/footer/webapp.md b/content/nextcloud/footer/webapp.md
new file mode 100644
index 0000000..020a96b
--- /dev/null
+++ b/content/nextcloud/footer/webapp.md
@@ -0,0 +1,9 @@
++++
+title = "googleplay"
++++
+
+<a class="app-link" href="https://cloud.sondell.org" rel="nofollow">
+  <img src="./pwa-badge.png" alt="Demo of the Nextcloud iOS files app" height="40"
+    data-canonical-src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
+    style="max-width: 100%;">
+</a>
diff --git a/content/oldnext.md b/content/oldnext.md
new file mode 100644
index 0000000..b141b1b
--- /dev/null
+++ b/content/oldnext.md
@@ -0,0 +1,11 @@
++++
+title = "Nextcloud"
+[extra]
+icon ="./nextcloud_icon_14.png"
++++
+
+<p class="text">
+Nextcloud is a suite of client-server software for creating and using file
+hosting services. Our nextcloud server is integrated with OnlyOffice and can
+provide functionality similar to Dropbox, Office 365 or Google Drive.
+</p>
diff --git a/flake.nix b/flake.nix
index d806910..fb73cd9 100644
--- a/flake.nix
+++ b/flake.nix
@@ -27,6 +27,7 @@
           dev_serve
           imagemagick
           ffmpeg
+          zola
         ];
       };
     });
diff --git a/templates/base.html b/templates/base.html
new file mode 100644
index 0000000..11dab0c
--- /dev/null
+++ b/templates/base.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <script src="https://unpkg.com/hyperscript.org@0.9.12"></script>
+  <link rel="stylesheet" href="./style.css">
+  <title>Sondell</title>
+</head>
+
+<body>
+  {% block content %} 
+  {% endblock %}
+</body>
+
+</html>
diff --git a/templates/footer.html b/templates/footer.html
new file mode 100644
index 0000000..7d7e489
--- /dev/null
+++ b/templates/footer.html
@@ -0,0 +1,5 @@
+{% extends "base.html" %}
+
+{% block content %}
+
+{% endblock content %}
diff --git a/templates/index.html b/templates/index.html
new file mode 100644
index 0000000..957be60
--- /dev/null
+++ b/templates/index.html
@@ -0,0 +1,32 @@
+{% extends "base.html" %}
+
+{% block content %}
+<h1 class="title">
+	Selfhosted Services
+</h1>
+
+<ul class="list">
+	{% for card_path in section.subsections %}
+	{% set card = get_section(path=card_path) %}
+	<div class="card trunc" _="on click toggle .trunc on me">
+		<img class="icon" src="{{ card.extra.icon }}">
+		<h2> {{ card.title }} </h2>
+		<p class="text">
+			{{ card.content | markdown(inline=true) | safe }}
+		</p>
+		<div class="footer" _="on click halt the event's bubbling">
+			{% set footer = get_section(path=card.subsections[0]) %}
+			{{ footer.content | markdown(inline=true) | safe }}
+		<div>
+		{% for page in footer.pages %}
+		{{ page.content | markdown(inline=true) | safe }}
+		{% endfor %}
+		</div>
+
+		</div>
+	</div>
+	{% endfor %}
+</ul>
+
+
+{% endblock content %}