how to change the top padding for the carousel on my index page without affecting the other pages

Site URL: http://www.rubenalza.com

Hello!
my page is rubenalza.com and I Would like to change the top and left/right padding to ZERO or close to it for the carousel on the desktop version and also for the mobile version would like to display the carousel images on full height so the first thing you see is the images rolling and the head logo and menu bars. so it look like this one https://ruben-alza-bnmg.format.com/
thank you in advance.

This is a start. Others please feel free to contribute.

Add the following to Design > Custom CSS.

#collection-5d9eb3727ec40569f73dddd1 .Index-page:first-child .Index-page-content {

  padding-bottom : calc( 60px / 2 );
  
  }

#collection-5d9eb3727ec40569f73dddd1 .Index-page:first-child [class*=sqs-col] .sqs-block {

  padding-left : 0;
  padding-right : 0;
  
  }

@media screen and ( min-width : 641px) {

  #collection-5d9eb3727ec40569f73dddd1 .Index-page:first-child .Index-page-content {
  
    padding-top : 0;
    
    }
  }

Let us know how it goes.

On 2/6/2021 at 10:44 PM, creedon said:

This is a start. Others please feel free to contribute.

Add the following to Design > Custom CSS.

#collection-5d9eb3727ec40569f73dddd1 .Index-page:first-child .Index-page-content {

  padding-bottom : calc( 60px / 2 );
  
  }

#collection-5d9eb3727ec40569f73dddd1 .Index-page:first-child [class*=sqs-col] .sqs-block {

  padding-left : 0;
  padding-right : 0;
  
  }

@media screen and ( min-width : 641px) {

  #collection-5d9eb3727ec40569f73dddd1 .Index-page:first-child .Index-page-content {
  
    padding-top : 0;
    
    }
  }

Let us know how it goes.

thank you! it did help with the padding for the desktop version 🙂
now I'm trying to fix the mobile version to show images in the carousel a bit bigger