Как сделать плавно переходящий полу-прозрачный фон?
Градиент от прозрачного к < имя цвета > и обратно к прозрачному, например:

background: linear-gradient(to right, transparent 10%, red 30%, red 70%, transparent 90%);
лень править, там все кросс-костыли найдете, просто под свою задачу поправьте:
jsfiddle.net/luissanchezm86/4Kwb4