diff --git a/client/src/app/app.component.html b/client/src/app/app.component.html
index 60ff33247e03dad1c41683451345750984ae608b..dda8c3ef3dbb62485c8a275bad07e7f2d5e106ab 100644
--- a/client/src/app/app.component.html
+++ b/client/src/app/app.component.html
@@ -1,3 +1,12 @@
-<h1>SellPoint</h1>
+<div class="navbar">
+	<a class="logo" href="/">SELLPOINT</a>
+	<nav>
+		<a href="/">/</a>
+		<a href="/annonse">/annonse</a>
+		<a href="/annonse/ny">/annonse/ny</a>
+	</nav>
+</div>
 
-<router-outlet></router-outlet>
\ No newline at end of file
+<div class="wrapper">
+	<router-outlet></router-outlet>
+</div>
diff --git a/client/src/app/app.component.scss b/client/src/app/app.component.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..ae8ad49fdcdba6c323fef0198ad7fc773b3e656f 100644
--- a/client/src/app/app.component.scss
+++ b/client/src/app/app.component.scss
@@ -0,0 +1,25 @@
+div.navbar {
+	background-color: #666;
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	height: 70px;
+
+	a.logo {
+		padding: 10px;
+		background-color: white;
+		width: 200px;
+		margin-left: 10px;
+	}
+	nav {
+		a{
+			padding: 10px;
+			margin: 10px;
+			background-color: white;
+		}
+	}
+}
+
+div.wrapper {
+	padding: 10px;
+}
diff --git a/client/src/app/posts/post-details/post-details.component.html b/client/src/app/posts/post-details/post-details.component.html
index 80cbaafa38b63a46748f082d6d204f900f989aa2..82d2c974c54aecb3fb5fa36438205f2b5edb0f36 100644
--- a/client/src/app/posts/post-details/post-details.component.html
+++ b/client/src/app/posts/post-details/post-details.component.html
@@ -1,7 +1,7 @@
-<h3>{{post.getTitle}}</h3>
+<h3>Tittel: {{post.getTitle}}</h3>
 
 <img [src]="post.getImageUrl">
-<p>{{post.getDescription}}</p>
+<p>Beskrivelse: {{post.getDescription}}</p>
 <br>
 <p>Publiseringstidspunkt: {{post.getTimestamp}}</p>
-<p>Eier: {{post.getOwner}}</p>
\ No newline at end of file
+<p>Eier: {{post.getOwner}}</p>
diff --git a/client/src/app/posts/post-form/post-form.component.html b/client/src/app/posts/post-form/post-form.component.html
index c0cde4bbde1575cb8beecba709028d397bf86e96..0ea8224c49c7c4c83cf7cfda58a8dc9fecf79b2a 100644
--- a/client/src/app/posts/post-form/post-form.component.html
+++ b/client/src/app/posts/post-form/post-form.component.html
@@ -1,19 +1,21 @@
-<h3>Lag annonse</h3>
+<div class="postform">
+	<h3>Lag annonse</h3>
 
-<app-text-input [(inputModel)]="title" label="Tittel" (blur)="checkForm()"></app-text-input>
+	<app-text-input [(inputModel)]="title" label="Tittel" (blur)="checkForm()"></app-text-input>
 
-<app-text-input [(inputModel)]="description" label="Beskrivelse" (blur)="checkForm()"></app-text-input>
+	<app-text-input [(inputModel)]="description" label="Beskrivelse" (blur)="checkForm()"></app-text-input>
 
-<app-number-input [(inputModel)]="price" label="Pris" (blur)="checkForm()"></app-number-input>
+	<app-number-input [(inputModel)]="price" label="Pris" (blur)="checkForm()"></app-number-input>
 
-<app-select [(inputModel)]="categoryid" (change)="checkForm()" label="Kategori">
-    <option value="0" selected hidden>Velg kategori</option>
-    <option *ngFor="let category of categories" [value]="category.getCategoryId">{{category.getName}}</option>
-</app-select>
+	<app-select [(inputModel)]="categoryid" (change)="checkForm()" label="Kategori">
+			<option value="0" selected hidden>Velg kategori</option>
+			<option *ngFor="let category of categories" [value]="category.getCategoryId">{{category.getName}}</option>
+	</app-select>
 
-<app-text-input [(inputModel)]="imageUrl" label="Bilde URL" (blur)="showImage(imageUrl)"></app-text-input>
-<img [src]="displayImageUrl" (error)="showImage('https://i.stack.imgur.com/y9DpT.jpg')">
+	<app-text-input [(inputModel)]="imageUrl" label="Bilde URL" (blur)="showImage(imageUrl)"></app-text-input>
+	<img [src]="displayImageUrl" (error)="showImage('https://i.stack.imgur.com/y9DpT.jpg')">
 
-<p>{{statusMessage}}</p>
+	<p>{{statusMessage}}</p>
 
-<app-button (click)="publishPost()" text="Publiser"></app-button>
+	<app-button (click)="publishPost()" text="Publiser"></app-button>
+</div>
diff --git a/client/src/app/posts/post-form/post-form.component.scss b/client/src/app/posts/post-form/post-form.component.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..26460c8a9adbeda02916bc0ca5f0f1e0549600c5 100644
--- a/client/src/app/posts/post-form/post-form.component.scss
+++ b/client/src/app/posts/post-form/post-form.component.scss
@@ -0,0 +1,4 @@
+div.postform {
+	display: flex;
+	flex-direction: column;
+}
diff --git a/client/src/app/posts/post-thumbnail/post-thumbnail.component.html b/client/src/app/posts/post-thumbnail/post-thumbnail.component.html
index 5dc8e9f282270157d3b479851bfd3e3fdde921b1..5dc53d6c2b01a049a1cc19fcadd92df48e20c2fa 100644
--- a/client/src/app/posts/post-thumbnail/post-thumbnail.component.html
+++ b/client/src/app/posts/post-thumbnail/post-thumbnail.component.html
@@ -1 +1,3 @@
-<p (click)="goToPost()">{{post.getTitle}}</p>
+<div class="postthumb">
+	<a href="javascript:void(0)"(click)="goToPost()">{{post.getTitle}}</a>
+</div>
diff --git a/client/src/app/posts/post-thumbnail/post-thumbnail.component.scss b/client/src/app/posts/post-thumbnail/post-thumbnail.component.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..7be5993b0afb5d440f9cfafc34bb0c66e9b80fa7 100644
--- a/client/src/app/posts/post-thumbnail/post-thumbnail.component.scss
+++ b/client/src/app/posts/post-thumbnail/post-thumbnail.component.scss
@@ -0,0 +1,5 @@
+div.postthumb {
+	padding: 10px;
+	margin: 10px;
+	background-color: rgba(0,0,0,.1);
+}
diff --git a/client/src/styles.scss b/client/src/styles.scss
index 90d4ee0072ce3fc41812f8af910219f9eea3c3de..06cad1ecf084f21d1d2b7e142b23d9d6ea636de4 100644
--- a/client/src/styles.scss
+++ b/client/src/styles.scss
@@ -1 +1,6 @@
 /* You can add global styles to this file, and also import other style files */
+* {
+	padding: 0;
+	margin: 0;
+	box-sizing: border-box;
+}