Cannot duplicate a simple login CSS effect

I am a CSS beginner. For learning purpose, I was trying to copy the CSS effect of the login box f开发者_JS百科rom this website: https://enichecommerce.freshbooks.com/

At the beginning I copy the code one DOM each time to understand the CSS impact. Later on, I just saved all the website (HTML, CSS, and JS) to my hard drive using Firefox "save page as" function, but when I open it, the visual effect of Login box is not what it looks from Internet.

Why could this happen? What did I miss?

At least part of the problem seems to come from the urls in the css file. They are relative urls that firefox appears to be messing up on save:

.boxMain {
    background-image: url("/images/2ndSite/loginpage-bgtile.gif");

I'm not sure what effect you are talking about being missing, but this one causes the background of the login box to be grey instead of white.