diff --git a/pelican/themes/notmyidea/static/css/main.css b/pelican/themes/notmyidea/static/css/main.css
index aaea9b81..a4aa51a1 100644
--- a/pelican/themes/notmyidea/static/css/main.css
+++ b/pelican/themes/notmyidea/static/css/main.css
@@ -147,7 +147,8 @@ aside, nav, article, figure {
 }
 
 /***** Layout *****/
-.body {clear: both; margin: 0 auto; width: 800px;}
+.body {clear: both; margin: 0 auto; max-width: 800px;}
+img { max-width: 100%; }
 img.right, figure.right, div.figure.align-right {
     float: right;
     margin: 0 0 2em 2em;
@@ -159,7 +160,7 @@ img.left, figure.left, div.figure.align-left {
 
 /* .rst support */
 div.figure img, figure img {  /* to fill figure exactly */
-    width: 100%;
+    max-width: 100%;
 }
 div.figure p.caption, figure p.caption { /* margin provided by figure */
     margin-top: 0;
@@ -171,16 +172,21 @@ div.figure p.caption, figure p.caption { /* margin provided by figure */
 *****************/
 #banner {
 	margin: 0 auto;
-	padding: 2.5em 0 0 0;
+	padding: 0.8em 0 0 0;
 }
 
 	/* Banner */
-	#banner h1 {font-size: 3.571em; line-height: 0;}
+	#banner h1 {
+		font-size: 3.571em;
+		line-height: 1.0;
+		margin-bottom: .3em;
+	}
+
 	#banner h1 a:link, #banner h1 a:visited {
 		color: #000305;
 		display: block;
 		font-weight: bold;
-		margin: 0 0 .6em .2em;
+		margin: 0 0 0 .2em;
 		text-decoration: none;
 	}
 	#banner h1 a:hover, #banner h1 a:active {
@@ -195,19 +201,19 @@ div.figure p.caption, figure p.caption { /* margin provided by figure */
 	#banner nav {
 		background: #000305;
 		font-size: 1.143em;
-		height: 40px;
+		overflow: auto;
 		line-height: 30px;
 		margin: 0 auto 2em auto;
 		padding: 0;
 		text-align: center;
-		width: 800px;
+		max-width: 800px;
 
 		border-radius: 5px;
 		-moz-border-radius: 5px;
 		-webkit-border-radius: 5px;
 	}
 
-	#banner nav ul {list-style: none; margin: 0 auto; width: 800px;}
+	#banner nav ul {list-style: none; margin: 0 auto; max-width: 800px;}
 	#banner nav li {float: left; display: inline; margin: 0;}
 
 	#banner nav a:link, #banner nav a:visited {
@@ -242,7 +248,7 @@ div.figure p.caption, figure p.caption { /* margin provided by figure */
 	margin-bottom: 2em;
 	overflow: hidden;
 	padding: 20px;
-	width: 760px;
+	max-width: 760px;
 
 	border-radius: 10px;
 	-moz-border-radius: 10px;
@@ -253,7 +259,7 @@ div.figure p.caption, figure p.caption { /* margin provided by figure */
 	border: 2px solid #eee;
 	float: right;
 	margin: 0.786em 2em 0 5em;
-	width: 248px;
+	max-width: 248px;
 }
 #featured figure img {display: block; float: right;}
 
@@ -271,7 +277,7 @@ div.figure p.caption, figure p.caption { /* margin provided by figure */
 	margin-bottom: 2em;
 	overflow: hidden;
 	padding: 20px 20px;
-	width: 760px;
+	max-width: 760px;
 
 	border-radius: 10px;
 	-moz-border-radius: 10px;
@@ -305,15 +311,15 @@ div.figure p.caption, figure p.caption { /* margin provided by figure */
 	/* Blogroll */
 	#extras .blogroll {
 		float: left;
-		width: 615px;
+		max-width: 615px;
 	}
 
-	#extras .blogroll li {float: left; margin: 0 20px 0 0; width: 185px;}
+	#extras .blogroll li {float: left; margin: 0 20px 0 0; max-width: 185px;}
 
 	/* Social */
 	#extras .social {
 		float: right;
-		width: 175px;
+		max-width: 175px;
 	}
 
 	#extras div[class='social'] a {
@@ -359,20 +365,20 @@ div.figure p.caption, figure p.caption { /* margin provided by figure */
 	overflow: hidden;
 	padding: 20px;
 	text-align: left;
-	width: 760px;
+	max-width: 760px;
 
 	border-radius: 10px;
 	-moz-border-radius: 10px;
 	-webkit-border-radius: 10px;
 }
 
-#about .primary {float: left; width: 165px;}
+#about .primary {float: left; max-width: 165px;}
 #about .primary strong {color: #C64350; display: block; font-size: 1.286em;}
 #about .photo {float: left; margin: 5px 20px;}
 
 #about .url:link, #about .url:visited {text-decoration: none;}
 
-#about .bio {float: right; width: 500px;}
+#about .bio {float: right; max-width: 500px;}
 
 /*
 	Footer
@@ -410,7 +416,7 @@ li:first-child .hentry, #content > .hentry {border: 0; margin: 0;}
 		position: relative;
         float: left;
 		top: 0.5em;
-		width: 190px;
+		max-width: 190px;
 	}
 
 	/* About the Author */
@@ -453,12 +459,12 @@ li:first-child .hentry, #content > .hentry {border: 0; margin: 0;}
 	#comments-list li:nth-child(2n) blockquote {background: #F5f5f5;}
 
 	/* Add a Comment */
-	#add-comment label {clear: left; float: left; text-align: left; width: 150px;}
+	#add-comment label {clear: left; float: left; text-align: left; max-width: 150px;}
 	#add-comment input[type='text'],
 	#add-comment input[type='email'],
-	#add-comment input[type='url'] {float: left; width: 200px;}
+	#add-comment input[type='url'] {float: left; max-width: 200px;}
 
-	#add-comment textarea {float: left; height: 150px; width: 495px;}
+	#add-comment textarea {float: left; height: 150px; max-width: 495px;}
 
 	#add-comment p.req {clear: both; margin: 0 .5em 1em 0; text-align: right;}
 
diff --git a/pelican/themes/notmyidea/templates/base.html b/pelican/themes/notmyidea/templates/base.html
index 6be5f1d8..2b302899 100644
--- a/pelican/themes/notmyidea/templates/base.html
+++ b/pelican/themes/notmyidea/templates/base.html
@@ -3,6 +3,7 @@
 <head>
         {% block head %}
         <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <meta name="generator" content="Pelican" />
         <title>{% block title %}{{ SITENAME }}{%endblock%}</title>
         <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/{{ CSS_FILE }}" />