I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.
Just really quickly there are some things you need to revisit;
Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in the HTML editor. (No need to include the body tags). For anything you want to add to the <head> element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
Mentioning because you have elements out of order. Everything the browser renders belongs in the body element. R eview this for an understanding of the HTML boilerplate tags.
Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
