Adding section border image to bottom of header section on Dawn

[megeh]

Hi!

I'm trying to add a little repeat border shape as an image to the bottom of the header in Dawn. This is what I am trying to achieve:

Here is the website url of the example site - https://www.sosouk.co.uk

This is the code I am trying on my development store:

.header :after {
    background-color: transparent;
    background-image: url(//www.sosouk.co.uk/cdn/shop/files/483EDEC2-935B-4A5B-80D5-5D96388E1513_7c6f264c-4cd8-4773-9d3f-7fcfb8b28010.png?v=1712429719);
    background-position: bottom;
    background-repeat: repeat-x;
    background-size: 20px 11px;
    content: " ";
    height: 11px;
    left: 0;
    position: absolute;
    right: 0;
    top: calc(100% - 1px);
    width: 100%;
}

However it's coming out as this (I will change the colour of the image shape to pink once I have figured this out):

You see the border is also showing up under the search and cart icon.

If anyone is able to tell me what the correct selector is it would be much appreciated! 

Store url: https://home-theo.myshopify.com/

Password: diecro

[suyash1]

@megeh I think you already have solved your issue