Coded header, now Logo will not center

I recently had my header coded with custom font and features. I wanted to change my menu settings so the menu doesn't say Menu+, but is the hamburger button. When I removed that and changed it to hamburger, my logo went off center and cannot be drug back to the center. Is there a way to fix this without removing all of the coding ? I talked to tech support and they said this could be fixed with just deleting all of the code but I'd rather not. 

This can be viewed at www.oasisbellingham.com

Here is the coding for reference:

/*CUSTOM FONTS*/
@font-face{
  font-family: 'Gumani';
  src: url('https://static1.squarespace.com/static/66032d633065163a0916a7e7/t/6620588bfa9c1d5266c23816/1713395851904/Gumani.otf') format('opentype');
  }

h1, h2, h3, h4{
  font-family: 'Gumani', sans-serif;
  
}

/*NAV MENU*/
@media (min-width: 650px){
.header--menu-open .header-menu {
    opacity: 1;
    visibility: visible;
}
.header-display-desktop .header-burger {
  display: block;
}
.header-display-desktop .header-nav {
  display: none;
}
/* Burger icon to text */
.burger-inner>div {
    visibility: .show;
}

.burger-inner:after {
    visibility: visible;
    content: ;
    font-size: 20px;
    color: #582308;
    text-decoration: underline;
    white-space: nowrap;
    position: relative;
    left: -50px;
}
}

/*Menu font*/
.header-menu-nav-item a{
   font-size: 18px;
  line-height: 1.5em;
  position: relative;
    top: -20px;
}

/*secondary button background*/
.sqs-block-button-element--large:hover {
  background-color: rgba(248, 244, 238, 0.4)
}

/*Service Page: Hover Image Zoom*/

.fe-660c5aa06942a9516f036243 a:hover {
  transform: scale(1.2);

You can use this extra CSS code to fix problem

div.header-title a {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
div.header-announcement-bar-wrapper {
    padding-top: 3vw !important;!i;!;
}

@tuanphan I pasted this in and it says syntax error on line 49 

line 49:  padding-top: 3vw !important;!i;!;