html, body { /* This pins the footer to the bottom of the page */
height: 100%;
margin: 0;
display: flex;
flex-direction: column;
}
.footer {
flex-shrink: 0; /* prevents footer from being compressed or shrinked by siblings push for more content, but I could not verify that*/
}
.layout-wrapper {
flex: 1 0 auto; /* lets content grow, pushing footer down */
}