I have a question about why my text is not centered in my drop down mobile nav. (codepen included)

In the codepen link below, if you resize the image to show the drop down nav and click the "button", the drop down list is not centered. codepen link: http://codepen.io/mike316/full/qdYmom/ and if you resize the window as a far as possible, the words for the links get cut off.

But in this example, in line 174 of my code I have to add

nav ul {
  margin: 0;
  padding: 0;
}

This seems to center the text in the drop down menu. But I think I may be repeating code for example, in line 136 I have nav#nav-mobile ul. Should I add the margin: 0 and padding 0 to that part of the css instead. I'm really lost on what to do with this, and any help would be appreciated. Thank in advance. Codepen for the centered dropdown list: http://codepen.io/mike316/full/MwGmQW/