Increase contrast for the school page sidebar.

[stevenbuccini]

Fixes #1419.

I mucked around with the CSS a little more than I'd like. On my Macbook Air, the previous CSS eliminated the left/right padding, which didn't look good. The downside to adding the padding back is that on medium screensizes the text within the button breaks onto two lines easily.

I'd like some feedback on whether or not this padding change is necessary. Here's how it looks right now on my Macbook Air, browser full-paged:

[shawnbot]

The only thing that bugs me about this is the text wrapping of the first button. I would prefer that it read:

Types of
Financial Aid

@nguyenist, what do you think? This would require a bit more effort to get it working correctly on different screen sizes; for instance, it might not need to wrap on mobile. cc @abisker @barkimedes for visibility

[shawnbot]

And let me just say, once again: thank you for putting your time into this, @stevenbuccini! We're going to try to get this into our next release.

[shawnbot]

@jjoteal has signed off on this in #1419. Merging.

Thanks again, @stevenbuccini! 🚀

[nguyenist-zz]

@shawnbot I agree it would look cleaner! *Also coming in with fresh eyes on the project, but wouldn't spend too much time on this unless users are missing the button / having difficulty with it because of the labeled text on the button.

And yes, you're right, it seems like no wrap needed on mobile! (at least on an iPhone 6S Plus):

[stevenbuccini]

@shawnbot @nguyenist My intuition says that if you just put a   in between "of" and "financial," CSS will do the right thing® when it comes to breaking the text the way you'd like. I'll test that theory later today.

[shawnbot]

Yeah, that might do it @stevenbuccini. Although I think we'd want Types of Financial Aid and Calculate Your Aid to suggest keeping the right phrases together.