Header is moving when scrolling

Hello 

I need help fixing a problem. The header of de website is moving when scrolling, have a look at the attached Video. How can I get rid of this issue? 

Thank you for your help.

https://www.fox-solutions.ch/

Bildschirmaufnahme 2024-08-09 um 09.46.09.mov

Can you share your website URL?

https://www.fox-solutions.ch/

or here from squarespace
https://fennel-beige-ldg5.squarespace.com/

Add this to Custom CSS:

// prevent header shift on scroll
.tweak-fixed-header:not(.sqs-edit-mode-active):not(.sqs-site-styles-active) .header.shrink .header-announcement-bar-wrapper {
    padding-top: 2vw !important;
    padding-bottom: 2vw !important;
}

Thank you, that helped 🙂 
How can we fix this for mobile as well? 

5 minutes ago, nadja1936 said:

How can we fix this for mobile as well? 

@media only screen and (pointer: coarse) and (max-width: 1024px), screen and (max-width: 799px) {
    .header .header-announcement-bar-wrapper {
        padding: 6vw !important;
    }
}