I am having a problem getting the center alignment of our logo at https://test1.theraliv.org

I believe we have been having a conflict with the between the logo upload field in the Template Options and the Logo position the Gazette template.

Initially we uploaded our logo from within the Template Options -> Basic -> Logo field. That worked but we were unable to get the height and alignment that we wanted.

So I asked for help and you graciously provided the following css which is in our custom.css section in the template options.

.logo-image {
    height: 110px !important;
}

#sp-header{
    height: 110px !important;
}

That helped but we were still not able to get the logo size we wanted. So, we removed the logo from the field in the Template options and instead published the logo as a custom module in the "logo" position. Then we had a nice sized logo. We still needed to keep the custom.css that you had provided to get the height to work.

We then found that we are unable to get the logo to align to the center. As I have been inspecting the logo space with developer tools it seems that there is a conflict of sorts. There is a div called logo that is 110 pixels high which is probably coming from the custom.css above. But, the div called logo is also about 103.52 pixels wide. It is being loaded to the right side of our Logo and pushing the logo to the left, thus preventing the logo from aligning to the center.

Can you suggest the best solution for us?

Here is an image where you can see the div logo pushing our logo to the left side. https://drive.google.com/file/d/1ZVtet61kUEwENsFmDLZ6z1KC6zaxDG--/view?usp=share_link