0xD34F

Вам бы про контекст наложения почитать, станет понятнее, как работает z-index.

А что конкретно можно сделать с вашим окном... можно поднять его выше в DOM-дереве, поставьте .modal-overlay на один уровень с .content, например (правда, после этого центрирование кнопки отваливается, но уверен, поправить не проблема).

https://jsfiddle.net/81d52wac/1/

Градиент от прозрачного к < имя цвета > и обратно к прозрачному, например:

background: linear-gradient(to right, transparent 10%, red 30%, red 70%, transparent 90%);

Попробуйте для .nav-profile задать следующее:

position: fixed;
right: 0;
display: inline-block;

А float: right и margin-right: 82px - вырезать.