Your footer is disappearing because the element #footer
set with a fixed height of 835px. This is causing the footer to always be 835px from the top of the browser window. Once the window is sized less than 835px the footer is no longer visible.
In order to keep the footer visible, try changing position to absolute
instead of fixed
. This will position the footer 835px from the top, relative to the top of the webpage itself, not the browser window.
To guarantee the footer will always be visible on any size screen, you could also apply min-height: 835px;
to your body tag.