title: How checked checkbox can change div's z-index?
body: <p>I have a span with paypal button. I must make this paypal button avialable for pressing only after user confirms TOS. For this i think to lay over the span with the paypal button another div with unchecked checkbox, opacity and z-index. The user checks the checkbox and the layed over div gets such a z-index, so the span with paypal button will be over it and can be pressed.</p>
  
  <p>I need something like</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="with_zindex"&gt;
      &lt;input type="checkbox​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​"&gt;
  &lt;span class="here_is_paypal_button"&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.with_zindex{
  background-color:#fafafa;
      opacity: .5;
      filter: alpha(opacity=50);
      -moz-opacity: .5;
  z-index:1000;
  }
  .with_zindex + input[type=checkbox]:checked {
  z-index:-1000;
  }
  </code></pre>
  
  <p>But this don't work for me (there are only given first formattings, which are not chenged by checking / unchecking checkbox).</p>