Menu not centered properly and topbar not working

Groovy menu is supposed to center my logo with my site, however I have to use custom CSS to get it to center properly. The shop icon and search icon seem to be causing padding on the right side of the menu, resulting in it shifting left. Here is the code I had to use to get the menu fixed, however it isn’t perfect.

@media screen and (min-width: 768px) ) {
	.gm-logo {
		width: auto !important;
				left: calc(50% - 12px) !important;
	}
}
.gm-logo {
		width:100% !important;
	}
@media (min-width: 1024px){
.gm-navbar .gm-logo {
		width: auto !important;
			left: calc(50% - 12px) !important;
}
.gm-navbar .gm-minicart {
    margin-right: 2px !important;
}

}

body {overflow-x: hidden;}
.gm-navbar #gm-main-menu {
	transform: translateX(35px);
}

.gm-main-menu-wrapper .gm-actions {
    display: flex;
    z-index: 9999999;
}

@media (max-width: 1023px){
    .gm-menu-btn {
    display: flex;
			right: 1em;
			position: fixed;
    top: 1.5em;
    z-index: 999999;
margin-right: 1.5vw;
    } 
	
};
 .gm-navbar-sticky-toggle .gm-wrapper {
    margin-top: 0.9em;
    padding-right: 0.7em;
}

Also, even after enabling the topbar, it doesn’t show up. Is there any way to use the theme’s default topbar? (Flatsome)

The page I need help with: [log in to see the link]