<div style="(%%initStart%%)width:100%;height:100%;(%%initEnd%%)display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;"
  id="fsi-showcase-####RandomID1####">
  <fsi-viewer id="fsi-viewer-####RandomID2####"
    style="flex: 1 1 100%;"
    width="100%"
    height="auto"
    plugins="resize,fullScreen"
    fullScreenElement="fsi-showcase-####RandomID1####"
  >
  </fsi-viewer>
  <fsi-imagegrid
	  style="flex: 1 1 60%;min-height:140px;"
		width="auto"
		height="100%"
		dir=""
    cellWidth="120"
	  cellHeight="101"
    %%Attributes%%
		viewerSelector="#fsi-viewer-####RandomID2####"
	>

    <fsi-imagegrid-template style="display:none">
      <div class="myImageGridImage" >
        <img class="fsi-image-grid-image"/>
      </div>
      <div class="myImageGridTitle">
        ###image.filename###
      </div>
    </fsi-imagegrid-template>

	</fsi-imagegrid>

	<style>
	      fsi-imagegrid .fsi-imagegrid-root .myImageGridTitle{
  				padding:0 4px;
  				font-size:11px;
  				text-align:center;
  				height:20px;
  				line-height:20px!important;
  				background-color:#000;
  				color:#999;
  				overflow:hidden;
  				text-overflow:ellipsis;
  				white-space: nowrap;
  			}

  			fsi-imagegrid .fsi-imagegrid-root div.myImageGridImage{
  				height:calc(100% - 20px);
  				background-color:#DDD;
  			}
  </style>
</div>
<!-- JSON:
{"mainTag":"fsi-thumbbar","dimTag":"div","dimOffsetHeight":190}
-->
