diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..96403d3
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+__pycache__/*
diff --git a/__pycache__/blog.cpython-36.pyc b/__pycache__/blog.cpython-36.pyc
index 7ac76ec..8668e71 100644
Binary files a/__pycache__/blog.cpython-36.pyc and b/__pycache__/blog.cpython-36.pyc differ
diff --git a/__pycache__/config.cpython-36.pyc b/__pycache__/config.cpython-36.pyc
index 0ee9a30..dd63554 100644
Binary files a/__pycache__/config.cpython-36.pyc and b/__pycache__/config.cpython-36.pyc differ
diff --git a/app/__pycache__/__init__.cpython-36.pyc b/app/__pycache__/__init__.cpython-36.pyc
index 55d6087..1a6b9bf 100644
Binary files a/app/__pycache__/__init__.cpython-36.pyc and b/app/__pycache__/__init__.cpython-36.pyc differ
diff --git a/app/__pycache__/auth.cpython-36.pyc b/app/__pycache__/auth.cpython-36.pyc
index e37ab17..c794644 100644
Binary files a/app/__pycache__/auth.cpython-36.pyc and b/app/__pycache__/auth.cpython-36.pyc differ
diff --git a/app/__pycache__/models.cpython-36.pyc b/app/__pycache__/models.cpython-36.pyc
index 0aca102..e1f3b09 100644
Binary files a/app/__pycache__/models.cpython-36.pyc and b/app/__pycache__/models.cpython-36.pyc differ
diff --git a/app/__pycache__/routes.cpython-36.pyc b/app/__pycache__/routes.cpython-36.pyc
index 0522e51..981b8e4 100644
Binary files a/app/__pycache__/routes.cpython-36.pyc and b/app/__pycache__/routes.cpython-36.pyc differ
diff --git a/app/auth.py b/app/auth.py
index 7bf422e..2ef9338 100644
--- a/app/auth.py
+++ b/app/auth.py
@@ -6,7 +6,7 @@
 bp = Blueprint('auth', __name__, url_prefix='/auth')
 
 
-@bp.route('/register', methods=['POST', 'GET'])
+@bp.route('/register', methods=['GET', 'POST'])
 def register():
     if request.method == 'POST':
         username = request.form['username']
diff --git a/app/static/css/style.css b/app/static/css/style.css
new file mode 100644
index 0000000..15fbf3a
--- /dev/null
+++ b/app/static/css/style.css
@@ -0,0 +1,18 @@
+footer .container {
+	margin-top: 100px;
+}
+
+.login {
+	padding: 10px 20px;
+	width: 40%;
+	margin: 30px auto;
+}
+
+.login img {
+	display: block;
+	margin: auto;
+}
+
+.login li {
+	color: red;
+}
diff --git a/app/static/images/feather.png b/app/static/images/feather.png
new file mode 100644
index 0000000..60ce9a1
Binary files /dev/null and b/app/static/images/feather.png differ
diff --git a/app/templates/auth/login.html b/app/templates/auth/login.html
index e03fbff..e8afdff 100644
--- a/app/templates/auth/login.html
+++ b/app/templates/auth/login.html
@@ -1,17 +1,33 @@
-{%with messages = get_flashed_messages()%}
-	{%if messages%}
-		{%for message in messages%}
-			<ul>{{message}}</ul>
-		{%endfor%}
-	{%endif%}
-{%endwith%}
-{{all_identical_users}}
+{% extends "base.html" %}
+
+{% block title %}Blog{% endblock %}
+{% block header %}{% endblock %}
+{% block content %}
+	<div class="login z-depth-2">
 		<form method="POST">
-			<label for="username">Username</label>
-			<input name="username" id="username" required>
-			<label for="password">Password</label>
-			<input type="password" name="password" id="password" required>
-			<input type="submit" name="Login">
-			
-		</form>
-	
\ No newline at end of file
+			<a href={{ url_for('index') }}><img src="{{ url_for('static', filename='images/feather.png') }}"></a>
+			<div class="row">
+				<div class="input-field col s12">
+					<input type="text" name="username" id="username" required>
+					<label for="username">Username</label>
+				</div>
+			<div class="input-field col s12">
+				<input type="password" name="password" id="password" required>
+				<label for="password">Password</label>
+			</div>
+			<div class="input-field col s12">
+				<input type="submit" value="{% block button_label %}Login{%endblock %}" class="blue white-text btn">
+			</div>
+		</form>	
+		{%with messages = get_flashed_messages()%}
+			{%if messages%}
+				<ul>
+				{%for message in messages%}
+					<li>{{message}}</li>
+				{%endfor%}
+				</ul>
+			{%endif%}
+		{%endwith%}
+	</div>
+{% endblock %}
+{% block footer %}{% endblock %}
diff --git a/app/templates/auth/register.html b/app/templates/auth/register.html
index 352cfc1..8e3fe78 100644
--- a/app/templates/auth/register.html
+++ b/app/templates/auth/register.html
@@ -1,14 +1,7 @@
-{%if error%}
-	{{error}}
-{%endif%}
-
-	{% block content %}
-		<form method="POST">
-			<label for="username">Username</label>
-			<input name="username" id="username" required>
-			<label for="password">Password</label>
-			<input type="password" name="password" id="password">
-			<input type="submit" name="Login">			
-		</form>
-	{% endblock %}
-	
\ No newline at end of file
+<!--
+{% extends "login.html" %}
+-->
+<!--
+{% block button_label %}Register{% endblock %}
+-->
+<h1>asdasdsa</h1>
diff --git a/app/templates/base.html b/app/templates/base.html
new file mode 100644
index 0000000..cbf8047
--- /dev/null
+++ b/app/templates/base.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    {% block head %}
+		<title>{% block title %}{% endblock %}</title>
+		<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
+		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
+		<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
+		<link rel="icon" href="{{ url_for('static', filename='images/feather.png') }}">
+    {% endblock %}
+</head>
+<body>
+    <div id="header"><div class="container">{% block header %}<a href={{ url_for('index') }}>
+		<img src="{{ url_for('static', filename='images/feather.png') }}"></a>{% endblock %}</div></div>
+    <div id="content"><div class="container">{% block content %}{% endblock %}</div></div>
+    <footer>
+		<div class="container">
+			{% block footer %}
+			<hr>
+			&copy; Copyright 2017
+			{% endblock %}
+		</div>
+    </footer>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>
+</body>
+</html>
diff --git a/app/templates/detail.html b/app/templates/detail.html
index 8250b85..6e4d737 100644
--- a/app/templates/detail.html
+++ b/app/templates/detail.html
@@ -1,6 +1,10 @@
-<a href="{{ url_for('index')}}">All posts</a>
-<h1>{{ post.title }}</h1>
-<h4>{{ post.date() }}</h4>
-<p>{{  post.body }}</p>
-<a href="{{ url_for('edit', post_id=post.id)}}">Edit</a>
-<hr>
+{% extends "base.html" %}
+
+{% block title %}{{ post.title }}{% endblock %}
+{% block content %}
+	<a href="{{ url_for('index')}}" class="waves-effect waves-light right">All posts<i class="material-icons right">chevron_right</i></a>
+	<h1>{{ post.title }}</h1>
+	<h4>{{ post.date() }}</h4>
+	<p>{{  post.body }}</p>
+	<a href="{{ url_for('edit', post_id=post.id) }}" class="waves-effect waves-light btn">Edit</a>
+{% endblock %}
diff --git a/app/templates/edit.html b/app/templates/edit.html
index 24c7b46..18ad88f 100644
--- a/app/templates/edit.html
+++ b/app/templates/edit.html
@@ -1,8 +1,5 @@
-<form method='POST'>
-	<label>Title</label>
-	<input type='text' name='title' value='{{ post.title }}'><br>
-	<label>Body</label>
-	<textarea rows='10' cols='50' name='body'>{{ post.body }}</textarea><br>
-	<input type='submit' value='Submit'>
-	<a href="{{ url_for('index') }}">cancel</a>
-</form>
+{% extends "new.html" %}
+
+{% block title %}{{ post.title }}{% endblock %}
+{% block post_title%}{{ post.title }}{% endblock %}
+{% block post_body%}{{ post.body }}{% endblock %}
diff --git a/app/templates/index.html b/app/templates/index.html
index 4ca32ad..30fbe58 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -1,10 +1,15 @@
-<a href="{{ url_for('new') }}">New post</a>
-{% if posts %}
-	<ul>
-	{% for post in posts %}
-		<li><a href="{{ url_for('detail', post_id=post.id) }}">{{ post.title }}</a>&nbsp;{{ post.date() }}</li>
-	{% endfor %}
-	</ul>
-{% else %}
-	<h3>No posts.</h3>
-{% endif %}
+{% extends "base.html" %}
+
+{% block title %}Blog{% endblock %}
+{% block content %}
+	<a href="{{ url_for('new') }}" class="waves-effect waves-light btn">New Post</a>
+	{% if posts %}
+		<div class="collection">
+		{% for post in posts %}
+			<a href="{{ url_for('detail', post_id=post.id) }}" class="collection-item">{{ post.title }}<span class="right">{{ post.date() }}</span></a>
+		{% endfor %}
+		</div>
+	{% else %}
+		<h3>No posts.</h3>
+	{% endif %}
+{% endblock %}
diff --git a/app/templates/new.html b/app/templates/new.html
index 25d6b0e..f6abddd 100644
--- a/app/templates/new.html
+++ b/app/templates/new.html
@@ -1,8 +1,25 @@
-<form method='POST'>
-	<label>Title</label>
-	<input type='text' name='title'><br>
-	<label>Body</label>
-	<textarea rows='10' cols='50' name='body'></textarea><br>
-	<input type='submit' value='Submit'>
-	<a href="{{ url_for('index') }}">cancel</a>
-</form>
+{% extends "base.html" %}
+
+{% block title %}New Post{% endblock %}
+{% block content %}
+	<form method="POST">
+		<div class="row">
+			<div class="input-field col s4">
+				<input id="title" type="text" name="title" value="{% block post_title%}{% endblock %}">
+				<label for="title">Title</label>
+			</div>
+		</div>
+		<div class="row">
+			<div class="input-field col s12">
+				<textarea id="body" class="materialize-textarea">{% block post_body%}{% endblock %}</textarea>
+				<label for="body">Body</label>
+			</div>
+		</div>
+		<div class="row">
+			<div class="input-field col s12">
+				<input type="submit" value="Submit" class="btn">
+				<a href="{{ url_for('index') }}">cancel</a>
+			</div>
+		</div>
+	</form>
+{% endblock %}