Space between header image and page content

I’ve looked through all the threads and haven’t found d a css option that removes or minimizes the space between the header image and page content. see this page as an example.

please advise asap
thank you robert

Hi Robert,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 1025px) {
      .sydney-hero-area .header-image {
        max-height: 410px;
        background-position: center bottom;
      }  
      .page-wrap {
        padding-top: 0;
      }
    }

I hope that helps.

Regards,
Kharis
aThemes Support

Thank you Kharis that worked however now the top of the image is not visible. How do make that adjustment?

thank you
robert

Hi Robert,

Thank you for getting back.

I checked your page. And seems likely the header image has been updated. The new image is now completely appearing. Do you still need help with the header image visibility or not? Please confirm.

Regards,
Kharis
aThemes Support

Hi Kharis,

No not really. If you look at the bottles to the left, the tops are cropped off.

Thanks
Robert

Hi Robert,

Are you referring to this image? If so, perhaps you’d need to reupload it and skip the cropping option whenever possible.

Regards,
Kharis
aThemes Support

I will try that. By the way is there an optimum height and width for this area?
thank you
Robert