Reducing Space for Header Image

I am a newby with wordpress, and just set up my new wordpress site. I now like to tweak it to the look I would like to give it. To reduce the size of the header image I made use of the following extra CSS code, which I found on the net:

.has-header-image .custom-header-media img, .has-header-video .custom-header-media video, .has-header-video .custom-header-media iframe, .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-media img {
height: 66% !important;
object-fit: fill !important;
width: 100%;
max-height: 100% !important;
display: block !important;
position: relative !important;
}

#wp-custom-header {
height: 30% !important;
}

.admin-bar.twentyseventeen-front-page.has-header-image .custom-header-media, .admin-bar.twentyseventeen-front-page.has-header-video .custom-header-media, .admin-bar.home.blog.has-header-image .custom-header-media, .admin-bar.home.blog.has-header-video .custom-header-media {
height: calc(71vh – 32px) !important;
}

.site-title, .site-title a {
color: white !important;
font-family: Libre Franklin !important;
font-size: 50px !important;
}

#content {
padding-top: 10px;
}

But now I have this big greyish space below the header image, I would like to get rid of, so that the title shows on top of the header image. How to do that???

• This topic was modified 6 years, 4 months ago by bdbrown.
• This topic was modified 6 years, 4 months ago by bdbrown. Reason: Changed blockquote to code tags

The page I need help with: [log in to see the link]