use some <button>

_src/_includes/header.html

@@ -9,7 +9,7 @@
         </header>
 
         <nav role="navigation" class="nav-main">
-            <a class="menu-btn icon icon-list" href="#"></a>
+            <button type="button" class="menu-btn icon icon-list"></button>
             <div class="nav-popover hide">
                 <a class="nav-link goodies icon icon-gift" href="/goodies/">goodies</a>
                 <a class="nav-link photos icon icon-pictures" href="/photos/">photos</a>
@@ -20,10 +20,10 @@
         </nav>
 
         <section class="site-search">
-            <a class="search-btn icon icon-search" href="#"></a>
+            <button type="button" class="search-btn icon icon-search"></button>
             <div class="search-area">
                 <input type="search" class="form-control input-search search-field" placeholder="Search everything">
-                <a class="search-close close" href="#">&times;</a>
+                <button class="close search-close">&times;</button>
             </div>
         </section>
 

_src/assets/styl/buttons.styl

@@ -4,6 +4,19 @@
 // Buttons
 //
 
+// Reset default button element
+button
+    padding: 0
+    cursor: pointer
+    background: transparent
+    border: 0
+    -webkit-appearance: none
+
+    &:active
+        background: $link-color
+        transition: none
+        text-shadow: none
+
 .btn
     @extend .textcenter
     display: inline-block
@@ -147,14 +160,15 @@
     @extend .textcenter
     width: 16px
     height: 16px
-    line-height: 12px
-    font-size: 16px
-    padding: 0
+    line-height: 1
+    font-size: $font-size-small
     border-radius: 16px
     display: block
     background: $brand-grey-light
     color: #fff
 
-    &:hover
+    &:hover,
+    &:focus
         background: $link-color-hover
-        color: #fff
+        color: #fff
+        cursor: pointer

_src/assets/styl/navigation.styl

@@ -23,10 +23,6 @@
         transition: none
         color: #fff
 
-.search-btn
-    right: 50px
-    padding: .65em .85em
-
 
 // Main Navigation
 /////////////////////////////////////

_src/assets/styl/search.styl

@@ -4,6 +4,10 @@
 // Search
 //
 
+.search-btn
+    right: 50px
+    padding: .65em .85em
+
 .site-search
     margin-right: 4%