title: :hover rotation CSS keep position on uncover
body: <p>I am rotating an object with CSS upon hovering, and would like for it to remain in it's new position as you unhover it. I have searched around, but the only thing I could find is <a href="https://stackoverflow.com/questions/23313727/css-hover-rotate-element-and-keep-the-new-position">css :hover rotate element and keep the new position</a>, which seems to go above and beyond.</p>
  
  <p>Is this effect possible to achieve purely with CSS? I want the icon to remain at the 180 position once you stop hovering.</p>
  
  <p>I used this code:</p>
  
  <pre><code>i.fa.fa-globe:hover { 
      color: #e9204f;
      transition: 0.9s;
      transform: rotatey(180deg);
  }
  </code></pre>
  
  <p>Also it's a font-awesome icon if this makes any difference.</p>
  
  <hr>
  
  <p>Edit - The easy CSS solution for everyone else who needs it (taken from the comments):</p>
  
  <pre><code>.lovernehovermarket i.fa.fa-rocket { 
      transform: rotate(0deg);
      transition: transform 999s;
  }
  </code></pre>