diff --git a/_sass/_layout.scss b/_sass/_layout.scss
diff --git a/_sass/_syntax-highlighting.scss b/_sass/_syntax-highlighting.scss
diff --git a/about.md b/about.md
diff --git a/css/main.css b/css/main.css
@@ -0,0 +1,99 @@
+body {
+  font-family: 'Roboto', sans-serif;
+  font-weight: 300;
+  text-shadow: 4px 4px 4px #aaa;
+}
+
+header {
+  padding: 20px 0;
+}
+
+header .row,
+footer .row {
+  display: flex;
+  align-items: center;
+}
+
+header h1 {
+  font-weight: 700;
+  margin: 0;
+}
+
+header nav {
+  display: flex;
+  justify-content: flex-end;
+}
+
+header p {
+  padding: 0 20px;
+  margin: 0;
+}
+
+.jumbotron {
+  display: flex;
+  align-items: center;
+  background-image: url('https://static.pexels.com/photos/21415/pexels-photo-21415.jpg');
+  background-size: cover;
+  color: #ffffff;
+  height: 500px;
+  text-shadow: 0.25px 0.25px 0.25px #000000;
+}
+
+.jumbotron h2 {
+  font-size: 60px;
+  font-weight: 700;
+  margin: 0;
+  color: #fff;
+}
+
+.jumbotron h3 {
+  margin: 0 0 20px;
+  color: #fff;
+}
+
+section .row img {
+  margin: 0 0 30px;
+  width: 100%;
+}
+
+.col-md-6 {
+  margin: 0 0 30px;
+}
+
+.btn.btn-primary {
+  border-radius: 2px;
+  border: 0px;
+  color: #fbd1d5;
+  text-shadow: none;
+  background-color: #ffffff;
+}
+
+.btn.btn-primary:hover {
+  color: #ffffff;
+  background-color: #fbd1d5;
+}
+
+.btn-secondary {
+  background-color: #E8DFE0;
+  color: #ffffff;
+  margin: 0 0 30px;
+}
+
+footer {
+  font-size: 12px;
+  padding: 20px 0;
+}
+
+footer .col-sm-8 {
+  display: flex;
+  justify-content: flex-end;
+}
+
+footer ul {
+  list-style: none;
+}
+
+footer li img {
+  width: 32px;
+  height: 32px;
+}
diff --git a/css/main.scss b/css/main.scss
diff --git a/css/prosjekter.css b/css/prosjekter.css
@@ -0,0 +1,147 @@
+body {
+  font-family: 'Roboto', sans-serif;
+  font-weight: 300;
+  text-shadow: 2px 2px 2px #aaa;
+}
+
+header {
+  padding: 20px 0;
+}
+
+header .row,
+footer .row {
+  display: flex;
+  align-items: center;
+}
+
+header h1 {
+  font-weight: 700;
+  margin: 0;
+}
+
+header nav {
+  display: flex;
+  justify-content: flex-end;
+}
+
+header p {
+  padding: 0 20px;
+  margin: 0;
+}
+
+.box2 {
+    background-color: #000000; /* Green */
+    border: none;
+    color: white;
+    padding: flex;
+    margin: 10px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 60px;
+    font-family: 'Roboto', sans-serif;
+}
+
+.button {
+    background-color: #4CAF50; /* Green */
+    border: none;
+    color: white;
+    padding: 40px 60px;
+    margin: 5px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 30px;
+    font-family: 'Roboto', sans-serif;
+}
+
+.button:hover {
+    box-shadow: 0 16px 20px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
+    <!--This is a comment. Comments are not displayed in the browser-->
+
+}
+
+.image-wtext {
+    position:relative;
+}
+
+.text-center {
+    left: 0;
+    position:absolute;
+    text-align:center;
+    top: 30px;
+    width: 100%
+}
+
+.jumbotron {
+  display: flex;
+  align-items: center;
+  background-image: url('https://static.pexels.com/photos/103567/pexels-photo-103567.jpeg');
+  background-size: cover;
+  color: #ffffff;
+  height: 400px;
+  text-shadow: 0.25px 0.25px 0.25px #000000;
+}
+
+.jumbotron h2 {
+  font-size: 60px;
+  font-weight: 700;
+  margin: 0;
+  color: #fff;
+}
+
+.jumbotron h3 {
+  margin: 0 0 20px;
+  color: #fff;
+}
+
+section .row img {
+  margin: 0 0 30px;
+  width: 100%;
+}
+
+.col-md-6 {
+  margin: 0 0 30px;
+}
+
+.col-md-4 {
+  margin: 0 0 20px;
+}
+
+.btn.btn-primary {
+  border-radius: 2px;
+  border: 0px;
+  color: #fbd1d5;
+  text-shadow: none;
+  background-color: #ffffff;
+}
+
+.btn.btn-primary:hover {
+  color: #ffffff;
+  background-color: #fbd1d5;
+}
+
+.btn-secondary {
+  background-color: #E8DFE0;
+  color: #ffffff;
+  margin: 0 0 30px;
+}
+
+footer {
+  font-size: 12px;
+  padding: 20px 0;
+}
+
+footer .col-sm-8 {
+  display: flex;
+  justify-content: flex-end;
+}
+
+footer ul {
+  list-style: none;
+}
+
+footer li img {
+  width: 32px;
+  height: 32px;
+}
diff --git a/feed.xml b/feed.xml
diff --git a/index.html b/index.html
@@ -5,7 +5,7 @@
   <meta charset="utf-8"/>
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
   <link href='https://fonts.googleapis.com/css?family=Roboto:300,400,700' rel='stylesheet' type='text/css'>
-  <link rel="stylesheet" type="text/css" href="main.css">
+  <link rel="stylesheet" type="text/css" href="css/main.css">
 </head>
 <body>
 <header class="container">
@@ -24,7 +24,7 @@ <h1 class="col-sm-4">simenvg.github.io</h1>
     <div class="row text-center">
       <h2>I DON'T KNOW HTML OR CSS</h2>
       <h3>asdfasdfasdf</h3>
-      <a class="btn btn-primary" href="#" role="button">Not a button</a>
+      <a class="btn btn-primary" href="https://simenvg.github.io/sider/prosjekter/prosjekter.html" role="button">Projects</a>
     </div>
   </div>
 </section>
@@ -53,13 +53,8 @@ <h3>asdfasdfasdf</h3>
 
 <footer class="container">
   <div class="row">
-    <p class="col-sm-4">&copy; 2076 simenvg</p>
-    <ul class="col-sm-8">
-      <li class="col-sm-1"><img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/twitter.svg"></li>
-      <li class="col-sm-1"><img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/facebook.svg"></li>
-      <li class="col-sm-1"><img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/instagram.svg"></li>
-      <li class="col-sm-1"><img src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-4/medium.svg"></li>
-    </ul>
+    <p class="col-sm-4">simenvg</p>
+
   </div>
 </footer>
 </body>

diff --git a/main.css b/main.css
@@ -1,6 +1,7 @@
 body {
   font-family: 'Roboto', sans-serif;
   font-weight: 300;
+  text-shadow: 2px 2px 2px #aaa;
 }
 
 header {

diff --git a/sider/prosjekter/prosjekter.html b/sider/prosjekter/prosjekter.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>simenvg.github.io</title>
+  <meta charset="utf-8"/>
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
+  <link href='https://fonts.googleapis.com/css?family=Roboto:300,400,700' rel='stylesheet' type='text/css'>
+  <link rel="stylesheet" type="text/css" href="../../css/prosjekter.css">
+</head>
+<body>
+<header class="container">
+  <div class="row">
+      <h1 class="col-sm-4">
+        <a href="https://simenvg.github.io" style="color: #000000"> simenvg.github.io </a> 
+      </h1>
+    <nav class="col-sm-8 text-right">
+      <p><a href="https://vg.no">Home</a></p>
+      <p>Projects</p>
+      <p>Nothing</p>
+    </nav>
+  </div>
+</header>
+
+<section class="jumbotron">
+  <div class="container">
+    <div class="row text-center">
+      <h2>Prosjekter</h2>
+      <h3>asdfasdfasdf</h3>
+      <a class="btn btn-primary" href="#" role="button">Not a button</a>
+    </div>
+  </div>
+</section>
+
+<section class="container">
+  <div class="row">
+    <div class="col-sm-12">
+      <a class="button" href="https://vg.no" role="button">1</a>
+      <a class="button" href="https://vg.no" role="button">2</a>
+      <a class="button" href="https://vg.no" role="button">3</a>
+      <a class="button" href="https://vg.no" role="button">4</a>
+      <a class="button" href="https://vg.no" role="button">5</a>
+      <a class="button" href="https://vg.no" role="button">6</a>
+    </div>
+  </div>
+</section>
+
+
+
+
+<footer class="container">
+  <div class="row">
+    <p class="col-sm-4">simenvg</p>
+  </div>
+</footer>
+</body>
+</html>