<script src="//use.typekit.net/rzv2mwh.js"></script>
<script>
  try {
    Typekit.load();
  } catch (e) {}
</script>

<div class="container">
  <h1>Recreate this using HTML &amp; CSS</h1>
  <img src="https://s3.amazonaws.com/f.cl.ly/items/2z3C3Z0L2Q0R282p1V0z/Image%202014-12-19%20at%2010.07.09%20AM.png" width="303" />

  <!--Your HTML goes here-->

</div>

/* Global resets */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
body {
  font-family: "rooney-sans", Avenir-Book, Calibri, sans-serif;
  color: #424242;
  line-height: 1.4;
}

/* Fonts */
h1 {
  font-family: "rooney-web", "AmericanTypewriter", Rockwell, serif;
  font-size: 2.5em;
  font-weight: bold;
}

.container {
  margin: 2em auto;
  max-width: 630px;
  text-align: center;
}

/* COLORS: 
  blue: #20A1D4;
  green: #1CBC2C;
  orange: #EF5F3C;
  black: #424242;
  grey: #777;
  light grey: #eaeaea;
*/

/* Your CSS goes here */