Groups empty state is misaligned

Summary

Groups empty state is looks misaligned.

Steps to reproduce

Go to /dashboard/groups when you don't have any groups associated with your account.

What is the current bug behavior?

Groups empty state should follow the layout used in other empty states, like in /dashboard/todos.

What is the expected correct behavior?

  1. Inner content layout should have max-width: 900px.
  2. Inner content should use flex layout more efficiently, like in /dashboard/todos.
  3. Text content should be restricted to having max-width: 480px (following gitlab-ce#37867).

Relevant logs and/or screenshots

Current Proposed
Screen_Shot_2018-09-11_at_11.33.07 Screen_Shot_2018-09-11_at_11.52.17

To explain better point [2] Inner content should use flex layout more efficiently, I'm adding some screenshots for both groups and todos using some arbitrary widths:

1280px 780px 480px
w1280-todos w780-todos w480-todos
w1280-groups w780-groups w480-groups
Edited by George Tsiolis