Fixing broken layout when username is too long.

Adding max-width attribute to username field. Showing ellipsis when text
overflows
Adding media queries to provide a better layout when browsing on tablets
or mobile.
Fixes Bug 1038920
Got it. I forgot about the "Contact Organizer" section. It does indeed look weird. I will remove the centering for `.audience`