So how do you need your footer to work - when the content is short, push the footer to the bottom, and when there is long content, then the content should push the footer down? Is that correct?
I see many weird styles applied by you using the design panel … such as:
applied to the main element. Makes no sense to have min and max height using the same value. Just remove this.
background-image: linear-gradient(178deg, #6610f2 0%, #3d818f 100%, white 100%);
applied to this left column:
<div class="style104 text-warning bg-light text-xl-left w-auto col-xl-1 col-lg-1 col-md-1 text-sm-left d-none d-md-block col-sm col-1 ml-xl-n5 mr-xl-3 h-auto" id="colLeftSide">
which also has thee min and max height applied the same way, which is also wrong. Also remove these from there.
Then your footer will behave properly.