Mobile Banner Issues - Logo is overlapping banner text that I am not using for the header

[JMD1411]

Hi, I've made some edits to the Trade theme code so I can have it like it looks on desktop currently but the way this has been now set up... on mobile this has caused the following issue as you can see in the image. Ideally I need some extra padding above the text only but this can't be done in the section editor.

Only way i've been able to fix it is by hiding the logo on mobile - but i want the mobile on logo ... so any ideas?

Thanks - added images for context.

[PageFly-Noah]

This is Noah from PageFly - Shopify Page Builder App

I can help you. Please can you provide the website url. Thank you.

Best regards,

Noah | PageFly

[JMD1411]

Sure - it's - https://silk-huis.myshopify.com/

[PageFly-Noah]

 Hi @JMD1411  Iam so sorry, I lost my message so I didn't reply to you early. Here is the solution you can try it. Please paste this code into the theme.liquid file and above the </body> tag:

<style>
 @media screen and (max-width: 767px){
  #Banner-template--17683385385207__image_banner .banner__content{
        min-height: 55rem !important; 
  }
}
</style>

Hope my solution will help you resolve the issue.

Thank you so much. 

[JMD1411]

Thanks so much - does the job!! Although the logo seem slightly off center, any idea what could fix that ?