<div class="page-content">
  [[[https://codepen.io/zastrow/pen/jjzpNY]]]
</div>
body::before {
  content: '';
  position: fixed;
  display: block;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='12' viewBox='0 0 20 12'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='charlie-brown' fill='%23ff009e' fill-opacity='1'%3E%3Cpath d='M9.8 12L0 2.2V.8l10 10 10-10v1.4L10.2 12h-.4zm-4 0L0 6.2V4.8L7.2 12H5.8zm8.4 0L20 6.2V4.8L12.8 12h1.4zM9.8 0l.2.2.2-.2h-.4zm-4 0L10 4.2 14.2 0h-1.4L10 2.8 7.2 0H5.8z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") fixed;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
}

.page-content {
  box-sizing: border-box;
  width: calc(100% - 2rem);
  margin: 1rem auto;
  max-width: 60rem;
  padding: 1rem;
  background-color: white;
  position: relative;
  z-index: 1;
} 

External CSS

  1. https://codepen.io/zastrow/pen/jjzpNY.css

External JavaScript

This Pen doesn't use any external JavaScript resources.