Atlantic Theme - how to remove padding from places

Technical Q&A
, , ,
1

Hello! I’m using the Atlantic theme. Still work in progress here.

I’d like to adjust the padding in a few places .. and tried to use custom css but it’s not coming together. If anyone can help, that would be amazing!

link to the site.

If you need a password - try this:

iawoya

Thank you in advance!

2

Could you please provide more details about your request?

3

Hello! Thanks for sharing the details.

The Atlantic theme is a solid choice. Adjusting padding is definitely possible, and you’re on the right track using custom CSS sometimes it just needs a bit of fine-tuning to align with the theme’s structure.

I’d be happy to help you clean this up properly. If you can let me know which specific sections you’d like to adjust (for example: homepage sections, product pages, header, or footer), I can provide precise CSS or implement the changes directly to ensure everything looks consistent and responsive across devices.

Looking forward to assisting you.

4

Oh dear that post was not correct!

I would like to reduce the padding under the video for example. I have hunted and cannot find a way to do this
Thank you!

Oh password: iawoya

5

Certainly.

Thank you. The first place is under the video. The bottom padding between that section seems like too much

6

Thank you for the clarification.

That space is controlled by the section’s bottom padding in the theme’s CSS. I can adjust it precisely so the video transitions more smoothly into the next section, without impacting responsiveness or other areas of the site.

If you’re comfortable sharing the page URL, I’ll be able to review it closely and test the changes across both desktop and mobile to ensure everything remains consistent.

Kindly let me know how you’d like to proceed.

7

Please add this code to Custom CSS in Theme settings and click Save button.

#shopify-section-template--18780638511157__dynamic_custom_liquid_mdkiDh .home-section {
    padding-top: 25px;
}

Custom CSS in Theme setings
Custom CSS in Theme setings1920×1738 260 KB

8

It’s not “padding below video”, but rather “padding above “Handmade Sterling Silver.” heading”.

Check this next section in “Theme edit” and see if there are settings for top pagging.

Otherwise, add code like this to the “Custom CSS” setting of this section (one after video section):

.home-section.content-area {
  padding-top: 30px; /* desktop padding */
}
@media (max-width:719px) {
  .home-section.content-area {
    padding-top: 15px; /* mobile padding */
  }
}