sigProPolaroids can possibly be swapped for sigProContainer so you can alter the settings for other styles.

/* Simple Image Gallery Pro - Make Polaroid container slimmer - Polaroids Line 15 */
ul.sigProPolaroids {
    /*clear: both;
    list-style: outside none none;
    margin: 20px !important;
    overflow: hidden;
    padding: 40px 60px !important;*/
	padding: 20px 20px !important;
}

/* Simple Image Gallery Pro - Add baclground to the gallery container - Polaroids Line 15 */.
ul.sigProPolaroids {
  
  /*background-image: url('../../../images/pages/home/farm-shadow.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  
  or shorthand below
  
  */
  
  background: url('../../../images/pages/home/farm-shadow.jpg') no-repeat center;
  background-size: 100%;
}

Center Simple Image Gallery

This works for both the Pro and non-Pro, but does not centre properly in mobile/narrow view.

<div style="margin: auto auto; max-width: 80%;">{gallery}images{/gallery}</div>

The key is that the div must have a width set less than 100%. you cannot center somethign that is 100% wide.

The following does not work:

<div style="max-width: 80%; text-align: center;">{gallery}images{/gallery}</div>

Center Single/Multiple Simple Image Gallery

This works in desktop, when in mobile, the galleries do not center but do form a single column

<div style="text-align: center;">
    <div style="display: inline-block;">
        <div style="float: left;">{gallery}sophie/1{/gallery}</div>
        <div style="float: left;">{gallery}sophie/2{/gallery}</div>
    </div>
</div>
<div style="clear: both;">&nbsp;</div>

This code works in all viewports (using floats)

<div style="text-align: center;">
    <div style="display: inline-block;">
        <div style="float: left;">{gallery}sophie/1{/gallery}</div>
    </div>
    <div style="display: inline-block;">
        <div style="float: left;">{gallery}sophie/2{/gallery}</div>
    </div>
</div>
<div style="clear: both;">&nbsp;</div>

<div style="text-align: center;">
    <div style="display: inline-block;">{gallery}sophie/1{/gallery}</div>    
    <div style="display: inline-block;">{gallery}sophie/2{/gallery}</div>    
</div>
<div style="clear: both;">&nbsp;</div>

Gallery Images are rotated

when you upload images to use in the simple image gallery some or all images have been rotated 90 deg.

This is down to the the image dimensions, there seems to be an issue with the max size. You will notice this more with portrait.

eg:

A portrait image of 1536px wide X 2048px High will rotate 90deg both in the thumbnail and the full size image (possibly points to the liabry or server).

To fix this just reduce the image height (keep ratio if you want) down from 2048. Reducing it even by 1px fixes the issue as it seems to be >= 2048px that the setup does not like