Cannot re-size header

Hello,

I am trying to play around with the header information from my CSS sheet (I am copying it over to my child sheet) to re-size it and nothing appears to change.

https://www.findingthehealthyroad.com

Here is the current header section code out of the CSS:
/* ————————————————————————- *
* Section: Header
/* ————————————————————————- */
#header { background: #33363b; position: relative; padding-bottom: 60px; }
#header .pad { padding-top: 30px; padding-bottom: 30px; }
#header .container-inner { position: relative; }

.site-title { font-size: 42px; font-weight: 600; letter-spacing: -0.5px; float: left; line-height: 60px; padding: 10px 0; }
.site-title a { display: block; color: #fff; max-width: 100%; }
.site-title a img { display: block; max-width: 100%; max-height: 60px; height: auto; padding: 0; margin: 0 auto; -webkit-border-radius: 0; border-radius: 0; }
.site-description { font-size: 16px; font-style: italic; color: #fff; color: rgba(255,255,255,0.5); float: left; margin-left: 20px; line-height: 60px; padding: 10px 0; }
.site-image { display: block; margin: 0 auto; max-height: 400px; }

#header-ads { float: right; }
#header-ads h3 { display: none; }
#header-ads img { display: block; }

I have tried changing the site title to float center and increase the line height (I was guessing the issue might be the title section is too small), setting the site title image to an actual number after adjusting the max number, etc.

Any ideas?