How to Center a Custom Liquid Video when Adjusting Width on Mobile?

[fowlerpatrick19]

I had to change the width of my custom liquid video so the text in the video would be bigger on mobile. Now, the video (on mobile) appears cut-off on the right side, so I need to shift it left so that it is centered. Below is the code I am using. Is there something I can quickly add that with always keep the video centered regardless of width? I've tried everything I can. Thanks

<style>
video {
width: 100%;
height: auto;
display: block;
margin: 0 auto;
}

@media (max-width: 900px) {
video {
width: 200%;
}
}
</style>

<video muted autoplay playsinline loop>
<source src="https://cdn.shopify.com/videos/c/o/v/179d4121a47f45dd940a9ec3d7575f00.mp4">
</video>

[Beae_Cass]

Hi @fowlerpatrick19 ,

Could you please share your store URL and password if it enabled, so that I can help you

[fowlerpatrick19]

https://iblackskincare.com/

[wateriq]

Did you ever figure this out?

I'm trying to do the same thing with the same issue.