template.mustache

<html>
  <style>
    @font-face {
      font-family: "pencil-pete";
      src: url("PencilpeteFont-2eE3.ttf") format("truetype");
    }
    .wrapper {
      perspective: 800px;
      perspective-origin: 50% 65%;
      position: absolute;
      width: 410px;
      height: 400px;
    }
    .chalkboard-text {
      font-family: "pencil-pete";
      background-color: darkolivegreen;
      position: absolute;
      top: -22px;
      left: -7px;
      height: 400px;
      width: 426px;
      color: white;
      font-weight: bold;
      transform: rotateY( 35deg );
      font-size: {{ fontSize }};
      line-height: {{ lineHeight }};
    }
  </style>
  <body>
    <div class="wrapper">
      <div class="chalkboard-text">
        {{#text}}
          {{.}} <br />
        {{/text}}
      </div>
    </div>
    <img src="bart-chalkboard.png" style="width:800px;height:604px; position:absolute;z-index:0" />
  </body>
</html>