diff --git a/Comment and buy section b/Comment and buy section
new file mode 100644
index 0000000..f8837f5
--- /dev/null
+++ b/Comment and buy section	
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="ntf-8" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="kazzoostyle.css"/>
+<link href="#Comment and buy section">
+
+
+
+    <style>
+    body {
+        margin: 0;
+
+    }
+
+    ul {
+        list-style-type: none;
+        margin: 0;
+        padding: 0;
+        width: 25%;
+        background-color: #333;
+        position: fixed;
+        height: 100%;
+        overflow: auto;
+    }
+
+    li a {
+        display: block;
+        color: #555;
+        padding: 8px 16px;
+        text-decoration: none;
+    }
+
+    li a.active {
+        background-color: #555;
+        color: white;
+    }
+
+    li a:hover:not(.active) {
+        background-color: #555;
+        color: white;
+    }
+    </style>
+    </head>
+
+    <body>
+
+    <ul>
+      <li><a class="home" href="Kazoo">Home</a></li>
+      <li><a href="Comment and buy section">Comment</a></li>
+      <li><a href="contact">Contact</a></li>
+      <li><a href="#about">About</a></li>
+    </ul>
+
+    <div style="margin-left:25%;padding:1px 16px;height:1000px;">
+      <h2>Kazzoo, the Open Trade Portal</h2>
+<h3> Commtents and Requests </h3>
+      <p>
+
+<form action="demo_form.asp" id="usrform">
+  Name: <input type="text" name="usrname">
+  <input type="submit">
+</form>
+<br>
+<textarea rows="4" cols="50" name="comment" form="usrform">
+Enter text here...</textarea>
+
+      </p>
+    <div class="wrapper">
+
+    </div>
+
+    </div>
+
+    </body>
+    </html>
diff --git a/Contact b/Contact
new file mode 100644
index 0000000..a129574
--- /dev/null
+++ b/Contact
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="ntf-8" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="kazzoostyle.css"/>
+<link href="#Contact">
+
+
+
+    <style>
+    body {
+        margin: 0;
+
+    }
+
+    ul {
+        list-style-type: none;
+        margin: 0;
+        padding: 0;
+        width: 25%;
+        background-color: #333;
+        position: fixed;
+        height: 100%;
+        overflow: auto;
+    }
+
+    li a {
+        display: block;
+        color: #555;
+        padding: 8px 16px;
+        text-decoration: none;
+    }
+
+    li a.active {
+        background-color: #555;
+        color: white;
+    }
+
+    li a:hover:not(.active) {
+        background-color: #555;
+        color: white;
+    }
+    </style>
+    </head>
+
+    <body>
+
+    <ul>
+      <li><a class="home" href="Kazoo">Home</a></li>
+      <li><a href="Comment and buy section">Comment</a></li>
+      <li><a href="Contact">Contact</a></li>
+      <li><a href="#about">About</a></li>
+    </ul>
+
+    <div style="margin-left:25%;padding:1px 16px;height:1000px;">
+      <h2>Kazzoo, the Open Trade Portal</h2>
+<h3> Contact </h3>
+      <p>
+
+
+    <div class="wrapper">
+
+    </div>
+
+    </div>
+
+    </body>
+    </html>
diff --git a/Kazzoo Html5 +Css3 b/Kazzoo Html5 +Css3
new file mode 100644
index 0000000..8e51941
--- /dev/null
+++ b/Kazzoo Html5 +Css3	
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="de">
+
+
+<head>
+<title> Kazzoo the Open-Webshop</title>
+<meta charset="utf-8">
+<link rel="stylesheet" href="kazzoostyle.css" type="text/css"/>
+</head>
+
+<body>
+<h1> Kazzoo, the Open Trade Portal </h1>
+
+
+
+
+</body>
+
+</html>
diff --git a/comment.html b/comment.html
new file mode 100644
index 0000000..7fca7cb
--- /dev/null
+++ b/comment.html
@@ -0,0 +1,14 @@
+<form method='post'>
+  NAME: <input type='text' name='name' id='name' /><br />
+
+  Email: <input type='text' name='email' id='email' /><br />
+
+  Website: <input type='text' name='website' id='website' /><br />
+
+  Comment:<br />
+  <textarea name='comment' id='comment'></textarea><br />
+
+  <input type='hidden' name='articleid' id='articleid' value='<? echo $_GET["id"]; ?>' />
+
+  <input type='submit' value='Submit' />
+</form>
diff --git a/index.html b/index.html
index 60b53ea..cc073e7 100644
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
 <head>
   <meta charset="ntf-8" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="kazzoostyle.css"/>
-
+<link href="#Kazoo">
 
 
 <style>
@@ -45,9 +45,9 @@ li a:hover:not(.active) {
 <body>
 
 <ul>
-  <li><a class="active" href="#home">Home</a></li>
-  <li><a href="#news">News</a></li>
-  <li><a href="#contact">Contact</a></li>
+  <li><a class="home" href="Kazoo">Home</a></li>
+  <li><a href="Comment and buy section">Comment</a></li>
+  <li><a href="Contact">Contact</a></li>
   <li><a href="#about">About</a></li>
 </ul>
 
@@ -58,9 +58,7 @@ li a:hover:not(.active) {
 </div>
   </h2>
   <h3>What is possible in Kazzoo???</h3>
-  <p>Notice that this div element has a left margin of 25%. This is because the side navigation is set to 25% width. If you remove the margin, the sidenav will overlay/sit on top of this div.</p>
-  <p>Also notice that we have set overflow:auto to sidenav. This will add a scrollbar when the sidenav is too long (for example if it has over 50 links inside of it).</p>
-
+  
 </div>
 
 </body>
diff --git a/kazzoostyle.css b/kazzoostyle.css
new file mode 100644
index 0000000..4226a12
--- /dev/null
+++ b/kazzoostyle.css
@@ -0,0 +1,25 @@
+body{
+
+  background-image: url(images.jpg);
+}
+h1{
+  font-size: 25pt;
+  font-family: fantasy;
+  color: darkgrey;
+  text-align: center;
+  text-decoration: underline;
+  background-color: rgba(2, 250,250, 0.8);
+}
+p{
+border-radius: 10px;
+  border-style: solid;
+
+}
+
+.wrapper{
+
+  width:auto;;
+  max-width: inherit;
+  margin: 20px;
+
+}
