CSS Editor not applying changes

Hi,
I’ve been trying to follow this mini-tutorial to fix the responsiveness of Tesseract theme: https://siteorigin.com/thread/page-builder-background-image-wont-rescale-for-mobile-devices/
Every time I plug in code to the editor, it gets applied to the webpage, but when I inspect element on chrome, there is no trace of it. Here is the code I’m using:

@media (min-width: 680px) {
	.home-background .textwidget {
		padding-top: 20px;
		padding-bottom: 450px;
	}
}
@media (min-width: 680px) {
	.home-background .textwidget .home-eadline {
		font-size: 51px;
		font-style: normal;
        font-weight: 500;
        letter-spacing: 8px;
        font-family: 'Roboto';
	}
}

URL: http://thevandreasproject.com