Code injection not working because of Ajax loading

Site URL: http://adamcale.co.uk

Hello,

I had a few pages on my site where the footer was floating as the content didn't fill the page (past/present/future pages).

I added the following code to these pages to fix the footer to the bottom.

<style>
  #footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}
</style>

Whilst this works in the Squaraspace builder it doesn't work on the live site because of ajax loading. 

Is there any way to override ajax for just these pages? Or is there a better piece of code i can use across the whole site?

If i use the current code for the whole site then the footer locks to the bottom of the window and sits on top of my content rather than below it - which i don't want.

Any help would be much appreciated, Thanks

Disclaimer: my coding knowledge only goes as far as google > copy > paste.