Edit Padding on product page, mobile only

[Claudianicolson]

Hi,

On a product page, the spacing between the image and text is fine on desktop, however when viewing on mobile there is no gap and they are almost touching. 

Is there a way to increase the space between the bottom of the image and the product title on mobile only?

Link: https://qvwine.com/products/quatre-vin-red-2021

Thanks in advance! 

[AR-Dev · Accepted solution]

Yes there is, add the following CSS code to the theme scss file (Online Store -> Actions -> Edit Code -> Assets/theme.scss.liquid):

@media screen and (max-width: 749px) {
  .product__content-header {
    margin-top: 32px !important;

    margin-bottom: 32px !important;
  }
}

[Claudianicolson]

@AR-Dev  - This works perfectly, thank you!