Firefox CSS specific code not working

Hi,

I have this page:
http://myultratrust.com/index1.html

The two rotating images are off a bit by around 2 pixels. You can see the blue horizontal bar is slightly off to the left of the couple with the laptop.

I read on stackoverflow that this should work:

/* for ei-slider */
#family_img img {
    height: 415px !important;
    margin-left: -37px !important; /*sanjay - -9px*/
    margin-top: 62px !important;
    width: 585px !important;
}

#young_couple img {
    margin: 1px 0px 0px -34px !important; /*sanjay - no margin for this image*/
    height: 458px !important;
}

@-moz-document url-prefix() {
    #family_img img {height: 417px;}
    #young_couple img {height: 460px;}
}

Select allOpen in new window

But it doesn't work. It's in an external stylesheet at stylesheet04.css. What could be the problem?

Thank you<><
Victor