diff --git a/static/css/main.css b/static/css/main.css
new file mode 100644
index 0000000..9090c56
--- /dev/null
+++ b/static/css/main.css
@@ -0,0 +1,278 @@
+:root {
+    --lg-breakpoint: 1280px;
+    --lightred: color-mix(in srgb, var(--red), white 85%);
+}
+
+html {
+    height: 100%;
+}
+body {
+    height: 100%;
+    padding: 0px;
+    margin: 0 auto;
+}
+
+@media screen and (min-width: 769px) {
+    body {
+        display: grid;
+        grid-template:
+            [row1-start] "header header header" 50px [row1-end]
+            [row2-start] "main main aside" auto [row2-end]
+            [row3-start] "history activity member" auto [row3-end]
+            [row4-start] "footer footer footer" 50px [row4-end];
+        gap: 5px;
+    }
+}
+
+body > header {
+    grid-column: 1 / span 3;
+    grid-row: first-line;
+    grid-area: header;
+    display: flex;
+    margin: 0;
+}
+
+body > header menu {
+    display: flex;
+    list-style: none;
+    margin: 0;
+}
+
+main {
+    grid-area: main;
+}
+
+aside {
+    grid-area: aside;
+}
+
+section.activity {
+    grid-area: activity;
+}
+
+section.history {
+    grid-area: history;
+}
+
+section.member {
+    grid-area: member;
+}
+
+section + section {
+    margin-top: 5px;
+}
+
+body > header {
+    align-items: center;
+}
+
+body > footer {
+    grid-area: footer;
+    align-self: end;
+    margin: 0;
+    font-size: small;
+}
+
+body > header {
+    background-color: black;
+    color: white;
+    padding: 0.5em;
+    height: 50px;
+}
+
+body > header a,
+body > header a:visited {
+    color: white;
+    height: 44px;
+    margin-left: 0;
+}
+
+body > header a:hover {
+    color: white;
+}
+
+body > header input {
+    display: none !important;
+}
+
+body > header a img {
+    height: 44px;
+}
+
+main,
+section {
+    padding: 0.5em;
+}
+
+.menu-button {
+    position: relative;
+    width: 20px;
+    top: -4px;
+    height: 3px;
+    background: white;
+    display: inline-block;
+}
+.menu-button:before,
+.menu-button:after {
+    position: absolute;
+    display: block;
+    content: "";
+    background: white;
+    width: 20px;
+    height: 3px;
+}
+
+.menu-button:before {
+    top: 8px;
+}
+.menu-button:after {
+    top: -8px;
+}
+
+@media screen and (min-width: 769px) {
+    header menu {
+        flex-grow: 1;
+        padding-left: 0;
+    }
+    header menu li {
+        padding-left: 1em;
+    }
+    header menu li:last-child {
+        text-align: right;
+        padding: 0;
+        flex-grow: 1;
+    }
+
+    body {
+        max-width: 1280px;
+    }
+
+    .menu-button {
+        visibility: hidden;
+    }
+
+    div.split {
+        display: flex;
+    }
+
+    div.split > div.column {
+        width: 50%;
+    }
+
+    div.column:first-child {
+        padding-right: 0.5em;
+    }
+
+    div.column + div.column {
+        padding-left: 0.5em;
+    }
+
+}
+
+@media screen and (max-width: 768px) {
+    body {
+        grid-template:
+            [row1-start] "header" 50px [row1-end]
+            [row2-start] "main" auto [row2-end]
+            [row2-start] "aside" auto [row2-end]
+            [row3-start] "footer" 50px [row3-end];
+    }
+
+    .menu-button {
+        visibility: visible;
+    }
+
+    header {
+        justify-content: space-between;
+    }
+
+    body > header menu {
+        display: none;
+        padding: 0.2em;
+    }
+
+    body > header menu li {
+        padding: 0.2em;
+    }
+
+    body > header label[for="menu-control"] {
+        padding: 0.2em 0.5em;
+        border-radius: 3px;
+    }
+
+    body > header label[for="menu-control"]:hover {
+        background-color: grey;
+    }
+
+    header input[name="menu-control"]:checked ~ menu {
+        background-color: black;
+        position: absolute;
+        right: 0;
+        top: 50px;
+        display: block;
+        width: 150px;
+    }
+
+    header input[name="menu-control"]:checked ~ label .menu-button {
+        background-color: black;
+    }
+    header input[name="menu-control"]:checked ~ label:hover .menu-button {
+        background-color: grey;
+    }
+
+    header input[name="menu-control"]:checked ~ label .menu-button:before {
+        transform: rotate3d(0, 0, 1, 45deg);
+        top: 0;
+    }
+
+    header input[name="menu-control"]:checked ~ label .menu-button:after {
+        transform: rotate3d(0, 0, 1, -45deg);
+        top: 0;
+    }
+}
+
+section.newsitem {
+    border: 1px solid var(--lightred);
+    padding: 0;
+    border-radius: 5px;
+}
+
+section.newsitem > p,
+section.newsitem > a {
+    padding: 0.5em;
+}
+
+section.newsitem header {
+    padding: 0.3em;
+    margin-bottom: 0;
+    background-color: var(--lightred);
+    color: var(--red);
+    height: 2em;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+}
+
+section.newsitem header a {
+    color: var(--red);
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+section.newsitem summary {
+    padding: 0.3em;
+    margin-bottom: 0;
+}
+
+
+div.jumbotron {
+    background-image: url(/images/blades.jpg);
+    border-radius: 5px;
+    padding: 3em;
+}
+
+div.jumbotron div {
+    background-color: #ffffffdd;
+    border-radius: 5px;
+    padding: 1em;
+}
diff --git a/static/css/marx.css b/static/css/marx.css
new file mode 100644
index 0000000..f61cc90
--- /dev/null
+++ b/static/css/marx.css
@@ -0,0 +1 @@
+/*! Marx v4.0.0 - The classless CSS reset (perfect for Communists) | MIT License | https://github.com/mblode/marx */*,:after,:before{background-repeat:no-repeat;box-sizing:border-box}:after,:before{text-decoration:inherit;vertical-align:inherit}:where(:root){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;cursor:default;line-height:1.5;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4}:where(body){margin:0}:where(h1){font-size:2em;margin:.67em 0}:where(dl,ol,ul) :where(dl,ol,ul){margin:0}:where(hr){color:inherit;height:0}:where(nav) :where(ol,ul){list-style-type:none;padding:0}:where(navli):before{content:"\200B";float:left}:where(pre){font-family:monospace,monospace;font-size:1em;overflow:auto}:where(abbr[title]){text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace,monospace;font-size:1em}:where(small){font-size:80%}:where(audio,canvas,iframe,img,svg,video){vertical-align:middle}:where(iframe){border-style:none}:where(svg:not([fill])){fill:currentColor}:where(table){border-collapse:collapse;border-color:currentColor;text-indent:0}:where(button,input,select){margin:0}:where(button,[type=button i],[type=reset i],[type=submit i]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){margin:0;resize:vertical}:where([type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(dialog){background-color:#fff;border:solid;color:#000;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}:where(dialog:not([open])){display:none}:where(details>summary:first-of-type){display:list-item}:where([aria-busy=true i]){cursor:progress}:where([aria-disabled=true i],[disabled]){cursor:not-allowed}:where([aria-hidden=false i][hidden]){display:initial}:where([aria-hidden=false i][hidden]:not(:focus)){clip:rect(0,0,0,0);position:absolute}:root{--br:4px;--xs-pad:4px;--sm-pad:8px;--md-pad:16px;--lg-pad:20px;--xlg-pad:40px;--sm-breakpoint:400px;--lg-breakpoint:768px;--primary-400:#60a5fa;--primary:#3b82f6;--primary-600:#2563eb;--accent:#64ffda;--red:#f43f5e;--red-600:#dc2626;--yellow:#eab308;--grey:#f7f7f9;--white:#fff;--black:#000;--text:rgba(0,0,0,.8);--secondary:rgba(0,0,0,.54);--disabled:rgba(0,0,0,.38);--dividers:rgba(0,0,0,.12);--link-color:var(--primary);--sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";--serif:Georgia,Times,"Times New Roman",serif;--monospace:Menlo,Monaco,Consolas,"Courier New",monospace;--font-family:var(--sans-serif);--font-size-base:16px;--font-size-sm:14px;--font-size-h1:40px;--font-size-h2:32px;--font-size-h3:28px;--font-size-h4:24px;--font-size-h5:20px;--font-size-h6:16px;--line-height-base:1.5;--border:1px solid var(--dividers)}article,aside,details,footer,header,main,section,summary{margin:0 auto;margin-bottom:var(--md-pad);width:100%}main{display:block;margin:0 auto;max-width:var(--lg-breakpoint);padding:0 var(--md-pad) var(--md-pad)}footer{border-top:var(--border);padding:var(--md-pad) 0;text-align:center}footer p{margin-bottom:0}hr{border:0;border-top:var(--border);box-sizing:content-box;display:block;height:0;margin-bottom:var(--md-pad);margin-top:var(--md-pad);overflow:visible;width:100%}img{height:auto;max-width:100%;vertical-align:baseline}@media screen and (max-width:var(--sm-breakpoint)){article,aside,section{clear:both;display:block;max-width:100%}img{margin-right:var(--md-pad)}}embed,iframe,video{border:0}body{color:var(--text);font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-base)}p{margin:0;margin-bottom:var(--md-pad)}h1,h2,h3,h4,h5,h6{color:inherit;font-family:inherit;font-weight:500;line-height:1.2}h1{font-size:var(--font-size-h1)}h1,h2{margin:var(--lg-pad) 0 var(--md-pad)}h2{font-size:var(--font-size-h2)}h3{font-size:var(--font-size-h3)}h3,h4{margin:var(--md-pad) 0 var(--xs-pad)}h4{font-size:var(--font-size-h4)}h5{font-size:var(--font-size-h5);margin:var(--md-pad 0) var(--xs-pad)}h6{font-size:var(--font-size-h6);margin:var(--md-pad) 0 var(--xs-pad)}small{color:var(--secondary);vertical-align:bottom}pre{background-color:var(--grey);display:block;margin:var(--md-pad 0);overflow-wrap:break-word;padding:var(--md-pad);white-space:pre-wrap}code,pre{color:var(--text);font-family:var(--monospace);font-size:var(--font-size-base)}code{word-wrap:break-word;line-height:inherit;margin:0;padding:0;vertical-align:baseline;word-break:break-all}a{background-color:transparent;color:var(--link-color);text-decoration:none}a:focus,a:hover{color:var(--primary-600);text-decoration:underline}dl{margin-bottom:var(--md-pad)}dd{margin-left:var(--xlg-pad)}ol,ul{margin-bottom:var(--sm-pad);padding-left:var(--xlg-pad);vertical-align:baseline}blockquote{border-left:2px solid var(--text);font-style:italic;margin:var(--md-pad 0);padding-left:var(--md-pad)}blockquote,figcaption{font-family:var(--serif)}u{text-decoration:underline}s{text-decoration:line-through}sup{vertical-align:super}sub,sup{font-size:var(--font-size-sm)}sub{vertical-align:sub}mark{background-color:var(--yellow)}input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{background:var(--white);background-clip:padding-box;border:var(--border);border-radius:var(--br);color:var(--text);display:block;font-family:var(--sans-serif);font-size:1rem;line-height:1.5;padding:var(--sm-pad) var(--md-pad);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:100%;word-break:normal}input[type=color]{background-color:var(--white);display:inline-block;vertical-align:middle}input:not([type]),input[type=color]{border:var(--border);border-radius:var(--br)}input:not([type]){-webkit-appearance:none;background:var(--white);background-clip:padding-box;color:var(--text);display:block;line-height:1.5;padding:var(--sm-pad) var(--md-pad);text-align:left;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:100%;word-break:normal}input:not([type]):focus,input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select:focus,textarea:focus{background-color:var(--white);border-color:var(--primary-400);box-shadow:0 0 0 .2rem rgba(59,130,246,.5);outline:0}input[type=checkbox]:focus,input[type=file]:focus,input[type=radio]:focus{outline:1px thin var(--dividers)}input:not([type])[disabled],input[type=color][disabled],input[type=date][disabled],input[type=datetime-local][disabled],input[type=datetime][disabled],input[type=email][disabled],input[type=month][disabled],input[type=number][disabled],input[type=password][disabled],input[type=search][disabled],input[type=tel][disabled],input[type=text][disabled],input[type=time][disabled],input[type=url][disabled],input[type=week][disabled],select[disabled],textarea[disabled]{background-color:var(--dividers);color:var(--secondary);cursor:not-allowed;opacity:1}input[readonly],select[readonly],textarea[readonly]{border-color:var(--dividers);color:var(--secondary)}input:focus:invalid,select:focus:invalid,textarea:focus:invalid{border-color:var(--red-600);color:var(--red)}input[type=checkbox]:focus:invalid:focus,input[type=file]:focus:invalid:focus,input[type=radio]:focus:invalid:focus{outline-color:var(--red)}select{border:var(--border);vertical-align:sub}select:not([size]):not([multiple]){height:calc(2.25rem + 2px)}select[multiple]{height:auto}label{display:inline-block;line-height:2}fieldset{border:0;margin:0}fieldset,legend{padding:var(--sm-pad 0)}legend{border-bottom:var(--border);color:var(--text);display:block;margin-bottom:var(--sm-pad);width:100%}textarea{overflow:auto;resize:vertical}input[type=checkbox],input[type=radio]{box-sizing:border-box;display:inline;padding:0}button,input[type=button],input[type=reset],input[type=submit]{background-color:var(--primary);border:1px solid transparent;border-radius:var(--br);color:var(--white);display:inline-block;font-size:1rem;font-weight:400;line-height:1.5;padding:var(--sm-pad) var(--md-pad);text-align:center;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}button::-moz-focus-inner,input[type=button]::-moz-focus-inner,input[type=reset]::-moz-focus-inner,input[type=submit]::-moz-focus-inner{padding:0}button:hover,button:not(:disabled):active,input[type=button]:hover,input[type=button]:not(:disabled):active,input[type=reset]:hover,input[type=reset]:not(:disabled):active,input[type=submit]:hover,input[type=submit]:not(:disabled):active{background-color:var(--primary-600);border-color:var(--primary-600);color:var(--white)}button:focus,input[type=button]:focus,input[type=reset]:focus,input[type=submit]:focus{box-shadow:0 0 0 .2rem rgba(59,130,246,.5);outline:0}button:disabled,input[type=button]:disabled,input[type=reset]:disabled,input[type=submit]:disabled{background-color:var(--primary);border-color:var(--primary);color:var(--white);cursor:not-allowed;opacity:.65}table{border-top:var(--border);margin-bottom:var(--md-pad)}caption{padding:var(--sm-pad 0)}thead th{border:0;border-bottom:2px solid var(--dividers);text-align:left}tr{margin-bottom:var(--sm-pad)}td,th{border-bottom:var(--border);padding:var(--md-pad);vertical-align:inherit}tfoot tr{text-align:left}tfoot td{color:var(--secondary);font-size:var(--sm-pad);font-style:italic;padding:var(--md-pad) var(--xs-pad)}
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
new file mode 100644
index 0000000..74243ac
--- /dev/null
+++ b/templates/base.html
@@ -0,0 +1,38 @@
+{% import "macros.html" as macros %}
+<!doctype html>
+<html lang="sv">
+  <head>
+    <meta charset="utf-8" />
+    <title>Stacken</title>
+    <meta name="description" content="" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="stylesheet" href="/css/marx.css" />
+    <link rel="stylesheet" href="/css/main.css" />
+  </head>
+  <body>
+    <header>
+      <a href="/"><img src="/images/stacken-logo.png" /></a>
+      <input type="checkbox" id="menu-control" name="menu-control" />
+      <label for="menu-control">
+        <div class="menu-button"></div>
+      </label>
+      <menu>
+        <li><a href="/">Hem</a></li>
+        <li><a href="/club">Om Stacken</a></li>
+        <li><a href="/forum">Forum</a></li>
+        <li><a href="/projects">Projekt & Tjänster</a></li>
+        <li><a href="/news">Nyheter & Kalender</a></li>
+        <li><a href="/member/">Bli medlem</a></li>
+        <li><a href="/en/">English</a></li>
+      </menu>
+    </header>
+
+    {% block content %} {% endblock %}
+
+    <footer>
+      <p>
+        Datorföreningen Stacken - <a href="/club/integritetspolicy">Integritetspolicy</a> - This page is also available in <a href="/en/">English</a>
+      </p>
+    </footer>
+  </body>
+</html>
diff --git a/templates/index.html b/templates/index.html
new file mode 100644
index 0000000..7c0c4f7
--- /dev/null
+++ b/templates/index.html
@@ -0,0 +1,54 @@
+{% extends "base.html" %}
+
+{% block content %}
+
+<main>
+  <h1>Datorföreningen Stacken</h1>
+  <p>
+    Most pages are translated to English, <a href="/en/">click here for the English version</a>
+  </p>
+
+<div class="jumbotron">
+  <div>
+    <h2>Aktuellt på Stacken</h2>
+    <p>Torsdag 22 augusti deltog Stacken på Kårens dag</p>
+    <p>
+      Vi brukar träffas i vår föreningslokal på torsdagkvällar, en del av oss brukar äta först och dyka upp i lokalen frammåt 19:30.
+      Vi finns också online, se sidan om <a href="/forum">forum</a>.
+      Ibland har vi videomöten på <a href="https://meet.stacken.kth.se/Stacken">meet.stacken.kth.se/Stacken</a>.
+    </p>
+  </div>
+</div>
+
+    <h2>För studenter</h2>
+    <p>Stacken är en datorförening för studenter och anställda vid KTH. Föreningens syfte är att främja intresset för och vidga kunskaper inom datorområdet.</p>
+</main>
+<aside>
+  <section>
+    <h1>Nyheter</h1>
+
+    {{ macros::latest_news() }}
+
+    <a href="/news">Läs mer nyheter</a>
+  </section>
+
+</aside>
+  <section class="member">
+    <h1>Bli medlem</h1>
+    <p>
+      Att bli medlem i Stacken kan vara ett bra sätt att få kontakt med andra som delar intressen. Alternativt lära sig nya saker och få hjälp. Stacken är även en bra resurs för att komma i kontakt med näringslivet då vi har goda kontakter med livet utanför KTH.
+    </p>
+    <a href="/member/">Läs mer / Bli medlem</a>
+  </section>
+
+  <section class="activity">
+    <h1>Aktiviteter</h1>
+    <p>Vi erbjuder gemensamma projekt att arbeta på, tjänster för medlemmar, föreningar eller sektioner att använda, föreläsningar och andra kul aktiviteter. <a href="/projects/">Läs mer</a></p>
+  </section>
+
+  <section class="history">
+    <h1>40 år av Stacken</h1>
+    <p>Stacken har varit på och runt KTH i mer än 40 år och varit med om födelsen av både den moderna datorn och internet som vi känner det i dag. <a href="/club/history">Läs mer</a></p>
+  </section>
+
+{% endblock content %}
diff --git a/templates/macros.html b/templates/macros.html
new file mode 100644
index 0000000..97bd14c
--- /dev/null
+++ b/templates/macros.html
@@ -0,0 +1,20 @@
+{% macro newsitem(item) %}
+<section class="newsitem">
+    <header>
+        <a href="{{ item.permalink | safe}}">{{ item.title }}</a>
+        <time> {{ item.date | date }} </time>
+    </header>
+    <summary>
+        {{ item.summary | safe }}
+    </summary>
+
+    <a href="{{ item.permalink }}">Läs mer...</a>
+</section>
+{% endmacro newsitem %}
+
+{% macro latest_news() %}
+{% set news = get_section(path="news/_index.md") %}
+    {% for page in news.pages | sort(attribute="date") | slice(start=-5) | reverse %}
+      {{ macros::newsitem(item=page) }}
+    {% endfor %}
+{% endmacro latest_news %}
diff --git a/templates/news-post.html b/templates/news-post.html
new file mode 100644
index 0000000..b950392
--- /dev/null
+++ b/templates/news-post.html
@@ -0,0 +1,9 @@
+{% extends "base.html" %}
+
+{% block content %}
+<main>
+    <h1>{{page.title}}</h1>
+    <p><strong>{{page.date}}</strong></p>
+    {{page.content | safe}}
+</main>
+{% endblock content %}
diff --git a/templates/news-root.html b/templates/news-root.html
new file mode 100644
index 0000000..38575fe
--- /dev/null
+++ b/templates/news-root.html
@@ -0,0 +1,19 @@
+{% extends "base.html" %}
+
+{% block content %}
+<main>
+    <h1>{{ section.title }}</h1>
+    {{ macros::latest_news() }}
+</main>
+<aside>
+    <h1>År</h1>
+    <ul>
+        {% for subsection in section.subsections | reverse %}
+        {% set item = get_section(path=subsection) %}
+        <li>
+            <a href="{{item.permalink}}">{{ item.title }} </a>
+        </li>
+        {% endfor %}
+    </ul>
+</aside>
+{% endblock content %}
diff --git a/templates/news.html b/templates/news.html
new file mode 100644
index 0000000..057a74d
--- /dev/null
+++ b/templates/news.html
@@ -0,0 +1,11 @@
+{% import "macros.html" as macros %}
+{% extends "base.html" %}
+
+{% block content %}
+<main>
+    <h1>{{ section.title }}</h1>
+    {% for page in section.pages %}
+      {{ macros::newsitem(item=page) }}
+    {% endfor %}
+</main>
+{% endblock content %}
diff --git a/templates/page.html b/templates/page.html
new file mode 100644
index 0000000..8dbc9d4
--- /dev/null
+++ b/templates/page.html
@@ -0,0 +1,8 @@
+{% extends "base.html" %}
+
+{% block content %}
+<main>
+    <h1>{{ page.title }}</h1>
+    {{ page.content | safe }}
+</main>
+{% endblock content %}
diff --git a/templates/shortcodes/memberform_sv.html b/templates/shortcodes/memberform_sv.html
new file mode 100644
index 0000000..7e7e15c
--- /dev/null
+++ b/templates/shortcodes/memberform_sv.html
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+
+<head>
+<title>memberform_sv.html</title>
+<meta http-equiv="Content-Type" content="application/xhtml+xml;charset=utf-8"/>
+<link rel="stylesheet" type="text/css" media="all" href="https://cdn.jsdelivr.net/npm/github-markdown-css/github-markdown.min.css"  />
+<link rel="stylesheet" type="text/css" media="all" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release/build/styles/github.min.css"  /><meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no'><style> body { box-sizing: border-box; max-width: 740px; width: 100%; margin: 40px auto; padding: 0 10px; } </style><script id='MathJax-script' async src='https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js'></script><script src='https://cdn.jsdelivr.net/gh/highlightjs/cdn-release/build/highlight.min.js'></script><script>document.addEventListener('DOMContentLoaded', () => { document.body.classList.add('markdown-body'); document.querySelectorAll('pre[lang] > code').forEach((code) => { code.classList.add(code.parentElement.lang); }); document.querySelectorAll('pre > code').forEach((code) => { hljs.highlightBlock(code); }); });</script>
+</head>
+
+<body>
+
+
+
+</body>
+</html>
diff --git a/templates/shortcodes/splitend.md b/templates/shortcodes/splitend.md
new file mode 100644
index 0000000..b0f2d2f
--- /dev/null
+++ b/templates/shortcodes/splitend.md
@@ -0,0 +1,2 @@
+  </div>
+</div>
diff --git a/templates/shortcodes/splitmiddle.md b/templates/shortcodes/splitmiddle.md
new file mode 100644
index 0000000..835d877
--- /dev/null
+++ b/templates/shortcodes/splitmiddle.md
@@ -0,0 +1,2 @@
+</div>
+<div class="column">
diff --git a/templates/shortcodes/splitstart.md b/templates/shortcodes/splitstart.md
new file mode 100644
index 0000000..c7d4850
--- /dev/null
+++ b/templates/shortcodes/splitstart.md
@@ -0,0 +1,2 @@
+<div class="split">
+    <div class="column">