Add padding to carousel images

Site URL: https://scipioni-enterprises.squarespace.com

I have added some script to my home page so that my gallery will scroll automatically. I would like to be able to use a carousel instead of a slide show. Even though the script does enable the images to scroll automatically, the images are flush up against each other. Is there an additional line or two that I can add to get some padding between images?

Quote

<script>
   Y.on('domready', function () {
       var galleries = Y.Squarespace.GalleryManager.getGalleries();
       for( i = 0; i<galleries.length; i++){
           galleries.setAttrs({"autoplay":true})
       }
   });
</script>

Padding for small thumbnails or?

I'm trying to set the gallery up as a carousel. The thumbnail images only apply to a slide show, I believe. When I put the gallery into a carousel, they are flush up against each other. It's not an issue in the slide show, because I only get one image at a time in the view. See what I am getting in the attachment. I want those to scroll, but I also want at least 10px between them. Thanks!

here different your screenshot

Yes, that is what I am using now because I can't figure out how to get the padding on the carousel and it looks really bad. The screenshot I posted was the way it looks when I try to use a carousel. I am using a slide show because i can't get the carousel to behave the way I want it to. 

Can you provide the code for the padding? As I said, I have added code for the autoscroll, but now I need it for the padding. This is what I have right now:

<script>
   Y.on('domready', function () {
       var galleries = Y.Squarespace.GalleryManager.getGalleries();
       for( i = 0; i<galleries.length; i++){
           galleries[i].setAttrs({"autoplay":true})
       }
   });
</script>