diff --git a/index.html b/index.html
index b29ae9c..6c25d01 100644
--- a/index.html
+++ b/index.html
@@ -4,15 +4,16 @@
 ---
 
 <header class='hero'>
-  <h3>Sat. March 19, 2016</h3>
+  <div class='hero-content'>
+    <h3>Sat. March 19, 2016</h3>
 
-  <h1 class='logo'>
-    {% include bbhd-logo.svg %}
-  </h1>
-  <h2>When you come to a fork in the road, take it.</h2>
-  <h5>—Yogi Berra</h5>
+    <h1 class='logo'>
+      {% include bbhd-logo.svg %}
+    </h1>
+    <h2>When you come to a fork in the road, take it.</h2>
+    <h5>—Yogi Berra</h5>
 
+    {% include pick-your-city-index.html %}
 
-  {% include pick-your-city-index.html %}
-
+  </div>
 </header>
diff --git a/js/app.js b/js/app.js
index 0777d87..26813a6 100644
--- a/js/app.js
+++ b/js/app.js
@@ -17,11 +17,11 @@ $(document).ready(function() {
 });
 
 function assignIndexHeroHeight() {
-  var $body = $('body');
   var $window = $(window);
   var $hero = $('.hero');
-  var $cities = $hero.find('.dropdown-select a');
-  var $indexDropdownButton = $hero.find('.dropdown-button');
+  var $heroContent = $('.hero-content');
+  var $cities = $heroContent.find('.dropdown-select a');
+  var $indexDropdownButton = $heroContent.find('.dropdown-button');
 
   // If TypeKit hasn't loaded, button could be wrapping on
   // smaller screens and therefore too large.
@@ -29,7 +29,7 @@ function assignIndexHeroHeight() {
   $indexDropdownButton.css('white-space', 'nowrap');
 
   var buttonHeight = $indexDropdownButton.height();
-  var minHeight = $body.height() + (buttonHeight * ($cities.length + 1));
+  var minHeight = $heroContent.height() + (buttonHeight * ($cities.length + 1));
   var windowHeight = $window.height();
 
   if (windowHeight > minHeight) {