Slideshow Reel Image Padding

Site URL: https://www.matthewjensen.com.au/work/circuit-emm6e

Hi there,

Wondering if you can help.

I have added some CSS code from various sources on this forum, but would just like to make a couple of adjustments.

I would like to reduce the padding between the above and below Image sections by about half on both Mobile and Desktop view.

I would like to make the arrows on mobile closer to the images (i.e. less padding) on both mobile and desktop.

I would like to reduce the padding between images with their containing section, particularly on desktop.

Hope you can help out.... I am so close!

The Current coding I have used:

Pass = mattstar75  

.gallery-reel-item img {left: 0px !important;}
.gallery-reel-item img {
    transform: scale(.75
    
    );
}

/* Reel right arrow */
button.gallery-reel-control-btn[aria-label="Next Slide"]>div {
    background-image: url(https://www.flaticon.com/svg/static/icons/svg/709/709586.svg) !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
button.gallery-reel-control-btn[aria-label="Next Slide"]:before {
    background: none !important;
}
button.gallery-reel-control-btn[aria-label="Next Slide"]>div>* {
    visibility: #8888888;
}
button.gallery-reel-control-btn[aria-label="Previous Slide"]>div {
    background-image: url(https://www.flaticon.com/svg/static/icons/svg/709/709586.svg) !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    transform: rotate
}
button.gallery-reel-control-btn[aria-label="Previous Slide"]:before {
    background: none !important;
}
button.gallery-reel-control-btn[aria-label="Previous Slide"]>div>* {
    visibility: #;
}
button.gallery-reel-control-btn {
    background: none;
}

Cheers

Matt