How to eliminate grey areas below header and how to increase width of the image?

I have few questions regarding sparkling theme.

How to eliminate the grey area between header & page as shown in attached pic no.1 section?
How to eliminate the white area as shown in attached pic no.2 section?
How to increase the width of the image so that there is no white space on its left & right side? It is shown as no.3 section in attached pic
How to eliminate the grey area as shown on the left & right side by no. 5 & 6

Thanks a lot. Not to mention, your sparkling theme is damn awesome. Here is my website link:

Hello there,

I hope you are doing well today.

Before I start, could you please provide a link to your website so that I can inspect it?

Best Regards,

Yes, it’s already written in the question. But still here is the link -

Hello there,

Thanks for the link.

Since, you are using Elementor, thi plugin has its own attributes assigned to the elements so some CSS may not be removable.

  1. You can use the following CSS code to remove the top margin by going to Appearance > Customize > Additional CSS and pasting it there.
.main-content-area {
    margin-top: 0px !important;
  1. .entry-content { margin: 0px; }

  2. In order to increase the image size you would have to edit the settings in Elementor to do so because there are a few columns being used there.

  3. This can be used to remove the left and right padding:

.container {
    padding-right: 0px;
    padding-left: 0px;

Best Regards,

Thank you so much that worked.
For image width, I need to look in Elementor. But anyways thanks. Peace out.

Hello there,

I am glad the solution worked for you.
Please feel free to contact us again in the future regarding any other issues.

Best Regards,