Accidentally messed up one of the CSS in my web page

Store Design
1

I was looking through the community, and inserted the following CSS:

@media screen and (min-width: 990px) {
    .image-banner-section {
        max-width: var(--page-width);
        margin: 0 auto;
        padding: 0 5rem;
    }
}

then my banner image became messed up. Here is screenshot and link to the website.

Screenshot 2024-05-14 at 23.07.42.png
Screenshot 2024-05-14 at 23.07.42.png3420×1590 383 KB

www.peak-point-store.com

2

Hello, @mgeorgiev24
The above css is set the content area with a variable. If the variable is not defined then it makes issue. In your site did you remove the CSS? You can set
max-width: var(–page-width); as max-width: 100%; or what you like.

Let us inform it solved your issue. or need any other assistance

3

I removed the CSS, buth nothing happened.

4

Please open the page with customize area from theme editor, it will clear the cache , hope it will solve the issue. It may be cache issue.

5

It didn’t seem to work.

6

Any help would be much appreciated.

7

Hi, I’m ready to help you, but unfortunately, I can’t understand what you need because your image is too big. If you can provide more details or clarify your request, I can assist you faster.

Best regards, Arif from ShopiDevs

8

So basically I was playing around with the CSS of my theme, and pasted the above code inside the section-image-banner.css. Then the image appeared as in the above screenshot. When I removed the CSS from the code, I was hoping that it would go back to normal (Blue lines on the right side and the top of the picture), but it didn’t. I tried the above recommendations, however nothing worked.