Need Simple CSS fix for Ally

You can cut 20px by removing the padding for the head-wrap on line 1508 –

.head-wrap {
    padding: 0 0 20px;
}

You can change that to this –

.head-wrap {
    padding: 0;
}

That will remove it from the header area on every page though, so if you want the Home page to keep the 20px (bottom padding) then let me know and I’ll give you the code for that. Try the above suggestion first as it may look fine remove the padding on all pages.

Your header widget area has about 40px of space at the bottom. This can be found around line 1602 in your css –

.header-image .site-header .widget-area {
	padding: 40px 0;
	padding: 2.5rem 0;
}

To remove that padding you can change the padding to this –
padding: 40px 0 0;
This keeps the top padding but removes the bottom padding. Make sure and remove the rem section entirely – padding: 2.5rem 0; the rem’s will be gone as we’re removing them in the future updates since dealing with pixels px is much easier.

If you still need more space removed, you can add margin: 0; to .header-image .site-header .wrap on line 1583….that will only cut about 14px of space though.

The rest of the space is actually coming from the .site-inner or the main content area of the site (the first thing right above every title on each Page/Post)…Line 692 –

.site-inner {
    clear: both;
   padding-top: 40px;
    padding-top: 2.5rem;
}

If you adjust this, just remove the rem code and adjust the padding using px

Also keep in mind that you have a little bit of space at the bottom of your image itself. Since your image is transparent and it can’t be seen, you would have to open it in photoshop or whatever program you used to create the logo. You could remove that space if you want, but it’s not required (optional).

Ok great! Glad it’s working. As far as the homepage issue, that was what I was referring to earlier in my previous comment….if you add or remove space from the .head-wrap it affects the homepage as well as the others. You can add 20px back to the bottom padding by adding this around line 1507 in your CSS (unless you’re adding custom CSS in a different area/file) –

.home .head-wrap {
    padding: 0 0 20px;
}

That will add 20px of space to the bottom of the header/logo area. If you need more space, then you can adjust the 20px part of the code above to however much you need.

By adding the .home in front of the .head-wrap allows the site to only use that code on the Home page independently (the rest of the pages will use the other code).