Any Feedback or Suggestion regarding this is welcomed

Looks great! Love the colors and the font!

I used the media query to move the sidebar to the top of the screen when the device width gets narrow…

Your page looks good @19alema. Some things to revisit;

  • Run your HTML code through the W3C validator.
    • There are HTML coding errors you should be aware of and address.
      • You need to use the html entities for the < and the > in your text
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Note: you cannot nest a paragraph element in a paragraph element
  • Codepen provides validators for HTML, CSS and JS. Click on the down arrow in the upper right of each section and then click on the respective ‘Analyze’ link.
    • The one for CSS is good. Use it and address the issue(s).
    • (The one for HTML misses things which is why I recommend W3C)
  • Make your page responsive. Remember, the R in RWD stands for Responsive
    • There’s a horizontal scrollbar on smaller screens