title: how can css reset :hover to default state?
body: <p>I have the following rule:</p>
  
  <pre><code>.quiz .panel .choices a:hover,
  .quiz .panel .choices a:active {background-position: 0 -30px;}
  </code></pre>
  
  <p>And because of the well documented weirdness that iOS does when it interacts with <code>:hover</code>. I want to reset the <code>&lt;a&gt;</code> tag to its normal CSS state for iOS. In my page, javascript will inject a class called 'iOS' at a top level so my following rule that will overwrite would be:</p>
  
  <pre><code>.iOS .quiz .panel .choices a:(?????)
  </code></pre>
  
  <p>the question marks being the part I don't know. What CSS rule do I write that resets the <code>&lt;a&gt;</code> tag so the pseudo classes are at their default state?</p>