Mobile-first solution using Flexbox and semantic Html

What are you most proud of, and what would you do differently next time?

Even if I didn't learn anything special because I already had the basics for this challenge (Of course, there's always room for improvement) I'm still proud to have completed this challenge, because it's another step towards achieving my goals, and it has an impact on my reward system, my motivation and the positive dynamic I want to maintain.

What challenges did you encounter, and how did you overcome them?

Getting the effect on the hover to be perfect is the hardest part of this challenge. Unfortunately I haven't found the perfect solution, so I've simply put in a simple hover effect with an ease-out transition and a transition time of 1s. It doesn't look as good, but it's simple and effective.

What specific areas of your project would you like help with?

Specifically... how do you find the perfect transition for the button... it needs to be able to turn green instantly on hover/focus and dissipate more slowly when the hover/focus leaves the button.