Modifying padding of page elements without displacing footer

Hi there, I’m trying to shrink the padding of a number of (non-homepage) page elements in Shapely and every time I do so, the footer ends up popping up into the middle of the page. Here’s the CSS I’m currently using. It makes the page look like I want, but the footer is detached from the bottom:

.page-title-section {
	height: 65px;
}

.page-title {
	color: #fff;
	text-shadow: 1.5px 1px #000;
}

footer#colophon {
	padding: 0;
}

footer.entry-footer {
	padding: 0px 0 !important;
}

section.content-area {
	padding-top: 15px;
	padding-bottom: 5px;
}
.entry-title {
	display: none;
}

.entry-content h1 {
	color: #b3b3b3;
}

you can see the example at http://tobolab.org/research

What can I do to shrink these various elements’ padding but keep the footer attached to the bottom of the page?

Thanks!

Somewhat sheepishly, I realize that shrinking the various elements has caused the page content to be shorter than the window so the footer is behaving as designed. I’ll see if there’s a way to stick the footer to the bottom if the page content is shorter than the window size.

Figured it out thanks to this thread: https://colorlibsupport.com/t/shapely-theme-sticky-footer-using-flex-css/