* {
  margin: 0;
  padding: 0; }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  margin: 0 auto;
  text-align: center;
  width: 41em; }
  body h1 {
    margin: 1em 0 2em 0;
    text-align: center; }

.left-column {
  display: inline-block;
  text-align: left;
  width: 20em; }
  .left-column .mockup-page {
    box-shadow: 0 0 5px 0px #999;
    margin: 0 auto;
    padding: 0.001em; }
    .left-column .mockup-page section {
      border: solid 1px #ccc;
      color: #999;
      font-family: serif;
      font-size: 0.8em;
      margin: 0.4em;
      padding: 0.2em 0.4em; }

.right-column {
  display: inline-block;
  padding: 0 2em;
  text-align: left;
  vertical-align: top;
  width: 20em; }
  .right-column pre {
    font-size: 0.9em;
    overflow: auto;
    margin: 0 auto;
    padding: 0; }
  .right-column input {
    left: 3em;
    position: relative;
    top: 0.5em; }
    .right-column input[type='range'] {
      width: 5em; }
  .right-column .css-code {
    display: inline-block;
    width: 12em; }

button {
  margin-top: 4em;
  padding: 0.4em 1.4em; }

Add ghost file (will be removed in a moment)
Add ghost file (will be removed in a moment)
