diff --git a/index.html b/index.html
index 5301365..616275e 100644
--- a/index.html
+++ b/index.html
@@ -41,9 +41,12 @@ <h1>CSS Modal</h1>
 		<section class="on-github">
 			<p>
 				<a href="/drublic/css-modal"><i class="icon-github">GitHub</i></a>
-				This project is <a href="/drublic/css-modal">on GitHub</a>. Go fork it.</p>
+				This project is <a href="/drublic/css-modal">on GitHub</a>. Go fork it.
+			</p>
 		</section>
 
+		<img src="site/img/artwork.jpg" alt="" class="artwork">
+
 		<!-- Content Area -->
 		<div class="main" role="main">
 
diff --git a/site/css/main.css b/site/css/main.css
index 59ffda1..2c1d51e 100644
--- a/site/css/main.css
+++ b/site/css/main.css
@@ -598,6 +598,15 @@ code {
   color: #fff;
 }
 
+.artwork {
+  max-width: 100%;
+}
+@media screen and (max-width: 30em) {
+  .artwork {
+    display: none;
+  }
+}
+
 .main {
   max-width: 50em;
   margin: 0 auto;
@@ -629,7 +638,7 @@ code {
 
 .features {
   overflow: hidden;
-  margin: 1.5em -0.7em;
+  margin: 1em -0.7em 1.4em;
 }
 .features > div {
   -webkit-box-sizing: border-box;
diff --git a/site/img/artwork.jpg b/site/img/artwork.jpg
new file mode 100644
index 0000000..8e63646
Binary files /dev/null and b/site/img/artwork.jpg differ
diff --git a/site/scss/_layout.scss b/site/scss/_layout.scss
index 653c119..10784fb 100644
--- a/site/scss/_layout.scss
+++ b/site/scss/_layout.scss
@@ -138,6 +138,15 @@ code {
 	}
 }
 
+// The artwork above the content
+.artwork {
+	max-width: 100%;
+
+	@media screen and (max-width: 30em) {
+		display: none;
+	}
+}
+
 // Content
 .main {
 	max-width: 50em;
@@ -174,7 +183,7 @@ code {
 // Show features
 .features {
 	overflow: hidden;
-	margin: 1.5em -.7em;
+	margin: 1em -.7em 1.4em;
 
 	> div {
 		@include x-box-sizing;