Overlapping Header 7.1

Site URL: https://harp-cheetah-cl8x.squarespace.com/config/design/custom-css

Hey guys, I was wondering how could I change the logo on my website to overlap. I tried changing the margins for the header but it didn't work. 

I'd like it to overlap like in the image, only have the logo centered. I would really appreciate some help. 

Thanks

https://harp-cheetah-cl8x.squarespace.com/config/design/custom-css 

Add to Home > Design > Custom CSS

.header-title-logo img {
    position: relative;
    bottom: -50px;
}