Round section Container

[Ked]

I am trying to round the containers of sections and Image/video banners on my website. Please I need help

Link: https://arabiancreed.com/pages/about

Password: App123!!

 

I want the max width for the image with text section to have a max width of 1200 and also be rounded

This is what I am trying to achieve. 

 

[Moeed]

Hey @Ked 

I'm unable to locate the place to enter the password in the password page, can you disable the password for some time so I can help you out?

Best Regards,

Moeed

[Ked]

Its disabled now, Thank you

[Moeed]

Hey @Ked 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
@media screen and (min-width: 768px) {
section#m-section-template--15758656176222__image_with_text_KHYe7B {
    width: 1180px !important;
    place-self: center !important;
    border-radius: 20px !important;
}
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Ked]

The media/video banner is still the same 

[LizHoang]

Hi @Ked 
You can follow the instruction here to round your video banner:

1. Go to Shopify > Theme > Customize > open Custom CSS

2. Copy and paste this code to the section > Save

.m-video__bg {
    border-radius: 10px;
}

.m-hero--has-overlay:before {
    background-color: transparent;
    opacity: var(--opacity-image-overlay);
}

Here is the result: