title: Importing a font with pure CSS
body: <p>I'm trying to get a Google font on my website. It works if I put this code in each HTML file.</p>
  
  <pre><code>&lt;link href='http://fonts.googleapis.com/css?family=Cinzel+Decorative:700' rel='stylesheet' type='text/css'&gt;
  </code></pre>
  
  <p>I want to be efficient and only access the font in my main CSS file, but I don't understand why the font doesn't display without the HTML part.</p>
  
  <pre><code>@font-face {
      font-family: "Cinzel Decorative";
      src: url("http://fonts.googleapis.com/css?family=Cinzel+Decorative:700") }
  html, body {
      background-color: #C00;
      color: #600;
      font-family: "Cinzel Decorative", serif;
      font-size: 112.5%;
      text-align: center }
  </code></pre>