Style the default link state

Use CSS to:

  1. Give links a color of #336941
  2. Remove the default underline (hint: use the text-decoration property)

Style the visited state

After the styles for the default state:

  1. Add a new selector to style the visited state
  2. Apply a color of #11361b to the visited state

Style the hover state

After the styles for the visited state:

  1. Add a new selector to style the hover state
  2. For this state, apply a color of #057a25
  3. Re-apply the underline you removed from the default state

You can test the style by hovering your mouse over the link.

Style the focus state

After the styles for the hover state:

  1. Add a new selector to style the focus state
  2. For this state, apply a color of #057a25, the same as on the hover state. (But here we won't apply the underline.)

You can test the style by first clicking in the preview area above the link, then using your keyboard to tab through the content.

Style the active state

After the styles for the focus state:

  1. Add a new selector to style the active state
  2. For this state, apply a color of #0bd943

You can test the style by using your keyboard to tab through the content.