diff --git a/app/assets/images/logo.png b/app/assets/images/logo.png
new file mode 100644
index 0000000..30b2fa7
Binary files /dev/null and b/app/assets/images/logo.png differ
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index fe93333..1a5d0a6 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -8,3 +8,132 @@
  *
  * Consider organizing styles into separate files for maintainability.
  */
+
+header {
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}
+
+div.header {
+  padding: 10px 16px;
+  background: #0065B4;
+  color: #fff;
+  border: none;
+	display: grid;
+	grid-template-columns: 64px 1fr;
+	grid-template-rows: 1fr;
+	grid-column-gap: 15px;
+	grid-row-gap: 0;
+	align-items: center;
+}
+
+div.header h1 {
+  margin: 0;
+}
+
+nav {
+  width: 100%;
+  background: #A62227;
+  padding: 5px;
+  color: #ffffff;
+}
+
+nav button {
+  border: 1px solid black;
+}
+
+nav form {
+  display: inline-block;
+}
+
+h1, h2, ul, ol {
+  margin-top: 0;
+  margin-bottom: 5px;
+}
+
+ul, ol {
+  list-style-position: inside;
+  padding-left: 20px;
+}
+
+main {
+  padding: 20px;
+}
+
+pre {
+  display: inline;
+}
+
+body {
+  margin: 0;
+  background-color: #BBBFC8;
+}
+
+div.header a {
+  color: #fff;
+  text-decoration: none;
+}
+
+div.header a:hover {
+  text-decoration: underline solid;;
+}
+
+table.metatable {
+  border: black 2px solid;
+  background-color: #fff;
+  filter: drop-shadow(3px 3px #818181)
+}
+
+table.metatable tr:nth-child(even) {
+  background-color: #f2f2f2;
+}
+
+video {
+  border: black 2px solid;
+  background-color: #000;
+  filter: drop-shadow(8px 8px #818181)
+}
+
+table.metadata td.downloadbutton {
+  border: none;
+  display: inline-block;
+  border-top: black 2px solid;
+}
+
+table.metadata td.downloadbutton form,
+table.metadata td.downloadbutton form button {
+  width: 100%;
+}
+
+table.metadata td.downloadbutton button {
+  border: none;
+  display: inline-block;
+  border-bottom: 1px solid black;
+  border-top: black 2px solid;
+}
+
+table.metatable td.editcontrols {
+  padding: 0;
+}
+
+table.metatable td.editcontrols button {
+  border: none;
+  display: inline-block;
+  border-bottom: 1px solid black;
+  border-top: black 2px solid;
+}
+
+table.metatable td.editcontrols form:first-child  {
+  float: left;
+  width: 50%;
+}
+
+table.metatable td.editcontrols form:first-child button {
+  border-right: black 2px solid;
+  width: 100%;
+}
+
+table.metatable td.editcontrols form:last-child button {
+  width: 50%;
+}
\ No newline at end of file
diff --git a/app/helpers/clips_helper.rb b/app/helpers/clips_helper.rb
index 131c1f9..ac6e903 100644
--- a/app/helpers/clips_helper.rb
+++ b/app/helpers/clips_helper.rb
@@ -6,4 +6,16 @@ module ClipsHelper
       Time.at(seconds.round).utc.strftime("%M:%S") #=> "01:00:00"
     end
   end
+
+  def get_video_aspect(video)
+    if video.metadata["width"] and video.metadata["height"]
+      width = video.metadata["width"].round
+      height = video.metadata["height"].round
+      common_fact = width.gcd(height)
+      width_div = width / common_fact
+      height_div = height / common_fact
+      return "#{width_div}:#{height_div}"
+    end
+    return ""
+  end
 end
diff --git a/app/views/categories/show.html.erb b/app/views/categories/show.html.erb
index a93e8a1..fe9b7da 100644
--- a/app/views/categories/show.html.erb
+++ b/app/views/categories/show.html.erb
@@ -1,7 +1,6 @@
 <% cache @category do %>
-  <h1><%= @category.name %></h1>
+  <h1>Clips in the <pre><%= @category.name %></pre> category</h1>
 <% end %>
-
 <table id="clips" border="1">
   <tr>
     <th>Preview</th>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index b0d9ddc..1c6cf3d 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -17,26 +17,29 @@
     <link rel="icon" href="/icon.svg" type="image/svg+xml">
     <link rel="apple-touch-icon" href="/icon.png">
 
-    <style>
-      html {
-        color-scheme: dark;
-      }
-    </style>
-
     <%# Includes all stylesheet files in app/assets/stylesheets %>
     <%= stylesheet_link_tag :app %>
   </head>
 
   <body>
-    <h1>Misadventure</h1>
-    <nav>
-      <%= link_to "Home", root_path %>
+    <header>
+    <div class="header">
+      <div><%= image_tag("logo.png", width: 64) %></div>
+      <div>
+        <h1><em>Misadventure!</em></h1>
+      </div>
+    </div>
+        <nav>
+      <strong>Links:</strong>
+      <%= button_to "Home", root_path, method: :get %>
+      <%= button_to "Log in", new_session_path, method: :get unless authenticated? %>
       <%= button_to "Log out", session_path, method: :delete if authenticated? %>
-      <%= link_to "Login", new_session_path unless authenticated? %>
-      <%= link_to "Clips", clips_path %>
-      <%= link_to "Categories", categories_path %>
-      <%= link_to "Tags", tags_path %>
+      <%= button_to "Clips", clips_path, method: :get %>
+      <%= button_to "Categories", categories_path, method: :get %>
+      <%= button_to "Tags", tags_path, method: :get %>
     </nav>
+
+    </header>
     <main>
       <%= yield %>
     </main>