Underline link css animation

Site URL: https://mouse-cow-ym3g.squarespace.com/

Hello,

I'm attempting to animate the underline of my footer links on hover. I achieved the desired affect in my Services section, the line animates from left to right on hover.

In my footer, the underline shows up on hover but it's below the entire block, and the width of the entire block, rather than only below each link.

I would so appreciate any insight.

Site password: Bodyforme

Incorrect password. Can you check again?

Sorry @tuanphan, it's Bodyforme 

If you use position: absolute; for a:after or a:before, you need to setup position:relative; for a

#footerBlocksMiddle a {
    position: relative;
}

You are a lifesaver @tuanphan !!!

@mbockmaster @tuanphan - I am also trying to achieve the link animation on my footers but am having trouble finding code to work on my links. Could y'all help? 

Thanks!