diff --git a/static/art/brownstilllife.jpg b/static/art/brownstilllife.jpg
new file mode 100644
index 0000000..56aad64
Binary files /dev/null and b/static/art/brownstilllife.jpg differ
diff --git a/static/art/chimp.jpg b/static/art/chimp.jpg
new file mode 100644
index 0000000..6bebf7f
Binary files /dev/null and b/static/art/chimp.jpg differ
diff --git a/static/art/gorilla.jpg b/static/art/gorilla.jpg
new file mode 100644
index 0000000..93c5221
Binary files /dev/null and b/static/art/gorilla.jpg differ
diff --git a/static/art/outlinestilllife.jpg b/static/art/outlinestilllife.jpg
new file mode 100644
index 0000000..9d9fac6
Binary files /dev/null and b/static/art/outlinestilllife.jpg differ
diff --git a/static/art/redandbluestilllife.jpg b/static/art/redandbluestilllife.jpg
new file mode 100644
index 0000000..8d0687c
Binary files /dev/null and b/static/art/redandbluestilllife.jpg differ
diff --git a/static/art/tyler.jpg b/static/art/tyler.jpg
new file mode 100644
index 0000000..c185cf0
Binary files /dev/null and b/static/art/tyler.jpg differ
diff --git a/static/art/zu.jpg b/static/art/zu.jpg
new file mode 100644
index 0000000..3f19a64
Binary files /dev/null and b/static/art/zu.jpg differ
diff --git a/static/style.css b/static/style.css
index 9c675b4..eb19877 100644
--- a/static/style.css
+++ b/static/style.css
@@ -22,6 +22,25 @@ p {
 	padding: 10px;
 }
 
+.button {
+	background-color: white;
+	color: black;
+	border-radius: 10px;
+	display: inline-block;
+	margin: 4px auto;
+	cursor: pointer;
+	text-align: center;
+	padding: 15px;
+	text-decoration: none;
+	box-shadow: 2px 2px 4px  black;
+	-webkit-transition-duration: 0.4s;
+  	transition-duration: 0.4s;
+}
+
+.button:hover {
+	box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
+}
+
 .row {
 	margin:auto;
 }
@@ -30,13 +49,13 @@ p {
 	height: auto;
 	border: 6px solid #484c55;
 	margin: 5px;	
+	box-shadow: 7px 7px 8px #000000;
 }
 
 div.gallerystrip {
 	width: 100%;
 	margin: auto;
 	margin-top: 15px;
-	box-shadow: 7px 7px 8px #000000;
 }
 
 div.profile {
@@ -91,9 +110,9 @@ div.card h1 {
 
 .card img {
 	width: 100%;
-	border: 3px solid #484c55;
 	border-radius: 3px;
 	margin-bottom: 8px;	
+	box-shadow: 2px 2px 2px black;
 }
 
 .card p {
@@ -140,6 +159,20 @@ ul.navbar a:hover {
 
 ul.navbar li.right {float: right;}
 
+footer p {
+	text-align: right;
+	font-size: 12px;
+}
+
+footer a {
+	margin-top: 10px;
+	margin-bottom: 10px;
+	text-align: right;
+	display: block;
+	color: grey;
+	font-size: 12px;
+}
+
 @media only screen and (max-width: 600px) {
   ul.navbar li.right,
   ul.navbar li {float: none;}
diff --git a/templates/art.html b/templates/art.html
index 1c67a46..8bbcdb7 100644
--- a/templates/art.html
+++ b/templates/art.html
@@ -16,9 +16,44 @@
 			<img src="{{ url_for('static', filename='art/self.jpg') }}" alt="me" class="col-pad-4">
 			<p><b>self portrait</b></p>
 		</div>
+		<div class="card col-pad-4">
+			<img src="{{ url_for('static', filename='art/tyler.jpg') }}" alt="tyler, the creator" class="col-pad-4">
+			<p><b>tyler, the creator</b></p>
+		</div>
+	</div>
+	<div class="row">
+		<h1 class="sectiontitle">animals</h1>	
+	</div>
+	<div class="row">
+		<div class="card col-pad-4">
+			<img src="{{ url_for('static', filename='art/gorilla.jpg') }}" alt="gorilla" class="col-pad-4">
+			<p><b>gorilla</b></p>
+		</div>
+		<div class="card col-pad-4">
+			<img src="{{ url_for('static', filename='art/zu.jpg') }}" alt="zuma" class="col-pad-4">
+			<p><b>zuma</b></p>
+		</div>
 		<div class="card col-pad-4">
 			<img src="{{ url_for('static', filename='art/horse.jpg') }}" alt="temptation of saint anthony" class="col-pad-4">
 			<p><b>the temptation of saint anthony / salvador dalí</b></p>
 		</div>
 	</div>
+	<div class="row">
+		<h1 class="sectiontitle">life drawing</h1>	
+	</div>
+	<div class="row">
+		<div class="card col-pad-4">
+			<img src="{{ url_for('static', filename='art/brownstilllife.jpg') }}" alt="brown" class="col-pad-4">
+			<p><b>white and brown</b></p>
+		</div>
+		<div class="card col-pad-4">
+			<img src="{{ url_for('static', filename='art/outlinestilllife.jpg') }}" alt="outline" class="col-pad-4">
+			<p><b>minimal outline</b></p>
+		</div>
+		<div class="card col-pad-4">
+			<img src="{{ url_for('static', filename='art/redandbluestilllife.jpg') }}" alt="red and blue" class="col-pad-4">
+			<p><b>red and blue</b></p>
+		</div>
+	</div>
+
 {% endblock %}
diff --git a/templates/base.html b/templates/base.html
index f031be8..d2cbd59 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -22,5 +22,8 @@
 	</ul>
 	
 	{% block content %}{% endblock %}
+	<footer>
+		<a href="https://github.com/Sarsoo/sarsoo.xyz">view source code</a>
+	</footer>
 </body>
 </html>
diff --git a/templates/dev.html b/templates/dev.html
index ed97df1..5a0744d 100644
--- a/templates/dev.html
+++ b/templates/dev.html
@@ -4,6 +4,11 @@
 
 {% block content %}	
 	<div class="row">
-	
+		<div class="col-pad-6 card">	
+			<h1>fm framework</h1>
+			<p>a client for last.fm music tracking written in java</p>
+			<p>this project was important for learning how to interact with  REST APIs and implementing knowledge from my java classes at uni</p>
+			<a href="https://github.com/Sarsoo/fmframework" style="width:100%;" class="button">view source</a>
+		</div>
 	</div>
 {% endblock %}