I like the layout.
However you failed one user story,
User Story: I can click on a link that will take me to an external website with further information on the topic.
The button doesn’t go anywhere.
Another thing I would consider is your mark up language.
HTML5 spec emphasises using the correct semantic markup
the header, article and main tags could have been used.
These tags help search engine optimisation (SEO).
Don’t worry too much about this as this a mistake most of us made (and some still make) in the beginning.
If you want more help with this I can recommend the free edX course
The course was commission by W3C and covers the basics of HTML5 and CSS. The follow on course is also great course to do.
I might be wrong, but as far as i know when using HTML in codepen.io is like wirting the body section , so no need to use !DOCTYPE nor Header
When I resize browser window, your grid breaks. Try to fix this.
Wish you luck