batharoy

.navbar-brand.brand-image img {
    height: 100px;
}

Add this to the style.css found under Appearance > Editor when your child-theme is active.

This will not remove it but will hide it from view.

.hgroup-wrap {
display: none;
}

This will move your image up so there is no background space at the top of the browser window.

#branding {
margin-top: 0;
}

They are using Before & After pseudo elements with a top & bottom border respectively. They are also adding a top & bottom border to the element itself.

<h1>We are your doers</h1>

h1:before {
content: ”;
position: absolute;
top: 9px;
border-top: 1px solid #412b1d;
}

h1:after {
content: ”;
position: absolute;
bottom: 9px;
border-top: 1px solid #412b1d;
}

h1 {
border-top: 2px solid #412b1d;
border-bottom: 2px solid #412b1d;
}

I see you removed the border all together. Try adding like this for the effect you asked for.

.menu-top-container {
border-bottom: 1px solid #ededed;
}

This will move the image up and the nav down, will that work for you?

.header-image {
    margin-top: -6.0rem;
}
.main-navigation {
    margin-top: 4.2rem;
}

.site-info a {
font-family: “Century Gothic”;
}

#navigation {
    margin: 0;
}
#header hgroup {
    margin: 0 auto;
}
#footer-widgets {
    padding-top: 10px;
    padding-bottom: 0;
}
#header {
    margin: 0 auto;
}

You would first need to create a child-theme, then copy the header.php filr into the child theme directory.