title: css animation plays with external style sheet on load
body: <p>I have an external style sheet that contains transitions. When the page loads the transitions animate.</p>
  
  <p>When I move the transitions from the external style sheet and place them in the header of my html file, the animations don't animate on page load (Which is what I want).</p>
  
  <p>What can I do to stop the transitions from animating when placed in an external style sheet?</p>
  
  <p>Here is some example css:</p>
  
  <pre><code>label {
      font-size: 18px;
      transition: all 0.2s ease-in-out;
  }
  </code></pre>
  
  <p>When this is in a <code>css</code> file, the font goes from the page size to the css file size.</p>
  
  <p>When this is in the header in a <code>&lt;style&gt;</code> tag it doesn't do anything.</p>