Build a Product Landing Page-HELP

HTML-CSS
1

Tell us what’s happening:

Hello,
This is my link for my Codepen: https://codepen.io/gq-x/pen/dqvwKZ
I did all that has been asked of me in this project, however, when I ran the test it asked for the following:
that the nav bar should always be there even if the user scrolled, I add a fixed position in the element with the id=“nav-bar”, yet it did not count.
second, it asked me to add at least one media query and I added two, and yet it wasn’t counted.

Help please in guide me what am I doing wrong?
Thanks in advance.

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/

2

You need to add

top: 0px;

To get it to stick to the top of the page

4

I added it.
but still gives me an error about the #header being top.
and i fixed the media query thanks for both of you.

This is my code:

#header{
  top: 0;
  position: fixed;
  padding: 0px 30px;
  margin-top: 20px;
}
5

(You can add box-shadow: 2px 2px 5px black; to the header to help separate it from the page better).