Black bar around video banner on mobile- Story Theme

[cslezak97]

I have tried researching online and looking through countless forums and cannot for the life of me figure out how to get rid of the black bar on the top and bottom of my video banner. It only shows up on mobile. I am using Story theme. Any help would be massively appreciated!

[PageFly-Theodor]

Hi @cslezak97 ,
This is Theodore from PageFly - Shopify Page Builder App.
For solving the problem about the Black Bar Around Video Banner On Mobile- Story Theme, let’s try this solution:

Online Store ->Theme ->Edit code
Assets ->Base.css

.section{
	padding: 0 !important;
}

or you can give me the URL

I’ll be so happy if my suggestion can help to solve your problem. If you have any further questions, please feel free to tell me.
Best regards,
Theodore | PageFly

[cslezak97]

Thank you! Although, I actually don't have Base.css in my assets. Below is my store link.

https://wicklesports.com/

[Dan-From-Ryviu]

Hi @cslezak97 

Could you share your store link?

[cslezak97]

Below is my store link:

https://wicklesports.com/

[Dan-From-Ryviu]

Hi @cslezak97 

That black bar belong to your video so

But you can add this css code to Custom CSS of that video section to remove that black bar at the top

.video-background-wrapper {
margin-top: -20px !important;
}

[cslezak97]

Thank you so much, that worked for the top of the video! Do you know how to do the same thing for the bottom of the video? I tried adding this after but it didn't do anything:  

margin-bottom: -20px !important;  

[Dan-From-Ryviu · Accepted solution]

Please add this code to Custom CSS of text section below video section 

.section-text { margin-top: -43px; position: relative; }