have a look at your address bar of your browser - do you load http or https ? And you should not specify protocol. For example <img src='//wikipedia.org/someimage.jpg' />
There is a very simple answer as to why .img-circle and .img-rounded aren’t working. It is because you are using Bootstrap 4, which changed a number of classes: https://v4-alpha.getbootstrap.com/migration/#images
Codepen recently switched to automatically adding Bootstrap 4 when you decide to add it through the dropdown.
.img-circle is now .rounded-circle. .img-rounded is now .rounded.