Twenty Fourteen: How to change the size of the menu boxes

I have a lot of menu items and they dissapear at the bottom of the page and cannot be accessed. I can change the size of the font bit the boxes they appear in remain the same size. Does anybody know how to fix this?

Since I made my cry for help I have made these additions to my child theme:
This changes the font size in the menu:
.primary-navigation {
font-size: 11px;
padding-top: 0px;
}
And this changes the size of the box around the menu items:
.primary-navigation ul ul a {
padding: 14px 14px;
white-space: normal;
width: 176px;
}
It works on my pc but is this a bad thing to do?