How can I prevent a section from overlapping the header in Venture theme?

[mika94]

How do you move the section down so it will not overlap the header? I am not so sure how to modify the code to do this. The theme is Venture.

This is the URL

https://urbanhouseclothing.com/

[g33kgirl]

UPDATED CODE: You can add this at the end of your CSS file (Themes → Edit code → Assets → theme.scss.css

#shopify-section-slideshow + div {
  margin-top: 100px;
}

[mika94]

Do I add a new section and then add this code?

[g33kgirl]

No, you need to navigate to Themes → Actions → Edit code → Assets → themes.scss.css (scroll to the very end of this file and add the above code there). I have added pictures for reference:

Don’t forget to SAVE the file.

[dmwwebartisan]

@mika94

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media only screen and (max-width: 749px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

@media only screen and (min-width: 750px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

Hope this works.
Thanks!

[Kinjaldavra]

@mika94 please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (max-width: 749px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 30px !important;}
}

@media only screen and (min-width: 750px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

[mika94]

So to confirm this will move the section down right so it will not overlap with the header slideshow?

Hope I am using the right terms.

[Kinjaldavra]

yes confirm this will move the section down please insert code

[dmwwebartisan]

@mika94

Please PM to me I help you.

Thanks!