Space between header and shop section

Hey guys, I can't figure out how to reduce the space between my sites header and the next section which is a shop section.

This is the site url https://knittingismyyoga.com

would greatly appreciate some help and if you could also just briefly explain how you did it (ps I am trying to learn swell :))

You can use this code to Website > Website Tools > Custom CSS

section.products.collection-content-wrapper.products-list {
    padding-top: 0px !important;
}
body.homepage div.header-announcement-bar-wrapper {
    padding-bottom: 10px !important;
}