diff --git a/www/.layout.gohtml b/www/.layout.gohtml
index 8263e94..62ed35c 100644
--- a/www/.layout.gohtml
+++ b/www/.layout.gohtml
@@ -16,11 +16,12 @@
 	<!-- FontAwesome -->
 	<link rel="stylesheet" type="text/css" href="/vendor/FontAwesome/css/fa-svg-with-js.css">
 
-	<!-- Kirsle.net Solar -->
-	<link rel="stylesheet" type="text/css" media="screen" href="/solar/ui.css">
-	<link rel="stylesheet" type="text/css" media="print" href="/solar/print.css">
+	<!-- Kirsle.net Flare -->
+	<link rel="stylesheet" type="text/css" href="/flare/ui.css">
+
 	<link rel="stylesheet" type="text/css" href="/solar/monokai.css">
 	<link rel="stylesheet" type="text/css" href="/solar/vim-syntax.css">
+
 	<link rel="alternate" type="application/rss+xml" title="Kirsle's RSS Feed" href="/blog/rss">
 </head>
 <body>
@@ -29,19 +30,20 @@
 	<a href="#navbar" class="btn btn-primary"><i class="fas fa-bars"></i></a>
 </div>
 
-<div class="k-supernova"></div>
+<div class="brand d-lg-none">
+	<a href="/">
+		<img src="/flare/cjk-48.png" width="48" height="48" alt="Kirsle.net logo">
+		Kirsle.net
+	</a>
+</div>
+
+<div class="wallpaper"></div>
 
 <div class="container-fluid">
-	<div class="row">
-		<div class="col-12 col-lg-10 col-xl-8">
-			<div class="k-kirsle" onclick="self.location='/'"></div>
-		</div>
-	</div>
-
 	<div class="row">
 
 		<div class="order-1 order-lg-12 col-12 col-lg-10 col-xl-8">
-			<div class="k-content-panel mb-4">
+			<div class="content-panel mb-4">
 				{{ if .SetupNeeded }}
 				<div class="alert alert-success">
 					Your web blog needs to be set up!
@@ -70,76 +72,64 @@
 					</p>
 				{{ end }}
 
-				<div class="k-copyright">
+				<div class="mt-4 copyright">
 					Copyright &copy; {{ Now.Format "2006" }} Noah Petherbridge &mdash; All rights reserved<br>
 					Hosted by <a href="https://www.digitalocean.com/?refcode=ea01734d3fc7">DigitalOcean</a><br>
-					Page generated in {{ printf "%.4f" .RequestDuration.Seconds }}s.
+					Page generated in <code>{{ printf "%.4f" .RequestDuration.Seconds }}s</code>.
 				</div>
 			</div>
 		</div>
 
-		<div class="order-12 order-lg-1 col-12 col-lg-2">
-			<div class="k-navpanel mb-4" id="navbar">
-				<div class="k-section">Kirsle</div>
-				<ul>
+		<div id="navbar" class="nav-panel order-12 order-lg-1 col-12 col-lg-2">
+			<div class="brand">
+				<a href="/">
+					<img src="/flare/cjk-48.png" width="48" height="48" alt="Kirsle.net logo">
+					Kirsle.net
+				</a>
+			</div>
+			<div class="mb-4 center d-lg-none">
+				<a href="#"><i class="fa fa-arrow-up"></i> Back to Top</a>
+			</div>
+			<div class="mb-4">
+				<ul class="list-unstyled">
 					<li>&#0187; <a href="/">Homepage</a> (<a href="/blog.rss">RSS</a>)</li>
 					<li>&#0187; <a href="/about">About Me</a></li>
 					<!-- <li>&#0187; <a href="/photos/albums">Photo Albums</a></li> -->
-					<li>&#0187; <a href="/wiki/Main-Page">Wiki</a></li>
+					<li>&#0187; <a href="/wiki/Main-Page">My Wiki</a></li>
 					<li>&#0187; <a href="/guestbook">Guestbook</a></li>
 					<li>&#0187; <a href="/contact">Contact Me</a></li>
+					<li>&#0187; <a href="/tagged">Blog Tags</a></li>
+					<li>&#0187; <a href="/archive">Archive</a></li>
 				</ul>
 
-				<div class="k-section">Blog Tags</div>
-				{{ RenderTags .Request false }}
-
-				<div class="k-section">Creativity</div>
-				<ul>
+				<h2>Creativity</h2>
+				<ul class="list-unstyled">
 					<li>&#0187; <a href="/rendering">3D Renderings</a></li>
-					<li>&#0187; <a href="/flash">Flash Animation</a></li>
-					<li>&#0187; <a href="/javascript">JavaScript</a></li>
-					<li>&#0187; <a href="/fonts">Fonts</a></li>
-					<li>&#0187; <a href="/doc/">Tutorials</a></li>
-					<li>&#0187; <a href="/designs">Web Design</a></li>
+					<li>&#0187; <a href="/flash">Flash Animations</a></li>
+					<li>&#0187; <a href="/javascript">JavaScript Games</a></li>
+					<li>&#0187; <a href="/fonts">TrueType Fonts</a></li>
+					<li>&#0187; <a href="/designs">Past Web Designs</a></li>
 				</ul>
 
-				<div class="k-section">Software</div>
-				<ul>
-					<li>&#0187; <a href="/rivescript">RiveScript</a></li>
-					<li>&#0187; <a href="/errorgen">Error Generator</a></li>
-					<li>&#0187; <a href="/tkcalc">Tk Calculator</a></li>
-					<li>&#0187; <a href="http://sh.kirsle.net/" target="_blank">Terminal Apps</a></li>
+				<h2>Web Tools</h2>
+				<ul class="list-unstyled">
+					<li>&#0187; <a href="/wizards/ttf2eot.cgi">TTF to EOT Font Converter</a></li>
+					<li>&#0187; <a href="/wizards/ps1.html">Bash $PS1 Prompt Generator</a></li>
+					<li>&#0187; <a href="/wizards/fader.cgi">Text Color Fader</a></li>
+					<li>&#0187; <a href="/wizards/translator.html">Azulian Translater</a></li>
+					<li>&#0187; <a href="/wizards/flask-session.cgi">Flask Session Viewer</a></li>
+				</ul>
+
+				<h2>Software</h2>
+				<ul class="list-unstyled">
+					<li>&#0187; <a href="/tagged/rivescript">RiveScript</a></li>
+					<li>&#0187; <a href="/errorgen">Error Message Generator</a></li>
+					<li>&#0187; <a href="/tkcalc">Perl/Tk Calculator</a></li>
 					<li>&#0187; <a href="/pccc">CyanChat Client</a></li>
 				</ul>
 
-				<div class="k-section">Web Tools</div>
-				<ul>
-					<li>&#0187; <a href="/wizards/ttf2eot.cgi">TTF to EOT</a></li>
-					<li>&#0187; <a href="/wizards/ps1.html">Bash $PS1 Prompt</a></li>
-					<li>&#0187; <a href="/wizards/fader.cgi">Text Fader</a></li>
-					<li>&#0187; <a href="/wizards/favicon.cgi">Favicons</a></li>
-					<li>&#0187; <a href="/wizards/distance.cgi">Distance Calc</a></li>
-					<li>&#0187; <a href="/wizards/translator.html">Azulian Translater</a></li>
-					<li>&#0187; <a href="/wizards/xbmask.cgi">XBM Masks</a></li>
-					<li>&#0187; <a href="/wizards/flask-session.cgi">Flask Session</a></li>
-				</ul>
-
-				<div class="k-section">Subdomains</div>
-				<ul>
-					<li>&#0187; <a href="https://rophako.kirsle.net/">Rophako CMS</a></li>
-					<li>&#0187; <a href="https://mc.kirsle.net/">Minecraft Server</a></li>
-					<li>&#0187; <a href="https://rpm.kirsle.net/">Linux RPMs</a></li>
-				</ul>
-
-				<div class="k-section">Miscellany</div>
-				<ul>
-					<li>&#0187; <a href="/firered">Pok&#0233;mon Fuchsia City</a></li>
-					<li>&#0187; <a href="/msdos">DOS and Windows</a></li>
-					<li>&#0187; <a href="/raspberrypi">Raspberry Pi</a></li>
-				</ul>
-
-				<div class="k-section">Social Links</div>
-				<ul>
+				<h2>Out of Network</h2>
+				<ul class="list-unstyled">
 					<li>&#0187; <a href="https://www.google.com/+NoahPetherbridge" rel="me">Google+</a></li>
 					<li>&#0187; <a href="https://www.facebook.com/noah.lee.petherbridge" rel="me">Facebook</a></li>
 					<li>&#0187; <a href="https://twitter.com/kirsle" rel="me">Twitter</a></li>
@@ -150,36 +140,7 @@
 					<li>&#0187; <a href="https://www.npmjs.org/~kirsle" rel="me">npm</a></li>
 				</ul>
 
-				<div class="k-section">Fan Club</div>
-				<ul>
-					{{ if .LoggedIn }}
-						<li>&#0164; Hi, <big><a href="/account">{{ or .CurrentUser.Name .CurrentUser.Username }}</a></big></li>
-						{{ if .CurrentUser.Admin }}
-							<li>&#0187; <a href="/admin">Admin Center</a></li>
-						{{ end }}
-						<li>&#0187; <a href="/blog/edit">Update Blog</a></li>
-						<li>&#0187; <a href="/blog/drafts">Drafts</a>/<a href="/blog/private">Private</a></li>
-						<li>&#0187; <a href="/logout">Log Out</a>
-					{{ else }}
-						<li id="login-link">&#0187; <a href="/login" class="login-link">Log In</a></li>
-					{{ end }}
-				</ul>
-				<div id="login-inline" style="display: none">
-					<form action="/login" method="POST">
-					<input type="hidden" name="_csrf" value="{{ .CSRF }}">
-					<input type="hidden" name="next" value="{{ .Path }}">
-					<input type="text" class="form-control" size="4" name="username" style="display: inline; width: 45%">
-					<input type="password" class="form-control" size="4" name="password" style="display: inline; width: 45%">
-					<br>
-					<button type="submit" class="btn btn-primary" style="width: 100%">Log In</button>
-					</form>
-				</div>
-
 				<div class="center">
-					<a href="https://www.python.org/" target="_blank">
-						<img src="/static/images/python.png" width="80" height="15" alt="Python powered">
-					</a><br>
-
 					<a href="https://validator.w3.org/check?uri=referer">
 						<img src="/static/images/html5.png" width="80" height="15" alt="W3C Valid HTML5">
 					</a><br>
@@ -193,6 +154,32 @@
 					</a>
 				</div>
 
+				<ul class="list-unstyled">
+					{{ if .LoggedIn }}
+						<li>&#0164; Hi, <big><a href="/account">{{ or .CurrentUser.Name .CurrentUser.Username }}</a></big></li>
+						{{ if .CurrentUser.Admin }}
+							<li>&#0187; <a href="/admin">Admin Center</a></li>
+						{{ end }}
+						<li>&#0187; <a href="/blog/edit">Update Blog</a></li>
+						<li>&#0187; <a href="/blog/drafts">Drafts</a>/<a href="/blog/private">Private</a></li>
+						<li>&#0187; <a href="/logout">Log Out</a>
+					{{ else }}
+						<li id="login-link">
+							<small><a href="/login" class="login-link text-muted">Log In</a></small>
+						</li>
+					{{ end }}
+				</ul>
+				<div id="login-inline" style="display: none">
+					<form action="/login" method="POST">
+					<input type="hidden" name="_csrf" value="{{ .CSRF }}">
+					<input type="hidden" name="next" value="{{ .Path }}">
+					<input type="text" class="form-control" size="4" name="username" style="display: inline; width: 46%">
+					<input type="password" class="form-control" size="4" name="password" style="display: inline; width: 46%">
+					<br>
+					<button type="submit" class="btn btn-primary" style="width: 100%">Log In</button>
+					</form>
+				</div>
+
 			</div>
 		</div>
 
@@ -200,11 +187,11 @@
 
 </div>
 
-<script type="text/javascript" src="/js/jquery-2.1.0.min.js"></script>
-<script type="text/javascript" src="/js/offsite.js"></script>
-<script type="text/javascript" src="/js/bootstrap.min.js"></script>
-<script type="text/javascript" src="/vendor/FontAwesome/js/fontawesome-all.min.js"></script>
-<script type="text/javascript">
+<script src="/js/jquery-2.1.0.min.js"></script>
+<script src="/js/offsite.js"></script>
+<script src="/js/bootstrap.min.js"></script>
+<script src="/vendor/FontAwesome/js/fontawesome-all.min.js"></script>
+<script>
 	$(document).ready(function() {
 		$(".login-link").click(function() {
 			$("#login-link").hide();
diff --git a/www/about.gohtml b/www/about.gohtml
index 73c064e..8ba1401 100644
--- a/www/about.gohtml
+++ b/www/about.gohtml
@@ -5,76 +5,80 @@
 
 <div class="row">
 	<div class="col-2 markdown">
-		<img src="/static/photos/ff7ec4f5.jpg" class="img-responsive portrait" alt="Kirsle"><p>
+		<img src="https://www.kirsle.net/static/photos/ff7ec4f5.jpg" class="img-responsive portrait" alt="Kirsle"><p>
 
 		&#0164; <a href="/contact">Send me an e-mail</a>
 	</div>
 
 	<div class="col-10">
-		<h2>Hello world!</h2>
+		<h2 class="mt-0">Hello world!</h2>
 
-		My name is <strong>Noah</strong> and this is my website. I am a 30-year-old software
-		engineer who lives in Los Angeles. My areas of expertise are primarily in Perl and
-		Python back-end software development, however I believe I have a knack for the front
-		end as well.<p>
+		<p>My name is <strong>Noah</strong> and this is my website, where I primarily keep
+		my blog. I'm a 30 year-old software engineer living in Los Angeles.</p>
 
-		I built Kirsle.net from the ground up. Its back-end code has been rewritten a
-		dozen different times, in two different languages. I made the web design in Photoshop and
-		pieced it together using standards compliant HTML 5 (the spec, not the
-		buzzword), CSS and a little bit of JavaScript. The back end is entirely written
-		in Python. The previous version of Kirsle.net was written in Perl and ran on my
-		"PerlSiikir" CMS. I rewrote it in Python
-		<a href="/blog/entry/goodbye-perlsiikir">for various reasons</a>, and I like Python
-		more these days anyway. <img src="/static/smileys/tango/wink.png" alt=";)"><p>
+		<p>My interests include programming, creative writing, various forms of what could
+		be loosely defined as "art," including some dabbling with 3D modeling and
+		Flash animations. I'm a "high functioning introvert," and when I manage to
+		get out of the house, I like to go hiking with my dog and my partner. For
+		several years I could be found at Disneyland every couple of weekends.</p>
 
-		Besides being a rockstar at back end development and a pretty decent web designer,
-		I've dabbled in some 3D modeling, Flash animation and other artistic things.
-		You can find them under the "Creativity" section on the left navigation. :)<p>
+		<h3>Music Taste</h3>
 
-		Some of my personal projects are listed under the "Software" section to your
-		left. The rest you'll find on my
-		<a href="https://github.com/kirsle">GitHub page</a> and
-		<a href="http://search.cpan.org/~kirsle">CPAN profile</a>.
+		<p>I don't listen to music much, instead tending to work in silence, but when
+		I do, these are some artists I'm into recently (links open to a YouTube
+		video of a song of theirs that I like):</p>
 
-		<h2>Kirsle?</h2>
-
-		Where did I come up with the name Kirsle? Long-ish story, but here's the cliffnotes:
-
-		<ul>
-			<li>In 1997 when the Internet was still brand new, They didn't want us
-				using our real names online so I always went by one screen name or
-				another.</li>
-			<li>The game <em>NiGHTS: Into Dreams...</em> for the Sega Saturn had an
-				enemy on some levels named Kircle, and I liked the name but I read
-				it as though the "C" were pronounced like an "S". Nonetheless, it
-				became my screen name.</li>
-			<li>People often pronounced it with a hard "C". The last straw was when
-				I discovered that Text-to-Speech software also pronounced it this way.</li>
-			<li>I re-spelled it as Kirsle so it was spelled how I wanted it to be
-				pronounced.</li>
-			<li>In doing so, I created the most unique name ever. All of the Google
-				search results for Kirsle are about me!</li>
+		<ul class="list-inline">
+			<li class="list-inline-item">
+				<a href="https://www.youtube.com/watch?v=NAS5Z1GvxrQ" title="Tearing Me Up">Bos Moses</a>
+			</li>
+			<li class="list-inline-item">
+				<a href="https://www.youtube.com/watch?v=ExVtrghW5Y4" title="Sweatpants">Childish Gambino</a>
+			</li>
+			<li class="list-inline-item">
+				<a href="https://www.youtube.com/watch?v=IPfJnp1guPc" title="Young Dumb &amp; Broke">Khalid</a>
+			</li>
+			<li class="list-inline-item">
+				<a href="https://www.youtube.com/watch?v=eP4eqhWc7sI" title="Lust For Life">Lana Del Rey</a>
+			</li>
+			<li class="list-inline-item">
+				<a href="https://www.youtube.com/watch?v=S95INavMofc" title="Beacon">RY X</a>
+			</li>
+			<li class="list-inline-item">
+				<a href="https://www.youtube.com/watch?v=wycjnCCgUes" title="Feels Like We Only Go Backwards">Tame Impala</a>
+			</li>
 		</ul>
 
-		Later on I turned Kirsle into a full Internet alias/fake name of
-		Casey Kirsle, which I used as my name for several years online (some of
-		my older Perl modules on CPAN are signed by this name). <em>That</em> was
-		mostly because I like the name Casey, and Kirsle could plausibly sound like
-		a last name. <img src="/static/smileys/tango/wink.png" alt=";)"><p>
+		<p>I'll add more when I'm motivated.</p>
 
-		<h2>Kirsle.net is Open Source</h2>
+		<h2>Geeky Stuff</h2>
 
-		The Python code that powers Kirsle.net is an open source project of mine named
-		<a href="http://rophako.kirsle.net/">Rophako</a>. It means "Website" in
-		<a href="/wizards/translator.html">Azulian</a>. The Rophako CMS is open source
-		software that I released under the GNU General Public License and you can
-		<a href="https://github.com/kirsle/rophako">clone it on GitHub</a>. The HTML
-		files for Kirsle.net are <a href="https://github.com/kirsle/kirsle.net">also
-		on GitHub</a>, but those probably aren't very interesting to you.<p>
+		<p>This website is open source. I wrote the back-end in Go this time at
+		<a href="https://github.com/kirsle/blog">kirsle/blog</a>, and my front-end
+		template files are readable <a href="https://github.com/kirsle/kirsle.net">on GitHub</a>
+		too. But those aren't very interesting.</p>
 
-		The CMS supports a web blog, photo albums, comments, and subscriptions to comments
-		(so that your guests can watch a comment thread for future posts by others). I'm
-		always improving it and adding new features.
+		<p>Having learned to make websites in the early 2000's, I think we should
+		return to the days of <a href="http://dynamicdrive.com/">Dynamic HTML</a>
+		instead of these overly bloated web applications. My website speaks <a href="https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol">HTTP</a>,
+		serves <a href="https://en.wikipedia.org/wiki/HTML">HTML</a> pages, has <code>&lt;form&gt;</code>s that actually <code>POST</code>,
+		and the little bits of JavaScript I add are to enhance the experience slightly.
+		My website works fine with all scripts disabled.</p>
+
+		<p>I somewhat miss the earlier Internet days when websites had background
+		images rather than racing to the bottom with simplicity. My website has been described as
+		"hipster," but I like it this way, and it's
+		<a href="https://validator.w3.org/check?uri=referer">HTML5 standards compliant</a>.
+		Usually.</p>
+
+		<h3>Privacy</h3>
+
+		In this post-<a href="https://en.wikipedia.org/wiki/Edward_Snowden">Snowden</a>
+		era, maybe we should be more privacy conscious. Kirsle.net does not use any third-party
+		advertisements or analytics tools. I <a href="/do-you-need-to-store-that-ip-address">don't want to know</a>
+		your IP address, either. My website handles its own blog comments, rather than
+		using something like Disqus, which invades your privacy as you visit the websites
+		that use it.
 	</div>
 </div>
 
diff --git a/www/blog/tags.partial.gohtml b/www/blog/tags.partial.gohtml
index dbfa111..560464b 100644
--- a/www/blog/tags.partial.gohtml
+++ b/www/blog/tags.partial.gohtml
@@ -1,13 +1,13 @@
 {{ if .IndexView }}
     Sorted by most frequently used:
 
-    <ul>
+    <ul class="list-unstyled">
     {{ range .Tags }}
         <li><a href="/tagged/{{ .Name }}">{{ .Name }}</a> ({{ .Count }})</li>
     {{ end }}
     </ul>
 {{ else }}
-    <ul>
+    <ul class="list-unstyled">
         <li>&#0187; <a href="/archive">Blog Archives</a></li>
         {{ range .Tags }}
             {{ if ge .Count 8 }}
diff --git a/www/flare/blue-dust.png b/www/flare/blue-dust.png
new file mode 100644
index 0000000..3410421
Binary files /dev/null and b/www/flare/blue-dust.png differ
diff --git a/www/flare/cjk-128.png b/www/flare/cjk-128.png
new file mode 100644
index 0000000..4d118e0
Binary files /dev/null and b/www/flare/cjk-128.png differ
diff --git a/www/flare/cjk-16.png b/www/flare/cjk-16.png
new file mode 100644
index 0000000..27a52b0
Binary files /dev/null and b/www/flare/cjk-16.png differ
diff --git a/www/flare/cjk-256.png b/www/flare/cjk-256.png
new file mode 100644
index 0000000..fc04256
Binary files /dev/null and b/www/flare/cjk-256.png differ
diff --git a/www/flare/cjk-32.png b/www/flare/cjk-32.png
new file mode 100644
index 0000000..ed776b9
Binary files /dev/null and b/www/flare/cjk-32.png differ
diff --git a/www/flare/cjk-48.png b/www/flare/cjk-48.png
new file mode 100644
index 0000000..cd0421c
Binary files /dev/null and b/www/flare/cjk-48.png differ
diff --git a/www/flare/cjk-96.png b/www/flare/cjk-96.png
new file mode 100644
index 0000000..c1279e6
Binary files /dev/null and b/www/flare/cjk-96.png differ
diff --git a/www/flare/purple-star.jpg b/www/flare/purple-star.jpg
new file mode 100644
index 0000000..c7df922
Binary files /dev/null and b/www/flare/purple-star.jpg differ
diff --git a/www/flare/starscape.png b/www/flare/starscape.png
new file mode 100644
index 0000000..f33f75f
Binary files /dev/null and b/www/flare/starscape.png differ
diff --git a/www/flare/ui.css b/www/flare/ui.css
new file mode 100644
index 0000000..68d7de2
--- /dev/null
+++ b/www/flare/ui.css
@@ -0,0 +1,354 @@
+body {
+    background-color: #000000;
+    background-image: url("/flare/starscape.png");
+    background-attachment: fixed;
+    line-height: 1.6rem;
+    color: #BEBEBE;
+    margin: 0;
+    padding: 0;
+}
+
+a:link, a:visited {
+    color: #99CCFF;
+    text-decoration: underline;
+}
+a:hover, a:active {
+    color: #FFCCFF;
+}
+a img {
+    border: 0;
+}
+
+h1, h2, h3, h4,
+.h1, .h2, .h3, .h4 {
+    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
+    color: #FFFFFF;
+    text-shadow: 0 0 10px #0099FF;
+}
+h2, h3, h4 {
+    color: #BBDDFF;
+}
+
+pre, code {
+    font-family: "Lucida Console", "DejaVu LGC Sans Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Ubuntu Mono", monospace;
+    color: #FF9900;
+}
+pre {
+    display: block;
+    background-color: rgba(0, 0, 0, 0.5);
+    border: 1px dashed #CCCCCC;
+    padding: 10px;
+    margin: 10px 5px;
+    max-height: 550px;
+    overflow: auto;
+}
+
+label {
+    cursor: pointer;
+}
+legend {
+    color: #0099FF;
+}
+
+table.box {
+    border: 1px solid #999999;
+}
+
+input[type="text"],
+input[type="password"],
+input[type="number"],
+input[type="email"],
+textarea,
+input[type="file"],
+select {
+    background-color: rgba(0, 0, 0, .5) !important;
+    border: 1px solid #999 !important;
+    font-family: Arial, Helvetica, sans-serif;
+    color: #FFF;
+    margin: 2px 0;
+}
+input:focus, textarea:focus, select:focus {
+    border: 1px solid #069 !important;
+    color: #FFF !important;
+}
+
+/* Bootstrap CSS overrides */
+p {
+    margin: 10px 0;
+}
+.text-muted {
+    color: #959595 !important;
+}
+ul, ul ul, ol ul, ul ol, ol ol {
+    margin: 10px 0;
+}
+li > ul, li > ol {
+    /* embedded list */
+    margin: 0;
+}
+blockquote {
+    margin: 20px 0;
+}
+.card {
+    background-color: transparent;
+    border: 1px dashed #006699;
+}
+
+/* Mobile responsiveness */
+.mobile-nav {
+    display: none;
+}
+@media (max-width: 990px) {
+    body {
+        background-image: url("/flare/blue-dust.png");
+        background-attachment: scroll;
+    }
+    .mobile-nav {
+        display: block;
+        position: absolute;
+        z-index: 100;
+        top: 10px;
+        right: 10px;
+    }
+    .wallpaper {
+        display: none;
+    }
+}
+
+/*******************************************************************************
+ * General CSS Classes                                                         *
+ ******************************************************************************/
+
+.center {
+	margin: auto;
+	text-align: center
+}
+.right {
+	margin-left: auto;
+	margin-right: 0px;
+	text-align: right
+}
+.invisible {
+	display: none
+}
+.clear {
+	clear: both;
+}
+
+.markdown table,
+table.table,
+table.table th,
+table.table td {
+	border: 1px solid #999999;
+}
+
+.markdown table,
+table.table {
+	border-collapse: collapse;
+	border-spacing: 0;
+	margin: 10px 0px;
+	padding: 0px;
+}
+
+table.table-wide {
+	width: 100%;
+}
+
+.markdown table th,
+table.table th {
+	background-color: #003366;
+	color: #FFFFFF;
+	text-align: left;
+	padding: 4px;
+}
+
+.markdown table tr:nth-child(even),
+table.table tr:nth-child(even) {
+	background-color: #000000;
+}
+
+.markdown table tr:nth-child(odd),
+table.table tr:nth-child(odd) {
+	background-color: #202020;
+}
+
+.markdown table td,
+table.table td {
+	padding: 4px;
+	vertical-align: top;
+	text-align: left;
+}
+
+/* Make a photo look nice. */
+.portrait, .markdown img {
+	display: inline;
+	background-color: #CFCFCF;
+	padding: 4px;
+	border: 1px solid #000000;
+	box-shadow: 0px 0px 4px #0099FF;
+}
+
+/* Responsive images in markdown */
+.markdown img {
+	max-width: 100%;
+	height: auto;
+}
+
+/*******************************************************************************
+ * Styles Needed by Specific Pages in the CMS                                  *
+ ******************************************************************************/
+
+/* Downloads */
+
+.distro {
+	border: 1px solid #CCCCCC
+}
+.distro th {
+	width: 150px;
+	text-align: center;
+	vertical-align: top
+}
+.distro td {
+	width: 150px;
+	text-align: center;
+	vertical-align: top;
+	border: 1px solid #808080
+}
+.distro td img {
+	float: left
+}
+
+/********
+ * Blog *
+ *******/
+
+.blog-title {
+	display: block;
+	padding-bottom: 0;
+}
+
+/* Blog titles when shown on index view */
+a.blog-title:link, a.blog-title:visited {
+	font-family: "Trebuchet MS",Verdana,Arial,sans-serif;
+	font-size: 32pt;
+	font-weight: bold;
+	color: #FFFFFF;
+	text-shadow: 0px 0px 10px #0099FF;
+	-moz-text-shadow: 0px 0px 10px #0099FF;
+	-webkit-text-shadow: 0px 0px 10px #0099FF
+}
+a.blog-title:hover, a.blog-title:active {
+	text-decoration: underline;
+	text-shadow: 0px 0px 10px #FF99FF;
+	-moz-text-shadow: 0px 0px 10px #FF99FF;
+	-webkit-text-shadow: 0px 0px 10px #FF99FF
+}
+
+.blog-meta .blog-private,
+.blog-meta .blog-unlisted,
+.blog-meta .blog-draft,
+.blog-meta .blog-sticky {
+	font-weight: bold;
+	font-style: normal;
+}
+
+.blog-meta .blog-private,
+.blog-meta .blog-unlisted {
+	color: #FF9900;
+}
+
+.blog-meta .blog-draft {
+	color: #00FFFF;
+}
+
+.blog-meta .blog-sticky {
+	color: #FF99FF;
+}
+
+/* Timestamp and author line below blog titles */
+.blog-meta, .comment-meta {
+	font-size: smaller;
+	font-style: italic;
+	margin-top: 1rem;
+	margin-bottom: 2rem;
+}
+.comment-meta {
+	margin-top: 0;
+	margin-bottom: 1rem;
+}
+
+/* TODO */
+ul.blog-categories {
+	list-style: none;
+	display: inline;
+	margin: 0;
+	padding: 0;
+}
+ul.blog-categories li {
+	display: inline;
+}
+ul.blog-categories li:after {
+	content: ", ";
+}
+ul.blog-categories li:last-child:after {
+	content: "";
+}
+
+/*******************************************************************************
+ * Kirsle.net Flare Design                                                     *
+ ******************************************************************************/
+
+.wallpaper {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 1920px;
+    height: 1080px;
+    background-image: url("/flare/purple-star.jpg");
+    background-repeat: no-repeat;
+    z-index: 0;
+}
+
+.brand, .brand a {
+    text-align: center;
+    margin: 20px auto;
+    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
+    font-size: 24pt;
+    line-height: 48px;
+    font-style: italic;
+    text-decoration: none;
+    color: #FFFFFF;
+}
+
+.nav-panel, .content-panel {
+    background-color: rgba(0, 0, 0, 0.6);
+}
+.nav-panel h2 {
+    font-size: 18pt;
+    text-align: center;
+    border-bottom: 2px ridge #0099FF;
+}
+
+.content-panel {
+    border: 2px ridge #0099FF;
+    border-radius: 10px;
+    margin-top: 100px;
+    margin-left: 40px;
+    padding: 16px;
+}
+
+.copyright {
+    text-align: center;
+    font-size: smaller;
+    font-style: italic;
+}
+.copyright code {
+    color: inherit;
+}
+
+@media (max-width: 990px) {
+    .content-panel {
+        margin-left: 0;
+        margin-top: 20px;
+    }
+}
diff --git a/www/index.gohtml b/www/index.gohtml
index cc2960a..e1bd119 100644
--- a/www/index.gohtml
+++ b/www/index.gohtml
@@ -1,10 +1,28 @@
 {{ define "title" }}Welcome!{{ end }}
 {{ define "content" }}
-<h1>Welcome!</h1>
+<h1>Welcome to <em>Kirsle.net!</em></h1>
 
-Welcome to <a href="http://www.kirsle.net/">Kirsle.net</a>! This is the personal
-website of Noah Petherbridge, and it's where my various software projects and
-web blog lives.<p>
+This is the personal homepage of <a href="/about">Noah Petherbridge</a>, and
+it's where I keep my web blog and various creative projects.<p>
+
+I blog about anything I find interesting, and since I have a lot of varied
+interests, my blog entries are kind of <em>all over the place.</em> You can
+browse <a href="/tagged">my tags</a> to sort them by topic and
+see which ones I frequently write about, or the <a href="/archive">archive</a>
+has a complete history of my posts, dating back to 2008!<p>
+
+Besides my blog, I have pages for my creative projects, which are linked to on
+the <a href="#navbar">navigation bar</a>.<p>
+
+I write a lot about <a href="/tagged/Linux">Linux</a> and <a href="/tagged/Android">Android</a>,
+<a href="/tagged/Minecraft">Minecraft</a>,
+and I like to
+<a href="/tagged/Rant">rant</a> about stuff. Generally anything that
+makes me <a href="/tagged/Curiosity">curious</a>.<p>
+
+For the geeks: this website respects your privacy and doesn't run any third
+party ads or analytics. This site speaks HTTP and doesn't require any JavaScript
+to work.
 
 {{ RenderIndex .Request "" "" }}
 
