function positionFooter()
{
    /*
        Pushes footer to the bottom of the screen.
        New margin on footer is relative to main_container div,
        Menu is sometimes outside this so it's hacked in the case
        where it would overlap the menu
    */
    var footerobj = $('footer');
    var footerHeight = 62;

    if (footerobj) {
        footerobj.style.visibility="hidden";
        footerobj.style.marginTop="0px";

        // get window's height
        var winHeight = document.viewport.getHeight();

        // if this wasn't successful; we can still try with this (IE6 quirks mode)
        if (winHeight == 0) {
            winHeight = document.body.clientHeight;
        }

        var contentTop = $("main_container") ? $("main_container").offsetTop : 0;
        var contentHeight = $("main_container") ? $("main_container").getHeight() : 0;
        var contentBottom = contentTop + contentHeight;

        var menuTop = $("menu") ? $("menu").offsetTop : 0;
        var menuHeight = $("menu") ? $("menu").getHeight() : 0;
        var menuBottom = menuTop + menuHeight

        var difference = menuBottom - contentBottom;

        var newTop = winHeight - contentBottom - footerHeight;

        if (difference > newTop){
            //push a bit further down past the menu and add some padding
            var newTop =  newTop + (difference - newTop) + 10;
        }

        //Minimum 10px margin - no -ve margins either
        if (newTop>10)
            footerobj.style.marginTop=newTop+'px';
        else
            footerobj.style.marginTop="10px";

        footerobj.style.visibility="visible";
    }
}