Decreasing padding between image blocks in 7.1 issues

Site URL: https://asimbawa.squarespace.com/work/operationpaperclip

Hi, 

Please see the attached images. I'm new to squarespace and have no prior coding knowledge.

I am working in a portfolio sub-page on a 7.1 template and have created lots of image blocks. I've tried to decrease the original padding around the image blocks, which has worked by using this custom code CSS:

.sqs-block.image-block {
 padding: 7px !important;
}

However, after entering in this custom code, the left and right edges of the image blocks are no longer aligned with the margins of my site. Does anyone know how I can fix this? I'm not sure why this problem is happening because I have already adjusted the spacing for the site margin and page width as I would like. 

To view my site please type in the password, which is: 2021problem

div#block-yui_3_17_2_1_1612625540558_4096 {
    padding-right: 5px !important;
}
div#block-yui_3_17_2_1_1612625540558_5228 {
    padding-left: 5px !important;
}

2 hours ago, tuanphan said:

div#block-yui_3_17_2_1_1612625540558_4096 {
    padding-right: 5px !important;
}
div#block-yui_3_17_2_1_1612625540558_5228 {
    padding-left: 5px !important;
}

 

I have tried this custom code you replied with, however, it does not work correctly. When I adjusted the 'px' value, the inner edges of the top 2 image blocks increase (see attached image).

What I would like to do is decrease the expanded pixels for all of the image blocks on the edges where it goes beyond the site margin. I have also highlighted this in the screenshot on the sides.