text-align: center; has no effect in this case. You could use align-items: center; instead to center the text vertically. (It’s a Flexbox property.)
Your gradient is invalid. When you use percentage values they need to go after the color. You could also remove the percentage value and the colors are evenly applied.
This linear-gradient would make the box mostly green with a small gradient at the top and bottom: