I think, here is wrong placement of "/div" tag before "block footer"
Instead of:
HTML
</section>
</div>
{% block footer %}
<section id="footer" class="section bg-gray">
<section class="container {{ grid_size }}">
<p><a href="http://getgrav.org">Grav</a> was <i class="fa fa-code"></i> with <i class="fa fa-heart-o pulse "></i> by <a href="https://trilby.media">Trilby Media</a>.</p>
</section>
</section>
{% endblock %}
<div class="mobile-container">
it should be ("/div" after "block footer"):
HTML
</section>
{% block footer %}
<section id="footer" class="section bg-gray">
<section class="container {{ grid_size }}">
<p><a href="http://getgrav.org">Grav</a> was <i class="fa fa-code"></i> with <i class="fa fa-heart-o pulse "></i> by <a href="https://trilby.media">Trilby Media</a>.</p>
</section>
</section>
{% endblock %}
</div>
<div class="mobile-container">
Otherwise in IE 11 the footer is rendered on the top of the page (Mozilla and Chrome has no problem)