diff --git a/equipment.jpg b/equipment.jpg
new file mode 100644
index 0000000..eaefb53
Binary files /dev/null and b/equipment.jpg differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..7c46e82
--- /dev/null
+++ b/index.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" type="text/css" href="styles.css" />
+    <title>Klankschool</title>
+    </head>
+  <body>
+    <div id="app">
+      <h1 id="main">Klankschool</h1>
+      <p><img class="home-img" src="equipment.jpg"></p>
+      <p> Klankschool is an emerging community operating a space in the south of Rotterdam. Each member is a teacher, student, musician, janitor and more. The purpose of the space is to share sounds, work on projects, hang out, exhibit works, learn, teach, listen. See the calendar for upcoming and past events. </p>
+      <p><a href="https://klankschool.org/calendar/?key=46e630bbe7">calendar</a></p>
+    </div>
+    </body>
+</html>
diff --git a/noise.svg b/noise.svg
new file mode 100644
index 0000000..0d8760b
--- /dev/null
+++ b/noise.svg
@@ -0,0 +1,21 @@
+    <svg
+  xmlns='http://www.w3.org/2000/svg'
+  xmlns:xlink='http://www.w3.org/1999/xlink'
+  width='1000px' height='1000px'>
+
+    <filter id='n' x='0' y='0'>
+            <feTurbulence
+              type='fractalNoise'
+              baseFrequency='0.075'
+              stitchTiles='stitch'/>
+              <feComposite operator="in" in="myTurbulence" in2="SourceAlpha" result="myComposite"/>
+      <feColorMatrix in="myComposite" type="matrix"
+        values="1   1   1   0   0
+                1   1   1   0   0
+                1   1   1   0   1
+                0   0   0   1   0" />
+    </filter>
+
+    <rect width='1000px' height='1000px' fill='#000'/>
+    <rect width='1000px' height='1000px' filter="url(#n)" opacity='1.0'/>
+</svg>
\ No newline at end of file
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..38136f1
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,64 @@
+* {
+    box-sizing: border-box;
+}
+
+html {   
+    height: 100vh;
+    position: relative;
+}
+
+
+#app {
+    top: 50%;
+    left: 50%;
+    position: absolute;
+    transform: translate(-50%, -50%);
+    width: 75vw;
+    
+}
+
+#main {
+    text-align: center;
+    border-color: grey;
+    background-color: white;
+    border-width: 3px;
+    border-style: solid;
+}
+
+a {
+    font-size: 1.8rem;
+    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
+    color: black;
+}
+
+a:hover {
+    color: grey;
+}
+body{
+    height: 100%;
+    background-image: url(noise.svg);
+    background-size: 100% 100%;
+    -o-background-size: 100% 100%;
+    -webkit-background-size: 100% 100%;
+    background-size: cover;
+    text-align: center;
+  }
+
+p {
+    font-size: 2rem;	
+    padding: 0.5vh 1vw;
+    border-color: grey;
+    background-color: white;
+    border-width: 2px;
+    border-style: solid;
+    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;    
+}
+
+
+h1 {
+    font-size: 3rem;
+    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
+    font-weight: 600;
+}
+
+.home-img{width: 100%; height: 20vh; object-fit: cover;}
\ No newline at end of file
