title: Image pop-out on mouse hover
body: <p>I had an image of a play button on my webpage I'm building with HTML but I have added some code and it has changed the image to a square or it created an image over my play button of a square. </p>
  
  <p>How do I rectify that and get the code to apply to my play button image? </p>
  
  <p>Also I want the image to pop outward when I hover the mouse over it, instead right now it goes inward.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;a class="thumbnail" &lt;IMG STYLE="position:absolute; TOP: 516px; LEFT:1233px; WIDTH:130px; HEIGHT:130px" SRC="play button.png"&lt;/a&gt;
  </code></pre>
  
  <p>JQUERY</p>
  
  <pre><code>$('.thumbnail').mouseover(function() {
   $('.thumbnail').removeClass('hover');
   $(this).addClass('hover');
  });
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.thumbnail:hover, .thumbnail.hover {}
  .thumbnail:hover span, .thumbnail.hover span {}
  </code></pre>