title: CSS3 Transition Out Custom Animation
body: <p>I have a custom animation in CSS3 which I can transition into view, but I cannot transition it out. Take a look at my Fiddle here: <a href="http://jsfiddle.net/spryno724/SW8Ly/" rel="nofollow">http://jsfiddle.net/spryno724/SW8Ly/</a>. Note that this transition is only working in Webkit browsers as of now.</p>
  
  <p>Try rolling your mouse over the styled text input. The background transitions from white into a blueish color when you roll your mouse over the text field, but it does not transition from blue to white.</p>
  
  <p>I thought the <code>ease-in-out</code> property would take care of this, but it appears only to do so for pre-defined animations.</p>
  
  <p>How can I transition from blue to white on mouse out?</p>
  
  <p>Thank you for your time.</p>