Sticky contact bar, sticky menu, and spacing issues

Hi, two requests here but sort of related.
1 - contact bar. I would like to make it static - always present at top of the home page, regardless of device, but I would like it gone from the other pages.
2 - menu: I want to get rid of that little genie effect where it moves up and down as you scroll, and I want to reduce the space between the contact bar and the header so the menu does not have too much white space.
The website is vetimmune.com and I am using sydney pro.

Thanks for any help you can provide.

Hello there,

Let’s address them one by one, so we’ll be easier track the progress and provide assistance in good order.

1

Try addingt his CSS code to Appearance > Customize > Additional CSS from dashboard.

    body:not(.home) .header-contact {
      display: none;
    } 

    body:not(.home) .site-header {
      top: 0 !important;
    }

    .home.siteScrolled .header-contact {
      position: fixed; 
      width: 100%;
      top: 0;
      left: 0;
      padding: 5px 10px;
      z-index: 9999;
    }

    .home.siteScrolled .site-header.fixed {
      top: 35px !important;
    }

Regards,
Kharis

hi Kharis, thank for the help.
OK, this works very well on desktop and tablet, although there’s a bit of a shrinking effect as you scroll but I can live with that, it is not distracting.
On phone, it does not work, but at the same time, I am ok with it as it would take up quite a bit of screen space.
Let’s move on to the menu. As I said, I’d like to get rid of the genie effect, and also have a way to control the space between the menu and both the contact bar and the header slider. So for the space, please let me have the option of changing the pixel values so I can play a little with that and see what looks best.
Thanks again!