It looks good @Kulasus but there are some things you can revisit.
-
codepen expects only the code you’d put between the
<body> </body>tags. If you have something to add to<head>click on the Settings button and add it there. (For instance, the link to your font) -
likewise, you don’t need to include the
<style> </style>tags in the CSS section. codepen assumes them for you. -
codepen provides you with validators for HTML, CSS and JS. Click on the arrow in each section and click on the respective ‘Analyze’ link. You have some errors in HTML that you can clean up.
-
Not sure if you noticed but you’re using the
<strong>tag but the text on your page doesn’t render as such. This is because when you imported your font you only selected regular. Go back to Google Fonts and when you select your font it will give you the link. All well and good so far but what you then need to do is click on the ‘customize’ link (next to ‘embed’) and there click the bold checkbox also. Click the ‘embed’ link and put the new link in your page. (Notice it now has weights for 400 & 700).
Btw, I did this too with a page I was working on and asked a question about why I wasn’t seeing the font output the way I expected here in the forums and it was explained to me. Here’s the link to my post which includes a quick video the responder made showing how to do what I just explained.