diff --git a/content/it.md b/content/it.md
deleted file mode 100644
index 2989190..0000000
--- a/content/it.md
+++ /dev/null
@@ -1,22 +0,0 @@
-+++
-title = "IT"
-description = "IT Services and Consulting"
-weight = 3
-+++
-
-## self hosting vs managed hosting
-
-I offer both...
-
-## office needs
-- collaboration platform
-- teams chat
-- cloud storage
-- email
-- internal web
-
-## Servers
-- Databases
-- gp-servers
-- backups
-- nas
diff --git a/content/it/_index.md b/content/it/_index.md
new file mode 100644
index 0000000..4d09136
--- /dev/null
+++ b/content/it/_index.md
@@ -0,0 +1,41 @@
++++
+title = "IT"
+description = "IT Services and Consulting"
+weight = 3
+template="it_section.html"
+[extra]
+intro = "derp"
++++
+
+
+# For the office
+
+
+Nextcloud is a opensource client-server ecosystem for cloudstorage and collaboration.
+The nextcloud server can be integrated with OnlyOffice and can provide functionality similar to office365.
+
+
+
+
+
+
+
+
+
+
+<!-- ## self hosting vs managed hosting -->
+
+<!-- I offer both... -->
+
+<!-- ## office needs -->
+<!-- - collaboration platform -->
+<!-- - teams chat -->
+<!-- - cloud storage -->
+<!-- - email -->
+<!-- - internal web -->
+
+<!-- ## Servers -->
+<!-- - Databases -->
+<!-- - gp-servers -->
+<!-- - backups -->
+<!-- - nas -->
diff --git a/content/it/nextcloud.md b/content/it/nextcloud.md
new file mode 100644
index 0000000..6202b9d
--- /dev/null
+++ b/content/it/nextcloud.md
@@ -0,0 +1,38 @@
++++
+title = "IT"
+description = "IT Services and Consulting"
+weight = 3
++++
+
+
+# For the office
+
+
+Nextcloud is a opensource client-server ecosystem for cloudstorage and collaboration.
+The nextcloud server can be integrated with OnlyOffice and can provide functionality similar to office365.
+
+
+
+
+
+
+
+
+
+
+<!-- ## self hosting vs managed hosting -->
+
+<!-- I offer both... -->
+
+<!-- ## office needs -->
+<!-- - collaboration platform -->
+<!-- - teams chat -->
+<!-- - cloud storage -->
+<!-- - email -->
+<!-- - internal web -->
+
+<!-- ## Servers -->
+<!-- - Databases -->
+<!-- - gp-servers -->
+<!-- - backups -->
+<!-- - nas -->
diff --git a/templates/it_section.html b/templates/it_section.html
new file mode 100644
index 0000000..df926aa
--- /dev/null
+++ b/templates/it_section.html
@@ -0,0 +1,45 @@
+{% import "_macros.html" as macros %}
+{% extends "index.html" %}
+
+{% block title %}{{ section.title }} | {{ super() }} {% endblock title %}
+
+{% block header %}
+<header class="box-shadow">
+  {% if lang =="en" %}
+  {% set path = [""] | concat(with=section.components) | join(sep="/") %}
+  {% else %}
+  {% set path = [""] | concat(with=section.components | slice(start=1)) | join(sep="/") %}
+  {% endif %}
+
+  {{ macros::render_header(path=path) }}
+</header>
+
+{% endblock header %}
+
+
+{% block content %}
+
+<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 %}
\ No newline at end of file
diff --git a/templates/null.html b/templates/null.html
new file mode 100644
index 0000000..387b8e0
--- /dev/null
+++ b/templates/null.html
@@ -0,0 +1,5 @@
+{% extends "index.html" %}
+
+{% block content %}
+
+{% endblock content %}
\ No newline at end of file