I added the required negative top margin for the footer. Otherwise it drops off the screen. I also removed the transparent background. But, that's a personal preference, depending on whether you want the background to shine through or not.
Just a note for other readers searching for a solution: the negative margin-top value depends on the height of your footer + padding. Use the layout inspector to determine the values. On our production site, the footer height is a little smaller, so I needed -60px there.
JoomDev is not affiliated with or endorsed by Open Source Matters or the Joomla! Project. The Joomla! logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.