diff --git a/webpage_page/aboutme.html b/webpage_page/aboutme.html
new file mode 100644
index 0000000..110259d
--- /dev/null
+++ b/webpage_page/aboutme.html
@@ -0,0 +1,75 @@
+<!doctype html>
+<!-- Template for lua_api.html -->
+<html lang="en">
+
+    <body data-spy="scroll" data-target="#contenttable" data-offset="15" style="background: url('background.png') no-repeat center center fixed;background-size: 100% 100%;background-repeat: no-repeat;image-rendering:optimizeSpeed">
+
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+        <meta name="description" content="Minetest Lua API">
+        <meta name="author" content="Minetest Core Developers">
+        <link rel="icon" href="icon.png"> 
+        <div class="bg"></div>
+
+        <title>Magic-CTF - About Me</title>
+        <link rel="shortcut icon" href="https://forum.minetest.net/styles/mt_v1/theme/images/favicon.ico">
+
+        <!-- Scripts and stylesheets -->
+        <!-- Bootstrap core CSS -->
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+        <link href="jumbotron.css" rel="stylesheet">
+
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
+
+        <!-- Table of content -->
+        <div class="position-fixed" id="toc2" style="left: 20px;">
+            <nav class="col-lg">
+                <ul class="nav flex-column nav-pills affix">
+                    <a class="nav-link" href="index.html">Home</a><a class="nav-link" href="license.html">License</a><a class="nav-link" href="notes.html">Notes</a><a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="aboutme.html" role="tab" aria-controls="v-pills-home" aria-selected="true">About Me</a>
+                    <!--Python script places stuff here-->
+                </ul>
+            </nav>
+        </div>
+
+        <!-- Table of content -->
+        <div class="position-fixed" id="toc" style="right: 20px;">
+            <nav class="col-lg" id="contenttable">
+                <ul class="nav flex-column nav-pills affix" id="v-pills-tab" data-spy="affix" data-offset-top="205">
+                    <li><a class="nav-link" href="#gheader1"><h2><p>HI!</p></h2></a></li>
+                    <!--Python script places stuff here-->
+                </ul>
+            </nav>
+        </div>
+
+        <!--<div class="jumbotron" style="background-color:rgba(0,0,0,0)">-->
+                <div class="row" style="width:60%;margin-left:20%;margin-right:20%;">
+                    <div class="col-lg" style="display:inline-block;height:100%;">
+                        <div>
+                        <h2 id="gheader1"><p>HI!</p></h2><br><blockquote class="blockquote"><p><b>Lorem ipsum dolor sit amet</b></p></blockquote><p>- the most famous citation of me</p><p>My hobbies : </p><ul><li><p>None</p></li><ul><li><p>Nothing</p></li></ul></ul><br><p>A picture of me : </p><p><img class="img-fluid" src="https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png" alt="hi"><div class="caption"><p><b><em>LMD</em></b></p></div></p><br><br>
+                        </div>
+                        <!--Python script places stuff here-->
+                        <hr>
+                        <p>Magic-CTF is a new, magically themed CTF Engine & Game for Minetest Servers.</p>
+                        <p>Minetest is a free software game engine currently under development to create various games based on voxel gameplay, inspired by InfiniMiner, Minecraft, and the like. Minetest was originally created by Perttu Ahola (alias “celeron55”). </p>
+                        <a>Generated by </a><a href="https://github.com/appgurueu/md-pypage">md-pypage</a><a>.</a>
+                    </div>
+                </div>
+        <!--</div>-->
+
+        <script>
+            var last=""
+            var objDiv=document.getElementById("toc")
+            function scroll() {
+                var elem=document.getElementsByClassName("nav-link active")[0]
+                if (elem != null && last != elem.textContent) {
+                    last=elem.textContent;
+                    objDiv.scrollTop = elem.offsetTop;
+                }
+            }
+            window.setInterval(scroll,5)
+        </script>
+
+    </body>
+
+</html>
diff --git a/webpage_page/background.png b/webpage_page/background.png
new file mode 100644
index 0000000..f24408e
Binary files /dev/null and b/webpage_page/background.png differ
diff --git a/webpage_page/index.html b/webpage_page/index.html
new file mode 100644
index 0000000..8a1567e
--- /dev/null
+++ b/webpage_page/index.html
@@ -0,0 +1,49 @@
+<!doctype html>
+<!-- Template for lua_api.html -->
+<html lang="en">
+
+    <body data-spy="scroll" data-target="#contenttable" data-offset="15" style="background: url('background.png') no-repeat center center fixed;background-size: 100% 100%;background-repeat: no-repeat;image-rendering:optimizeSpeed">
+
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+        <meta name="description" content="Magic-CTF Home">
+        <meta name="author" content="Lars Müller">
+        <link rel="icon" href="icon.png"> 
+        <div class="bg"></div>
+
+        <title>Minetest Magic-CTF - Home</title>
+        <link rel="shortcut icon" href="https://forum.minetest.net/styles/mt_v1/theme/images/favicon.ico">
+
+        <!-- Scripts and stylesheets -->
+        <!-- Bootstrap core CSS -->
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+        <link href="jumbotron.css" rel="stylesheet">
+
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
+
+        <!--<div class="jumbotron" style="background-color:rgba(0,0,0,0)">-->
+            <div class="container">
+                <div class="row">
+                    <div class="col-lg">
+                        <h1 style="text-align:center;">Minetest Magic-CTF Homepage</h1>
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-sm"><h2><a href="license.html">License &raquo;</a></h2>
+                        <p>Licensing.
+                        </p>
+                    </div><div class="col-sm"><h2><a href="notes.html">Notes &raquo;</a></h2>
+                        <p>Keynotes.
+                        </p>
+                    </div><div class="col-sm"><h2><a href="aboutme.html">About Me &raquo;</a></h2>
+                        <p>A section only about ME
+                        </p>
+                    </div>
+                </div>
+            </div>
+        <!--</div>-->
+
+    </body>
+
+</html>
diff --git a/webpage_page/jumbotron.css b/webpage_page/jumbotron.css
new file mode 100644
index 0000000..53987ad
--- /dev/null
+++ b/webpage_page/jumbotron.css
@@ -0,0 +1,111 @@
+:root {
+  --selection-color: white;
+  --selection-bg: skyblue;
+}
+
+h3 {
+  font-size: 120%;
+  text-decoration: underline;
+}
+
+ul.justify-content-center {
+  padding-top: 0.5rem;
+}
+label.btn {
+  padding: 0.15rem 1rem;
+}
+::-moz-selection {
+  color: var(--selection-color);
+  background: var(--selection-bg);
+}
+
+::selection {
+  color: var(--selection-color);
+  background: var(--selection-bg);
+}
+
+div.col-md-4, div.col-lg, div.col-sm {
+  padding: 10px;
+  background: rgba(255, 255, 255, 0.6);
+}
+
+div.col-md-4, div.col-sm {
+    margin: 5px;
+}
+
+blockquote.blockquote {
+    background: lightgrey;
+    border-left: 10px solid grey;
+    padding: 10px;
+    padding-left: 20px;
+    line-height: 80%;
+}
+
+body {
+    position: relative;
+}
+
+div.position-fixed {
+    position:fixed;
+    padding:0;
+    margin:0;
+    overflow-y: scroll;
+    top: 20px;
+    z-index: 1000;
+    width:17.5%;
+    max-height:90%;
+    background: rgba(255, 255, 255, 0.6);
+}
+
+.affix {
+    padding: 0;
+    margin: 0;
+    /*overflow-x: scroll;*/
+}
+
+li.a.nav-link {
+    display: table;
+    margin: 5px;
+    width: 100%;
+}
+
+li.a.nav-link h1, li.a.nav-link h1,h2,h3,h4,h5,h6 {
+    margin-top:0px;
+    margin-bottom:0px;
+}
+
+a.nav-link:active, a.nav-link.active {
+    background-color: grey;
+}
+
+a.nav-link h1 {
+    font-size:120%;
+    font-weight: bold;
+}
+
+a.nav-link h2 {
+    margin-left: 30px;
+    text-decoration: underline;
+    font-size:110%
+}
+
+a.nav-link h3 {
+    margin-left: 60px;
+    font-size: 100%;
+    text-decoration:none;
+}
+
+a.nav-link h4 {
+    margin-left: 90px;
+    font-size: 75%
+}
+
+a.nav-link h5 {
+    margin-left: 120px;
+    font-size: 75%
+}
+
+a.nav-link h6 {
+    margin-left: 150px;
+    font-size: 75%
+}
diff --git a/webpage_page/license.html b/webpage_page/license.html
new file mode 100644
index 0000000..56728ba
--- /dev/null
+++ b/webpage_page/license.html
@@ -0,0 +1,75 @@
+<!doctype html>
+<!-- Template for lua_api.html -->
+<html lang="en">
+
+    <body data-spy="scroll" data-target="#contenttable" data-offset="15" style="background: url('background.png') no-repeat center center fixed;background-size: 100% 100%;background-repeat: no-repeat;image-rendering:optimizeSpeed">
+
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+        <meta name="description" content="Minetest Lua API">
+        <meta name="author" content="Minetest Core Developers">
+        <link rel="icon" href="icon.png"> 
+        <div class="bg"></div>
+
+        <title>Magic-CTF - License</title>
+        <link rel="shortcut icon" href="https://forum.minetest.net/styles/mt_v1/theme/images/favicon.ico">
+
+        <!-- Scripts and stylesheets -->
+        <!-- Bootstrap core CSS -->
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+        <link href="jumbotron.css" rel="stylesheet">
+
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
+
+        <!-- Table of content -->
+        <div class="position-fixed" id="toc2" style="left: 20px;">
+            <nav class="col-lg">
+                <ul class="nav flex-column nav-pills affix">
+                    <a class="nav-link" href="index.html">Home</a><a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="license.html" role="tab" aria-controls="v-pills-home" aria-selected="true">License</a><a class="nav-link" href="notes.html">Notes</a><a class="nav-link" href="aboutme.html">About Me</a>
+                    <!--Python script places stuff here-->
+                </ul>
+            </nav>
+        </div>
+
+        <!-- Table of content -->
+        <div class="position-fixed" id="toc" style="right: 20px;">
+            <nav class="col-lg" id="contenttable">
+                <ul class="nav flex-column nav-pills affix" id="v-pills-tab" data-spy="affix" data-offset-top="205">
+                    <li><a class="nav-link" href="#gheader1"><h1><p>Nothing to say here.</p></h1></a></li>
+                    <!--Python script places stuff here-->
+                </ul>
+            </nav>
+        </div>
+
+        <!--<div class="jumbotron" style="background-color:rgba(0,0,0,0)">-->
+                <div class="row" style="width:60%;margin-left:20%;margin-right:20%;">
+                    <div class="col-lg" style="display:inline-block;height:100%;">
+                        <div>
+                        <h1 id="gheader1"><p>Nothing to say here.</p></h1><br><p>Seriously. Lorem ipsum.</p>
+                        </div>
+                        <!--Python script places stuff here-->
+                        <hr>
+                        <p>Magic-CTF is a new, magically themed CTF Engine & Game for Minetest Servers.</p>
+                        <p>Minetest is a free software game engine currently under development to create various games based on voxel gameplay, inspired by InfiniMiner, Minecraft, and the like. Minetest was originally created by Perttu Ahola (alias “celeron55”). </p>
+                        <a>Generated by </a><a href="https://github.com/appgurueu/md-pypage">md-pypage</a><a>.</a>
+                    </div>
+                </div>
+        <!--</div>-->
+
+        <script>
+            var last=""
+            var objDiv=document.getElementById("toc")
+            function scroll() {
+                var elem=document.getElementsByClassName("nav-link active")[0]
+                if (elem != null && last != elem.textContent) {
+                    last=elem.textContent;
+                    objDiv.scrollTop = elem.offsetTop;
+                }
+            }
+            window.setInterval(scroll,5)
+        </script>
+
+    </body>
+
+</html>
diff --git a/webpage_page/notes.html b/webpage_page/notes.html
new file mode 100644
index 0000000..bd580b9
--- /dev/null
+++ b/webpage_page/notes.html
@@ -0,0 +1,75 @@
+<!doctype html>
+<!-- Template for lua_api.html -->
+<html lang="en">
+
+    <body data-spy="scroll" data-target="#contenttable" data-offset="15" style="background: url('background.png') no-repeat center center fixed;background-size: 100% 100%;background-repeat: no-repeat;image-rendering:optimizeSpeed">
+
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+        <meta name="description" content="Minetest Lua API">
+        <meta name="author" content="Minetest Core Developers">
+        <link rel="icon" href="icon.png"> 
+        <div class="bg"></div>
+
+        <title>Magic-CTF - Notes</title>
+        <link rel="shortcut icon" href="https://forum.minetest.net/styles/mt_v1/theme/images/favicon.ico">
+
+        <!-- Scripts and stylesheets -->
+        <!-- Bootstrap core CSS -->
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+        <link href="jumbotron.css" rel="stylesheet">
+
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
+
+        <!-- Table of content -->
+        <div class="position-fixed" id="toc2" style="left: 20px;">
+            <nav class="col-lg">
+                <ul class="nav flex-column nav-pills affix">
+                    <a class="nav-link" href="index.html">Home</a><a class="nav-link" href="license.html">License</a><a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="notes.html" role="tab" aria-controls="v-pills-home" aria-selected="true">Notes</a><a class="nav-link" href="aboutme.html">About Me</a>
+                    <!--Python script places stuff here-->
+                </ul>
+            </nav>
+        </div>
+
+        <!-- Table of content -->
+        <div class="position-fixed" id="toc" style="right: 20px;">
+            <nav class="col-lg" id="contenttable">
+                <ul class="nav flex-column nav-pills affix" id="v-pills-tab" data-spy="affix" data-offset-top="205">
+                    <li><a class="nav-link" href="#gheader1"><h1><p>Are you sure ?</p></h1></a></li>
+                    <!--Python script places stuff here-->
+                </ul>
+            </nav>
+        </div>
+
+        <!--<div class="jumbotron" style="background-color:rgba(0,0,0,0)">-->
+                <div class="row" style="width:60%;margin-left:20%;margin-right:20%;">
+                    <div class="col-lg" style="display:inline-block;height:100%;">
+                        <div>
+                        <h1 id="gheader1"><p>Are you sure ?</p></h1><br><p>**This is just example (invalid) Markdown.</p><blockquote class="blockquote"><p><em>A very wise man just told me, </em></p><blockquote class="blockquote"><p><b>that this application could be useful !</b></p></blockquote><p><code>application=&quot;nice&quot;</code></p>
+                        </div>
+                        <!--Python script places stuff here-->
+                        <hr>
+                        <p>Magic-CTF is a new, magically themed CTF Engine & Game for Minetest Servers.</p>
+                        <p>Minetest is a free software game engine currently under development to create various games based on voxel gameplay, inspired by InfiniMiner, Minecraft, and the like. Minetest was originally created by Perttu Ahola (alias “celeron55”). </p>
+                        <a>Generated by </a><a href="https://github.com/appgurueu/md-pypage">md-pypage</a><a>.</a>
+                    </div>
+                </div>
+        <!--</div>-->
+
+        <script>
+            var last=""
+            var objDiv=document.getElementById("toc")
+            function scroll() {
+                var elem=document.getElementsByClassName("nav-link active")[0]
+                if (elem != null && last != elem.textContent) {
+                    last=elem.textContent;
+                    objDiv.scrollTop = elem.offsetTop;
+                }
+            }
+            window.setInterval(scroll,5)
+        </script>
+
+    </body>
+
+</html>
