Help Please! ? -- How do I move the text lower on main Banner Image?

Store Design
1

Hello everyone! I hope you are all doing well! I am new to this community and have recently started my shop:

www.theluxurypetshop.com

I am currently using the ‘debut’ theme.

→ For the past week, I have been playing around, and am trying to figure out how to move the text on my Banner/ main image with the dog, down a little, below it’s face. I would like to do this on both Desktop view, and mobile view, and perhaps even move the blue button down a little.

→ I am also trying to make bold, the white text on my blue button towards the bottom of the ‘image with text overlay’ banner.

→ In addition, I would like to lessen the white space/ spacing between all the images on my website.

I have attempted to Google and research, in order to find the solution, but have not been successful. I have also followed other posts on this forum directing to modify/ add certain lines of code, but that has not worked. (I am a noob at coding, but am more than willing to learn if given the chance)

Can someone possibly provide me guidance as to the specific lines of code I should add or modify, and direct me to the specific area to add the lines of code to achieve these changes?

When I become better versed with coding, I plan to pay it forward—Thank you very much Shopify Community.

2

Hi @LuxuryPetGroup

Please add these codes at bottom of the CSS file “theme.scss.liquid” Under Assets Section.

1)This code will fix your text problem on the banner image

.hero__inner {
    vertical-align: bottom!important;
}
@media only screen and (max-width: 749px){
.hero .mega-title{font-size:35px!important;}
}

2)This code helps you to reduce white space between images on your site

@media only screen and (min-width: 750px){
.index-section {
    padding-top: 15px!important;
    padding-bottom: 15px!important;
}
}

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.

3

Thanks for your help, but I don’t see a “theme.scss.liquid” under assets,
only ‘theme.css’. Under ‘theme.css’, I see a ‘theme.liquid’ tab at the
top. I tried pasting at the bottom of both, but nothing changed!