title: Responsive menu not working for small screens
body: <p>I am trying to create a responsive navigation menu. I found some tutorials online and after finding one that I liked the style of, I followed the directions to create it on my website, but I can't seem to get a couple features working.</p>
  
  <p>1: I can't get the hover effect to work that adds a bottom border to the icons/links to help accent the one that is in focus.</p>
  
  <p>2: When getting down to a screen size that is below 32.5em (519px), the menu is supposed to become a single column menu that folds up. The menu does become a single column, but it doesn't fold up into a button like it is supposed to. It keeps displaying all of the links which takes up a lot of vertical space.</p>
  
  <pre><code>Here is a jsFiddle of my project so you can see what I have so far:
  https://jsfiddle.net/4Ljs1bfn/1/
  </code></pre>