Gallery Block Slideshow Arrow Styling

I'm hoping to style the gallery block arrows on this page - https://www.brontegroup.com.au/elia-taylor

Is it possible to remove the background to the arrow and make them larger and black?

Is it also possible to move their positioning on mobile so they don't sit on top of the images?

#1. Add to Website > Website Tools (under Not Linked) > Custom CSS

/* Gallery block arrows */
.sqs-gallery-controls .previous, .sqs-gallery-controls .next {
    background-color: transparent !important;
    color: black !important;
}

.sqs-gallery-controls .next:before, .sqs-gallery-controls .previous:before {
    font-size: 30px !important;
}

#2. Which position you want?

Thank you! That's perfect for the style. For #2 on mobile, is it possible to move the arrows outwards (or make the images slightly smaller) so they don't sit on top of the image?