title: How do I remove a box-shadow effect from an element when another element is hovered?
body: <p>Structure: </p>
  
  <pre><code> &lt;div class="box"&gt;
        &lt;div class="inner_box"&gt;
        &lt;/div&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>.inner_box has a box-shadow effect.  When .box is hovered I want to remove shadow effect from .inner_box.  Besides using JQuery, is there another way I can do this, preferably CSS3? </p>
  
  <p>Please also show me examples of how i can do this in JQuery.  Thanks!</p>