title: Change margins on single product page woocommerce
body: <p>I have been customizing the single product page a little, all is fine.
  However, there are big spaces between the titles, prices, variation colors, buttons, etc. It's even worse on mobile, you nearly need to scroll an entire page before you can add the product to cart.
  I need to have less space, thus adjust the margins, between the price and the color variations, and between the color variations and the add to cart button.</p>
  
  <p>I inspected the elements on my page with the chrome tools for developers. 
  I selected some things and i can SEE there's room with nothing in it. See the orange box on the picture. I tried the codes shown below to adjust the margins, they sadly do not work.  </p>
  
  <pre><code>.form.variations_form.cart {
  margin-top: -5% !important;
  }
  
  .woocommerce-variation single_variation {
  margin-bottom: -9px;
  }
  </code></pre>
  
  <p>I think I might have the wrong class or ID even though I checked it with inspector tools on chrome. Truth is I am no magic coder and I will never solve this unless I get a lead. If anyone has any tips or adjustments to my code, I would be very happy to try it.</p>