Background image on home page does not fill section or show on mobile

[jetboyco]

Hello, 

On my store, jetboyco.com, the background image was set but does not fill the entire section it is in. When I do get it to fill the section, the banner at the top of the page cuts off the top of the image and has white space below. It's like the margins are mixed up and causing it to not work properly. Then if I switch from desktop to mobile, the image is zoomed in and looks really bad. 

I need help making the image fit the section it is in and help it fit both desktop and mobile. 

[webwondersco]

@jetboyco hope you are doing well.

It is because of below CSS code you have added below in your custom CSS part. Please remove this, and it'll work fine.

[jetboyco]

Hello,

I did not build this out Initially and that is why I’m lost. May you please point me to the code you mention?

Thank you

[webwondersco · Accepted solution]

Please add below line of code at the end and before the closing tag </body> in thme.liquid file. @jetboyco 

<style>
@media(max-width:767px){
#shopify-section-template--21456904094007__b2c56f85-1a07-4ebf-8c25-768d389a8043 .bttn{
height:auto !important;
}
}
</style>

[jetboyco]

THANK YOU!! This fixed it

[webwondersco]

@jetboyco you can mark the reply as accepted solution so others can get the idea as well.

[Dan-From-Ryviu]

Please use this code instead and check again

#shopify-section-template--21456904094007__b2c56f85-1a07-4ebf-8c25-768d389a8043 {
    background-image: url(https://cdn.shopify.com/s/files/1/0841/6696/7607/files/23_2.jpg?v=1745875660);
    background-repeat: no-repeat;
    background-size: cover;
}