Logo placement difficulty in Product Landing Page

[dhemb]

This is my first time posting here. Although, I passed the assignment, this issue is bothering me. I’ve tried repeatedly, for days, to find the answer on my own, so thought I’d go ahead and ask here.

I have everything lining up the way I want for desktop, although I am sure there is much room for improvement, but when mobile size, the logo and nav links are suppose to all line up neatly in the center. But the logo is always slightly off center to the left. Its kind of driving me a little nuts.

Anyway, I would appreciate some advice. Thanks! Here is my codepen(I hope I am doing this correctly):
Product Landing Page by dhemb

[lasjorg]

It is the max-width, you can make it a block-level element and center it using auto margin.

  #header-img {
    display: block;
    max-width: 30%;
    margin: 0 auto;
    padding: 10px;
  }

[dhemb]

That worked! Thank you lasjorg. This was a valuable missing piece of the puzzle.