title: Changing the background-image style in Reveal.js
body: <p>I am trying to access the styles of the background-image in reveal.js for three reasons:</p>
  
  <p>a) I'd like to override the background image in the overviewmode
  b) I'd like to blur some backgrounds with CSS</p>
  
  <p>I found two articles on SO that helped me:</p>
  
  <p>a) <a href="https://stackoverflow.com/questions/25471368/how-to-position-a-background-image-in-reveal-js">How to position a background image in reveal.js?</a>
  b) <a href="https://stackoverflow.com/questions/15183704/reveal-js-background-color-choices">reveal.js background color choices</a></p>
  
  <p>But I must be missing something, so I created this jsFiddle to demonstrate the problem:
  <a href="http://jsfiddle.net/dirkk0/asya4grv/" rel="nofollow noreferrer">http://jsfiddle.net/dirkk0/asya4grv/</a></p>
  
  <pre><code> html.thisState .state-background {
       /* background image is NOT changed, but the backgroundcolor changes */
       background-color: rgba(0, 0, 0, 0.8);
       background-image: url('http://pngimg.com/upload/small/key_PNG1180.png');
   }
  </code></pre>
  
  <p>You can see that there are suddenly two background images. What am I doing wrong?</p>
  
  <p>Thanks,
    Dirk</p>