Footer issue

[Judemoon]

Hello, I have purchased Atch_glam template and have successfully installed it.
However, I have made small changes to the layout.
All turned up well except for the 'footer'.

I wanted the footer to span across the width of the page so I have set it as follow in global.css :

/* Footer */

#footer {
background: #333333 url('../img/bg_footer.gif') repeat-x bottom;
position:absolute;
bottom:absolute
left:0;
width:100%;
padding: 2px 0;
height: 68px;
clear: both;
display: block;
float:absolute;
}


It works, except that the footer does not stay at the bottom of page when the contents on the page gets shorter (see attached image).
Anyone has solution for this?

I have no programming knowledge.

[Judemoon]

This is code that I have edited in global.css

/* Footer */

#footer {
background: #333333 url('../img/bg_footer.gif') repeat-x bottom;
position:absolute;
bottom:absolute;
left:0;
width:100%;
padding: 2px 0;
height: 68px;
clear: both;
display: block;
}

@media screen{
body>#footer{
position:fixed;
}
}